Primeiros Passos no HTML5

Se você está começando no desenvolvimento web, aprender HTML5 é o primeiro passo essencial. Nesta seção, vamos entender como criar um arquivo HTML, como ele é estruturado e quais ferramentas usar para desenvolver com eficiência.

Como Criar um Arquivo HTML

  1. Abra qualquer editor de texto (VSCode, Sublime Text, Notepad++, etc.).

  2. Crie um novo arquivo.

  3. Salve o arquivo com a extensão .html.
    Exemplo: index.html

Ao abrir esse arquivo no seu navegador (Chrome, Firefox, Edge, etc.), ele será renderizado como uma página web.

Estrutura Básica de um Documento HTML5

<!DOCTYPE html>
<html lang="pt-br">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Minha Primeira Página</title>
</head>
<body>
  <h1>Olá, Mundo!</h1>
  <p>Essa é minha primeira página HTML5.</p>
</body>
</html>

Entendendo a Estrutura:

  • <!DOCTYPE html>
    Indica ao navegador que este é um documento HTML5.

  • <html lang="pt-br">
    Elemento raiz do documento. O atributo lang="pt-br" informa que o conteúdo está em português.

  • <head>
    Contém informações sobre o documento (meta-informações, título, links para CSS e scripts).

  • <body>
    Contém tudo o que será exibido na página: textos, imagens, links, etc.

Ferramentas Recomendadas

Editores de Código:

  • Chrome

  • Firefox

  • Edge

  • Safari

Extensões Úteis:

  • Live Server (para VSCode) — atualiza a página automaticamente ao salvar.

  • Prettier — formata seu código.

  • HTML Hint — ajuda a identificar erros no código HTML.

Primeira Página Rodando!

  1. Crie um arquivo chamado index.html.

  2. Copie e cole o código de exemplo.

  3. Clique duas vezes no arquivo ou abra com o navegador.

  4. Pronto! Você criou sua primeira página HTML5. 🎉

Próximo Passo:

Na próxima seção, vamos mergulhar nos Elementos de Estrutura, entendendo cada parte do HTML que organiza e dá significado ao conteúdo da sua página.

Updated on