Hierarquia de títulos (HTML)

 A hierarquia de títulos (HTML) é a base de layout bem feito:

Vai do mais importante pro menos importante:

<h1> → título principal da página
<h2> → seções principais
<h3> → subseções
<h4> → subdivisões
<h5> → níveis mais específicos
<h6> → o mais “profundo” (menos usado)

Como pensar nisso (forma simples):

H1 = nome do livro

H2 = capítulos

H3 = tópicos dentro do capítulo

H4+ = detalhes dentro dos tópicos

Exemplo pratico:

<h1>Nome do Site</h1>

<h2>Layouts</h2>
<h3>Lovely Rabbit</h3>
<h3>Azure</h3>

<h2>Músicas</h2>

<h3>Playlists antigas</h3>

<h4>2009 - Festas</h4>

Regras importantes (essas fazem diferença real):

1. Só um <h1> por página (recomendado)

Ele é tipo o “tema central”.

Ex: nome do blog, título do post.

2. Não pular níveis:

Errado: 

<h1>Título</h1>
<h3>Subtítulo</h3>

Certo: 

<h1>Título</h1>
<h2>Subtítulo</h2>

3. Não usar só por tamanho:

Muita gente usa <h1> porque é grande, <h3> porque é menor… errado.

* Usa CSS pra aparência

* Usa <h*> pra significado

Por que isso importa?

* SEO (Google entende melhor seu site)

* Acessibilidade (leitores de tela usam isso)

* Organização mental (fica mais fácil estruturar)