Desenvolvimento Web – HTML
Desenvolvimento Web – HTML
Ementa: Ao longo das oito aulas deste curso, será possível aprender sobre o HTML e, com essa linguagem, elaborar diversas páginas. Tudo isso utilizando conceitos sobre tags, manipulação de textos, de imagens, formulários, login e tabelas. No final, o aluno irá elaborar uma página mais completa envolvendo vários conceitos aprendidos no decorrer do curso. O curso é composto por aulas com animações, nas quais ele terá uma apresentação do que será visto naquela etapa e, também, o conceito que será aprendido. Depois, haverá simulações, nas quais o conceito é colocado em prática e, para isso, o aluno realizará os passos para a construção dos objetos da aula.
Mercado de trabalho/Público-alvo: Os conhecimentos adquiridos com o curso Desenvolvimento Web – HTML, se aplicam ao mercado de trabalho de forma ampla para atuação em desenvolvedor de Web, em todo o tipo de empresa de pequeno a grande porte, além de agências focadas em marketing digital e criação de sites.
Carga horária: 8h
Conteúdo Programático
Aula 1 – Introdução ao HTML
- Conhecer a história da internet;
- Aprender sobre o surgimento do HTML;
- Compreender o que é a linguagem HTML;
- Saber o que são tags e como funcionam: Exemplos de tags (<html>,<body>, <h1> e<img>) e entender a estrutura de abertura e de fechamento das tags;
- Conhecer o HTML5;
- Entender os benefícios que os editores de HTML têm em comum;
- Conhecer editores de texto e de HTML, as suas vantagens e as suas desvantagens: Bloco de Notas, Dreamweaver e Atom;
- Criar um projeto Hello World;
- Utilizar tags básicas: <html>, <body>, <h1>, <head> e <title>.
- Compreender a hierarquia da estrutura do HTML;
- Instalar o Atom;
- Abrir um arquivo .html no programa;
- Alterar a cor de fundo do Atom;
- Editar código: Salvar e visualizar no navegador.
Aula 2 – Semântica e manipulação de texto
- Entender o que é semântica;
- Aprender sobre o uso da tag<div>;
- Conhecer outras tagssemânticas;
- Conhecer as tags de manipulação de textos: <h>, <p>, <span> e <pre>;
- Conhecer as tags para formatar elementos de texto do HTML5: <b>,<u>, <i>, <small>, <strong>, <em> e <mark>;
- Aprender sobre o funcionamento dos links;
- Entender como utilizar a tag <a> para adicionar links;
- Compreender os atributos da tag <a>: href e target.
- Entender o que é e a importância da Política de privacidade;
- Montar uma estrutura inicial para uma página de Política de privacidade: Adicionar elemento <meta> e título e criar e estilizar cabeçalho e rodapé;
- Adicionar o menu de navegação na página: Criar links com IDs;
- Inserir tópicos de texto.
Aula 3 – Manipulação de imagens
- Conhecer algumas tags de manipulação de imagens: <img>, <figure> e <picture>;
- Iniciar a criação de uma página com álbum de fotos:
- Criar cabeçalho;
- Utilizar elementos CSS para estilizar: Definir estilos e importar e utilizar fonte personalizada.
- Adicionar imagens no álbum de fotos:
- Utilizar a tag <img>: Estilizar tamanho e posição das imagens.
- Aplicar a tag <picture>: Definir 2 imagens, sendo uma para cada resolução.
- Inserir foto na tag<figure>;
- Colocar rodapé na página.
Aula 4 – Listas
- Entender as funções das listas;
- Conhecer as listas não ordenadas e como utilizá-las: Saber como personalizar o marcador dos itens da lista;
- Entender o conceito de listas ordenadas;
- Saber como criar uma lista ordenada: Conhecer as personalizações dos marcadores;
- Iniciar a criação de uma página com uma receita de bolo: Criar cabeçalho, Inserir lista de ingredientes, Adicionar imagens da receita pronta, Criar uma lista não ordenada, Colocar duas listas ordenadas e Inserir um rodapé na página.
Aula 5 – Tabelas
- Entender a importância das tabelas;
- Aprender a inserir tabelas: <table>;
- Compreender a estrutura hierárquica das tags que formam uma tabela;
- Iniciar a criação de uma página de um blog de finanças:
- Criar cabeçalho;
- Adicionar tabela: Inserir cabeçalho e Alinhar elementos do cabeçalho;
- Adicionar o corpo da tabela;
- Incluir rodapé na tabela;
- Acrescentar um rodapé na página.
Aula 6 – Novos elementos e tags do HTML5
- Entender as melhorias do HTML5;
- Conhecer elementos novos trazidos pelo HTML5: Progress, Article e Summary.
- Conhecer os elementos: Video, Blockquote e Iframe.
- Entender a função de um arquivo bootstrap;
- Importar um arquivo CSS para o HTML;
- Criar uma barra de progresso;
- Usar a tag <article> para adicionar parágrafos de um artigo;
- Adicionar vídeo na página;
- Incluir citação;
- Importar um site inteiro para dentro da página;
- Criar rodapé com item expansivo.
Aula 7 – Formulários
- Conhecer tags e atributos utilizados na criação de um formulário: <input> e seus atributos, <select> e <option>, <label>, <textarea> e <button>.
- Criar uma página de login: Adicionar os campos Usuário e Senha, Inserir o atributo <checkbox>, Adicionar botão, Linkar botão da página atual com outra.
- Construir um formulário de cadastro.
Aula 8 – Projeto final
- Aprender sobre o One Page;
- Entender o que é um site One Page;
- Compreender o conceito de framework;
- Iniciar a criação de um site One Page: Importar arquivos CSS, Inserir menu, Criar a sessão Home, Adicionar a sessão Sobre, Criar a sessão Serviços, Adicionar a sessão Portfólio, Incorporar um mapa, Acrescentar a sessão Fale Comigo e Criar um rodapé.
Você saibia? Alguns Cursos / Módulos podem ser comprados de forma individual (fora de um pacote de cursos). Caso este aqui esteja disponível para compra individual, você verá logo abaixo o preço e o botão de compra ?