Como Criar um Arquivo HTML
-
Abra qualquer editor de texto (VSCode, Sublime Text, Notepad++, etc.).
-
Crie um novo arquivo.
-
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 atributolang="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:
Navegadores para Testes:
-
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!
-
Crie um arquivo chamado
index.html
. -
Copie e cole o código de exemplo.
-
Clique duas vezes no arquivo ou abra com o navegador.
-
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.