Índice de Conteúdo
1. O que são títulos?
2. Porquê usar títulos?
3. Hierarquia de títulos
4. Tamanhos de títulos
5. Ordem dos títulos na fonte HTML
6. O Título H1
7. Subtítulos H2-H6
8. Perguntas frequentes sobre títulos
1. O que são títulos?
Os títulos são frases no início de uma secção que explicam do que se trata. A utilização correta de títulos numa página fornece uma hierarquia e uma visão geral, e ajuda a comunicar rapidamente do que se trata uma página web. Ajudam os visitantes a examinar rapidamente uma página e ajudam os motores de busca a compreender rapidamente a estrutura de uma página e do seu conteúdo.
Existem seis níveis de título: H1 a H6, os títulos H1, H2 e H3 são os utilizados com maior frequência. Os títulos são definidos no código HTML de uma página.
O título H1 é frequentemente referido como “título principal”, enquanto os títulos H2-H6 são referidos como “subtítulos”, isto porque indicam subníveis.
As etiquetas de título
As pessoas referem-se frequentemente a “tags de título” quando falam sobre títulos.
Para evitar qualquer confusão, vamos dar um exemplo e observar o elemento de título H1 tal como aparece no código-fonte HTML:
<h1>Este é um título H1</h1>
<h1>Abertura da tag título H1
Este é um título H1: o texto que vai aparecer no ecrã do visitante como titulo H1
</h1>:Fecho da tag título H1E as etiquetas cabeçalho <header>?
Antes de mais, não confunda as tags de título com a secção <head>. Em segundo lugar, as etiquetas de cabeçalho são frequentemente utilizadas incorretamente para se referir a títulos.
Na realidade podem ser utilizados para definir o cabeçalho de um documento ou secção. Isto significa que podem ser agrupados para ajudas à navegação ou em cabeçalhos. Usá-los é opcional, aqui está um exemplo:
<html>
<head>
<title>Títulos H1-H6 e SEO</title>
</head>
<body>
<article>
<header>
<h1>Etiquetas cabeçalho explicadas</h1>
<h2>Uma pequena introdução a etiquetas cabeçalho </h2>
</header>
</article>
</body>
</html>
2. Porquê utilizar títulos?
Os títulos são úteis tanto para os visitantes como para os motores de busca:
• Os visitantes utilizam os títulos para examinar rapidamente uma página e determinar se esta lhes parece relevante. Além do mais, os visitantes com deficiência visual utilizam leitores de ecrã para navegar na web. E os leitores de ecrã dependem dos títulos para “entender” as páginas web e ajudar os seus utilizadores a navegar.
• Os motores de busca utilizam títulos para compreender a estrutura de uma página e de que tópicos trata. Embora seja apenas um pequeno fator nos algoritmos de classificação dos motores de busca, a inclusão de palavras-chave nos títulos contribui para melhorar o desempenho do SEO. Mesmo que não concorde com a ideia de que os títulos representam um pequeno fator de classificação, lembre-se de que tudo o que faz para melhorar a experiência do utilizador se traduz, muitas vezes, num melhor desempenho de SEO.
Títulos e excertos em destaque
Os motores de busca podem exibir excertos em destaque, excertos especiais contendo extratos de uma página, no seu SERP (Search Engine Results Page – Página de Resultados do Motor de Busca) . Têm de compreender o conteúdo bem o suficiente para escolher esses excertos com segurança e baseiam-se nos títulos para o fazer. Em resumo, a utilização inteligente e correta dos títulos ajuda-o a aparecer nos excertos em destaque, o que por sua vez aumenta a sua visibilidade no SERP e direciona mais tráfego orgânico para o seu website.
Aqui está um exemplo de um excerto em destaque para o um site:
3. Hierarquia de títulos
Os títulos devem ser estruturados logicamente numa página. Uma página começa com o título H1, seguido de um título H2 e – caso necessite de outra subsecção – pode ser seguida de um título H3. Se precisar de mais subsecções, pode até adicionar subtítulos H4-H6.
Na ilustração abaixo, estamos a utilizar três níveis de títulos:
Não salte um nível na hierarquia. Por exemplo, não passe de um título H1 para um título H3. Deve haver um título H2 no meio.
Eis um bom exemplo de utilização correta de título:
<h1>Aqui uma descrição do tópico da página</h1>
<h2>Um subtítulo H2</h2>
<h3>Um subtítulo H3</h3>
<h2>Outro subtítulo H2</h2>
<h3>Outro subtítulo H3</h3>
Se estiver a escrever conteúdo longo, pode usar todos os títulos. Poderá ter uma estrutura de títulos como a descrita em baixo:
<h1>Aqui descrever o assunto da página</h1>
<h2>Um subtítulo H2</h2>
<h2>Outro subtítulo H2</h2>
<h3>Um subtítulo H3</h3>
<h4>Um subtítulo H4</h4>
<h5>Um subtítulo H5</h5>
<h6>Um subtítulo H6</h6>
<h2>Outro subtítulo H2</h2>
<h3>Um subtítulo H3</h3>
<h4>Um subtítulo H4</h4>
<h5>Um subtítulo H5</h5>
<h6>Um subtítulo H6</h6>
E aqui está um exemplo de uma hierarquia de títulos que deve evitar:
<h2>Título H2 no topo? Não!</h2>
<h4>Aqui um titulo H4?</h4>
<h1>Este título H1 deveria estar no topo do exemplo!</h1>
<h3>Um H3 aleatório aqui?</h3>4. Tamanho dos Títulos
Quanto mais aprofundar os títulos, mais pequenos eles devem ser. O título H1 deve ser o título com tamanho de letra mais alto da página. O título H2 deve ser ligeiramente menor que o H1 e, por sua vez, o título H3 menor que o título H2 e assim sucessivamente.
A imagem a baixo mostra um exemplo da diferença de tamanho dos títulos:
5. Ordem dos títulos na fonte HTML
Não importa a ordem pela qual os títulos aparecem no código fonte. A ordem pela qual os títulos são apresentados no ecrã do visitante (ou quando uma página é renderizada pelos motores de busca) é a ordem principal.
6. O Título H1
O título H1 descreve o tópico principal de uma página. Deve estar altamente relacionado com o conteúdo da página, deve ser único no seu website e uma página deve conter apenas um título H1.
Não coloque o título H1 à volta de uma imagem, pois os motores de pesquisa não compreendem as imagens tão bem como texto. Estaria a perder a oportunidade de sinalizar aos motores de busca do que se trata uma página.
<h1><img src="/logo.png"></h1>O seu título H1 pode corresponder ao título da sua página, mas não é imperativo. É muito mais provável que os visitantes reparem no seu título H1 do que no título da sua página, por isso, dê sempre prioridade a garantir que o seu título H1 faz sentido para os visitantes.
<title>O que são Títulos H1-H6?</title>
<h1>Explicando os Títulos H1-H6</h1>Comprimento do Título H1
Deve evitar tornar o título H1 demasiado longo. Se o fizer, há uma grande probabilidade de o título H1 não ser legível para os seus visitantes, o que prejudica a experiência do utilizador. Recomendamos manter um comprimento máximo de 60 caracteres, semelhante ao atributo título (title). Quanto ao comprimento mínimo, é necessário que seja suficientemente longo para fazer sentido. Um título com pelo menos 4 caracteres ajuda-o nisso. Importante: certifique-se de que o título H1 faz sentido para os visitantes.
Vários títulos H1? Nem pensar!
Quando a especificação HTML5 foi introduzida pela primeira vez, foi incluído o suporte para vários títulos H1 por página (cada um no seu próprio elemento de secção). No entanto, como os browsers não adotaram esta recomendação, o suporte para a mesma foi posteriormente abandonado quando a norma HTML5.1 foi publicada.
Outras utilizações para o título H1
Se não tiver definido um título de página, ou se os motores de pesquisa não considerarem o seu título suficientemente relevante, poderão mostrar o título H1 da página como o título no resultado do motor de busca da página – o seu excerto de página.
7. Títulos H2-H6
Os subtítulos H2-H6 são utilizados para estruturar ainda mais o conteúdo da sua página.
A maioria das páginas beneficia por ter pelo menos um título H2, mas se não fizer sentido para os visitantes incluir um, pode deixá-lo de fora.
Utilize os subtítulos H2-H6 onde fizer sentido e lembre-se de não saltar os níveis dos títulos.
8. Preguntas frequentes sobre títulos H1-H6
Os títulos melhoram realmente a posição da minha página?
Sim, melhoram! Ainda hoje, os títulos ainda desempenham um papel na comunicação da relevância das palavras-chave aos motores de busca. Embora o papel dos títulos nos algoritmos dos motores de busca tenha diminuído ao longo dos anos, enviam um sinal claro a estes sobre o assunto de uma página.
O título da minha página e o título H1 podem ser iguais?
Sim, podem. Mas lembre-se de escolher sempre um título H1 que seja o que faça mais sentido para os seus visitantes.
Posso ter vários títulos H1 numa página?
É recomendada a utilização de apenas um título H1 por página. Foram introduzidos vários títulos H1 por página com HTML5, mas os browsers não adotaram a prática. Desde o HTML5.1, não há suporte para vários títulos H1.
