HTML - HyperText Markup Language

O HTML é a linguagem fundamental para criar páginas web. É como o esqueleto de um site!

O que é HTML?

HTML (HyperText Markup Language) é a linguagem padrão para criar páginas web. Imagine o HTML como os alicerces de uma casa - ele fornece a estrutura básica sobre a qual tudo o mais é construído.

<!DOCTYPE html>
<html>
  <head>
    <title>Minha Primeira Página</title>
  </head>
  <body>
    <h1>Olá, Mundo!</h1>
    <p>Esta é minha primeira página web.</p>
  </body>
</html>

Conceitos Fundamentais

Tags HTML

As tags são os blocos de construção do HTML. Elas são escritas entre sinais de menor e maior (<>).

<h1>Título Principal</h1>
<p>Este é um parágrafo.</p>
<a href="#">Link</a>

Estrutura Básica

Todo documento HTML tem uma estrutura básica com head e body.

<head>
  <title>Título da Página</title>
</head>
<body>
  <!-- Conteúdo da página -->
</body>

Títulos e Parágrafos

HTML oferece 6 níveis de títulos (h1 a h6) e parágrafos com a tag p.

<h1>Título Principal</h1>
<h2>Subtítulo</h2>
<p>Este é um parágrafo de texto.</p>

Links e Imagens

Links com <a> e imagens com <img> tornam as páginas interativas.

<a href="https://exemplo.com">
  Visite meu site
</a>
<img src="foto.jpg" alt="Descrição">

Listas

Crie listas ordenadas (<ol>) e não ordenadas (<ul>).

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
</ul>

Tabelas

Organize dados em linhas e colunas com tabelas HTML.

<table>
  <tr>
    <th>Nome</th>
    <th>Idade</th>
  </tr>
  <tr>
    <td>João</td>
    <td>25</td>
  </tr>
</table>

Exercício Prático

Crie sua Primeira Página HTML

Tente criar uma página HTML simples seguindo estes passos:

Abra o Bloco de Notas (ou qualquer editor de texto)
Copie o código básico da estrutura HTML
Adicione um título <h1> com seu nome
Adicione um parágrafo <p> com uma breve descrição sobre você
Salve o arquivo com o nome index.html
Abra o arquivo no navegador

<!DOCTYPE html>
<html>
  <head>
    <title>Minha Página</title>
  </head>
  <body>
    <h1>Seu Nome</h1>
    <p>Olá! Eu estou aprendendo HTML.</p>
  </body>
</html>

Dicas Importantes

Sempre feche suas tags: <p>texto</p>
Use letras minúsculas para as tags
Idente seu código para melhor leitura
Adicione comentários com
Teste no navegador frequentemente