Usa uma hierarquia de cabeçalhos limpa

O que esta verificação faz

Analisa todos os elementos de cabeçalho da página (h1–h6) pela ordem do documento e verifica que os níveis descem sem saltos. A verificação falha quando um h4 aparece antes de qualquer h3, quando dois h1 ficam na mesma página, ou quando a profundidade da secção salta mais do que um nível de cada vez.

Porque é importante

Um esquema limpo importa em três frentes ao mesmo tempo.

• Leitores de ecrã anunciam o nível do cabeçalho a cada salto. Um utilizador que navegue por cabeçalhos (padrão comum em utilizadores não-visuais) ouve “cabeçalho nível 2 — funcionalidades, cabeçalho nível 4 — preços” e assume que perdeu um nível 3. A página fica innavegável.
• Motores de busca continuam a ler o esquema de cabeçalhos como pista sobre a estrutura temática. Um h1 seguido de cinco h3 sem qualquer h2 lê-se como um bloco plano de conteúdo em vez de um artigo organizado.
• Extratores de IA (ChatGPT browsing, Perplexity, Google AI Overviews) segmentam o conteúdo nas fronteiras dos cabeçalhos ao resumir. Uma hierarquia partida produz blocos que atravessam vários tópicos, baixando a qualidade da citação.

Como corrigir

Usa exatamente um h1 por página — normalmente o título da página. Todos os cabeçalhos seguintes descem, no máximo, um nível de cada vez:

<h1>Comparar auriculares sem fios em 2026</h1>
  <h2>O que testámos</h2>
    <h3>Qualidade de áudio</h3>
    <h3>Duração de bateria</h3>
  <h2>Melhor no global: Sony WF-1000XM5</h2>
    <h3>Prós</h3>
    <h3>Contras</h3>

O atalho do estilo visual. Os designers às vezes usam <h4> porque “fica do tamanho certo”. Não o faças — escolhe o nível que se encaixa no esquema do documento e estiliza-o depois com CSS. Tailwind: <h3 class="text-base font-semibold">.

WordPress / page builders. A maioria dos editores de blocos (Gutenberg, Elementor) deixa-te mudar o nível de um cabeçalho independentemente do seu estilo. Percorre a página uma vez e re-etiqueta cada bloco.

Astro / Next.js / React. Cria um pequeno wrapper <Section> que incremente um contexto de nível de cabeçalho, para que componentes reutilizáveis não fixem <h3> no código e partam o esquema quando aninhados.

Audita por ti — cola o URL da página no validador HTML do W3C e olha para a pré-visualização do esquema do documento, ou corre a extensão headingsMap no browser.

Perguntas frequentes

Posso ter dois h1 numa página?

O HTML5 tecnicamente permite vários h1 dentro de elementos <section> ou <article>, mas todos os fornecedores de tecnologia assistiva — e o Google — continuam a tratar um h1 por página como o padrão correto. Mantém-te num só. Vê a página Etiqueta H1.

E as sidebars e widgets?

Cabeçalhos dentro de <aside> ou em regiões de layout repetidas também contam para o esquema. Ou baixa-os para <h3> para aninharem sob o conteúdo principal, ou envolve-os num landmark com o seu próprio âmbito de cabeçalhos.

Isto afeta o Lighthouse ou as pontuações de acessibilidade?

Sim — heading-order é uma das regras do axe-core que o Lighthouse corre. Uma hierarquia partida baixa a tua pontuação de acessibilidade Lighthouse diretamente.