Carregando...

Títulos HTML

Já consegue escrever elementos e atributos. Esta lição foca nos títulos — as etiquetas que marcam o título principal e os títulos de secção de uma página. Bons títulos ajudam a percorrer a página e ajudam navegadores e ferramentas de assistência a entender o esquema.

O que são títulos HTML?

Os títulos HTML são seis níveis: h1, h2, h3, h4, h5 e h6. h1 é o nível mais alto da página. h6 é o mais baixo. Estas etiquetas são para significado e estrutura. O tamanho visual pode mudar depois com CSS; não escolha um nível só porque quer texto maior ou menor.

Resposta direta

Use títulos para construir um esquema claro. Prefira um h1 claro para o tema da página. Use h2 para secções principais sob esse tema, depois h3 para subsecções, e assim por diante. Mantenha os níveis em ordem quando puder — saltar de h1 direto para h4 costuma tornar o esquema mais difícil de seguir.

Níveis de título

html

HTML Code

<h1>Título principal da página</h1>
<h2>Título de secção</h2>
<h3>Título de subsecção</h3>
<p>Texto de parágrafo sob a subsecção.</p>

Ler o exemplo

h1 apresenta o tema de toda a página
h2 inicia uma secção principal sob esse tema
h3 inicia uma parte menor dentro dessa secção
O parágrafo é texto de corpo normal, não um título

Por que a ordem dos títulos importa

Os títulos criam um esquema do documento, semelhante a um índice. Leitores de ecrã e algumas ferramentas SEO usam esse esquema. Se saltar níveis só pela aparência, a estrutura fica confusa mesmo que a página lhe «pareça bem».

Um h1, depois secções

Para páginas de iniciante neste curso, mantenha um h1 claro. Depois organize o conteúdo com h2 e níveis mais profundos conforme necessário. Esquemas mais avançados virão depois; domine primeiro este padrão simples e legível.

Um pequeno esquema de página

html

HTML Code

<h1>Guia da cidade</h1>
<h2>Como se deslocar</h2>
<p>Dicas para autocarros e comboios.</p>
<h2>Comida</h2>
<h3>Comida de rua</h3>
<p>Snacks locais rápidos.</p>
<h3>Restaurantes para sentar</h3>
<p>Locais para uma refeição mais longa.</p>

Títulos não são para espaço vazio

Não use etiquetas de título vazias para criar espaço vertical. Não envolva cada frase a negrito num título. Se o texto não for um título real de secção, use um parágrafo ou outro elemento adequado.

Experimente você mesmo

Crie ou abra um arquivo HTML com o esqueleto básico
Adicione um h1 que nomeie o tema da página
Adicione duas secções h2 com um parágrafo curto sob cada uma
Sob um h2, adicione um h3 e um parágrafo curto
Guarde e abra a página — verifique se o esquema é fácil de percorrer

Erros comuns

Escolher níveis de título só pelo tamanho da letra em vez da estrutura
Saltar de h1 para h4 sem motivo
Usar muitos h1 numa página simples de iniciante quando basta um título principal claro
Meter parágrafos longos dentro de etiquetas de título
Usar títulos como espaçadores decorativos sem título real de secção

Resumo

Os títulos usam h1 a h6 para níveis de título
Constroem estrutura e esquema, não só tamanho visual
Prefira um h1 claro e depois secções h2–h6 ordenadas
Evite saltar níveis só por estilo
Mantenha o texto do título curto e com forma de título
Estilize o tamanho depois com CSS; mantenha os títulos HTML semânticos

🧠 Teste Seu Conhecimento

Pronto para Começar

Teste Seu Conhecimento

Desafie-se com este questionário interativo e veja o quão bem você entende o tópico

❓

Perguntas

🎯

70%

Para Passar

♾️

∞

Tempo

🔄

∞

Tentativas

📝 Instruções

Leia cada pergunta cuidadosamente
Selecione a melhor resposta para cada pergunta
Você pode refazer o quiz quantas vezes quiser
Seu progresso será mostrado no topo

Idioma