O que é HTML?

HTML significa HyperText Markup Language — ou seja, é a linguagem que estrutura todas as páginas que você vê na internet. Ela não é uma linguagem de programação, mas sim de marcação: você usa etiquetas (chamadas de tags) para dizer ao navegador o que cada parte do conteúdo representa.

Todo site que você já acessou começou com um arquivo HTML. E o seu vai começar agora.

---

O que você vai precisar

Não precisa instalar nada complicado. Para este projeto você vai usar:

• Um editor de texto — recomendamos o VS Code (gratuito)
• Um navegador — Chrome, Firefox ou Edge funcionam perfeitamente

---

Criando seu primeiro arquivo HTML

Passo 1 — Crie uma pasta para o projeto

Em qualquer lugar do seu computador, crie uma pasta chamada meu-primeiro-site.

Passo 2 — Crie o arquivo HTML

Dentro dessa pasta, crie um arquivo chamado index.html. O nome index é uma convenção — os servidores procuram esse arquivo por padrão quando alguém acessa um site.

Passo 3 — Escreva o código

Abra o arquivo no VS Code e escreva o seguinte:

<!DOCTYPE html>
<html lang="pt-BR">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Meu Primeiro Site</title>
  </head>
  <body>
    <h1>Hello, World!</h1>
    <p>Este é o meu primeiro projeto em HTML.</p>
  </body>
</html>

Passo 4 — Abra no navegador

Salve o arquivo e dê dois cliques nele. Ele vai abrir direto no seu navegador e você verá:

Hello, World! Este é o meu primeiro projeto em HTML.

Parabéns — você acabou de criar sua primeira página web! 🎉

---

Entendendo o código

Vamos entender o que cada parte faz:

Tag	O que faz
<!DOCTYPE html>	Avisa o navegador que este é um documento HTML moderno
<html lang="pt-BR">	Elemento raiz da página; lang define o idioma
<head>	Informações sobre a página que não aparecem na tela
<meta charset="UTF-8">	Garante que acentos e caracteres especiais funcionem
<title>	Define o nome que aparece na aba do navegador
<body>	Tudo que fica aqui aparece na tela
<h1>	Título principal da página
<p>	Um parágrafo de texto

---

Personalize o seu

Agora que funcionou, experimente fazer algumas mudanças:

• Troque o texto do <h1> pelo seu nome
• Adicione mais parágrafos <p> com um texto de sua escolha
• Mude o <title> para o nome que você quiser na aba do navegador

Salve o arquivo e atualize o navegador — as mudanças aparecem na hora!

---

Próximos passos

Agora que você criou sua primeira página, os próximos passos naturais são:

1. Aprender mais tags HTML — listas, links, imagens e tabelas
2. Adicionar CSS — para deixar a página com cores e estilos
3. Criar mais páginas — e linkar uma à outra com <a>

Continue acompanhando o blog para os próximos artigos da trilha de Programação Web. 🚀