Headings

Headings geralmente são usados para definir títulos e subtítulos na página. Há 6 níveis de headings. Eles são definidos pelas tags <h1> - <h6>. Exemplos:

<h1>Título</h1>
<p>Lorem ipsum dolor sit...<p>
<p>Lorem ipsum dolor sit...<p>
<h2>Subtítulo</h1>
<p>Lorem ipsum dolor sit...<p>
<p>Lorem ipsum dolor sit...<p>
<h2>Subtítulo</h1>
<p>Lorem ipsum dolor sit...<p>
<h3>Subtítulo</h3>
<p>Lorem ipsum dolor sit...<p>
<p>Lorem ipsum dolor sit...<p>

É importante usar uma estrutura correta dos headings. Isso torna o seu documento mais fácil de entender pelos motores de busca, e por isso é uma boa prática de SEO. Também é uma boa prática de acessibilidade, porque com cabeçalhos marcados corretamente, os leitores de tela podem compreender melhor o conteúdo do documento, o que melhora a experiência dos usuários de leitores de tela.

Estruturar os headings corretamente consiste principalmente em:

• não usar mais de um <h1> por página
• não pular níveis, ou seja, não ir do <h2> para o <h4>, por exemplo.
• evitar usar níveis muito profundos. Por que a sua página precisaria ir até o 5º ou o 6º nível? O ideal é ir no máximo até o 4º nível.
• Jamais usar headings para formatação. Marcação não deve ser usada para formatar a sua página. Se você quer deixar um título com uma fonte maior ou menor, ou em negrito, ou estilizar o elemento de qualquer outra forma, use CSS. Infelizmente, é muito comum ver developers mudarem o nível do heading porque o heading tem uma fonte que tem o estilo que ele quer.