HTML5 Completo

A anatomia do HTML e o seu boilerplate.

O que é um tag?

O que é um elemento?

Onde vai o conteúdo?

Vamos começar a codificar usando um poema para introduzir a ideia do HTML

Onde achar informação sobre os elementos e atributos do HTML.

Vamos falar da tag que abre tudo, html, e do que são atributos globais.

Vamos falar do elemento de metadados head e o que vai nele.

Todo texto precisa de título e é composto de parágrafos. Como fazer isso no HTML?

Vamos aprender como comentar o seu documento HTML. Como deixar lembretes para você , fazer documentação e as vezes até usar para testar seu código.

Vamos aprender elementos de formatação de texto, negrito, itálico, quebra de linha, régua horizontal, além do span, um elemento muito útil no seu uso de HTML.

Agora vamos aprender o coração da navegação na Web, os links. Vamos começar com os diferentes tipos de link.

Você sabe fazer um link para baixar um documento? Vamos ver aqui, além de atributos que ajudam na acessibilidade. Observação, o atributo download parou de funcionar no Firefox também nas últimas atualizações, mas ainda vale a pena saber de sua existência.

O atributo target merece uma aula à parte.

Site sem imagem é chato né, mas como colocar?

Você já sabe como colocar uma imagem, mas sabe onde ir procurar imagens legais?

Algumas novidades de 2024 sobre tratamento de imagem e geração de imagens e código.

O HTML tem 3 tipos de listas, você sabia? Vamos conhecer elas aqui e falar da lista desordenada, a mais comum para criação de menus.

Vamos botar ordem agora? Vamos falar da lista ordenada.

E se eu tiver uma lista de termos e suas descrições, como faço?

Dica de como fazer seus exercícios de agora em diante!

Aqui mostro a minha solução para a tarefa.

Vamos falar do cabeçalho e rodapé das nossas páginas web.

Onde colocar o conteúdo principal da página?

Um dos elementos mais importantes de um site, é uma boa navegação.

E agora, para separar meu conteúdo, o que começo a usar?

Como sei se meu conteúdo é um article ou um aside.

Você sabe o melhor lugar para colocar as informações de contato?

Quanta opção para uma simples citação, qual é a melhor?

Vamos aprender como colocar ilustrações de maneira mais semântica e fornecer várias opções de imagem.

Vamos aprender a colocar áudios e vídeos no nosso site.

Vamos voltar a falar de iframes e como adicionar vídeos do YouTube e mapas do Google.

Como colocar tabelas em um site e o que pode ser colocado numa tabela.

A tabela também tem elementos semânticos para dar um entendimento melhor.

Vamos aprender como declarar um formulário e como ele funciona.

Agora que sabemos o que precisamos para um formulário ser enviado vamos começar a ver seus elementos com a tag input.

Vamos adicionar caixas de texto e dropdowns de seleção ao nosso formulário.

Você sabe como o Google search faz para te dar sugestões de busca, vamos ver aqui.

Vamos organizar o nosso formulário visualmente.