Títulos ajudam a pessoa a entender o assunto e a localizar uma seção sem ler tudo em sequência. No HTML, sua ordem também descreve a relação entre partes do documento. Escolher um nível apenas porque ele tem o tamanho visual desejado pode criar uma estrutura confusa para navegação por leitor de tela, teclado e tecnologias que oferecem listas de títulos.
Planeje a página como um sumário
Antes de formatar, escreva uma sequência simples: assunto principal, seções e subseções. O título da página representa o conteúdo central; seções principais explicam partes importantes; subtítulos menores detalham uma dessas partes. Se os títulos não formam um mapa compreensível, talvez a organização ou o escopo da página precise de revisão.
Leitura complementar no acervo da Você Digital: Navegação por teclado: revise o caminho completo do site.
A W3C explica como títulos estruturam uma página. Eles permitem reconhecer tópicos e navegar por níveis. Títulos do mesmo nível indicam seções paralelas; níveis inferiores agrupam conteúdo subordinado. Evite pular de H2 para H4 sem uma razão estrutural, ainda que o estilo visual pareça funcionar.
Em páginas longas, um sumário visível pode ajudar a saltar entre seções. Seus links precisam apontar para identificadores únicos e acompanhar os títulos reais. Se o texto muda, atualize tanto o cabeçalho quanto os destinos do sumário.
Leitura complementar no acervo da Você Digital: Vendas B2B de uniformes: organize grade de tamanhos e reposição.
Se sua empresa precisa transformar esse tema em ação, conheça a criação de site.
Diferencie semântica de estilo visual
Um H2 não é apenas um parágrafo grande e um H4 não é apenas uma fonte menor. A hierarquia informa estrutura no código, enquanto CSS controla aparência. Use os estilos do sistema de design para decidir tamanho, peso e espaçamento; escolha o elemento HTML pelo papel do título.
Leitura complementar no acervo da Você Digital: Página 404: oriente o visitante quando um endereço não existe mais.
Evite aplicar título a uma frase apenas para deixá-la em negrito. Isso adiciona um ponto de navegação que não organiza conteúdo. Da mesma forma, não use texto em negrito como substituto de título quando a seção é suficientemente importante para ser percorrida no índice estrutural.
Leitura complementar no acervo da Você Digital: Texto de link: deixe o destino compreensível sem adivinhação.
Uma estrutura com vários títulos de nível 1 pode ser válida em alguns contextos modernos, mas o template do site precisa ter um padrão coerente. No blog, confirme como o título editorial da página e o conteúdo do artigo são apresentados pelo layout. O conteúdo não deve repetir o mesmo título principal dentro do Markdown quando o template já fornece esse elemento.
Leitura complementar no acervo da Você Digital: Checklist de manutenção mensal para o site de uma pequena empresa.
Escreva títulos que descrevem o conteúdo
Use palavras que anunciem o tema da seção, não apenas um jogo de linguagem interno. “Prazo e responsabilidade” ajuda a encontrar uma cláusula; “o próximo passo” pode ser adequado quando a seção realmente explica o que vem em seguida. Títulos específicos são úteis para todos, inclusive leitores que navegam pela lista de cabeçalhos.
Leitura complementar no acervo da Você Digital: Acessórios de camping: organize conteúdo incluído na embalagem.
Evite títulos longos que repetem o parágrafo seguinte ou cabeçalhos idênticos em várias seções. Seções paralelas podem começar com o mesmo padrão, mas cada uma deve dizer seu assunto. Não coloque números no nível do título sem necessidade; listas ordenadas já comunicam sequência.
Leitura complementar no acervo da Você Digital: Expedição de livros: proteja quinas e confira o estado do exemplar.
A orientação da W3C sobre escrita acessível para a web recomenda cabeçalhos que transmitam significado e estrutura. Um sumário de títulos bem redigidos permite prever a página e decidir onde concentrar atenção.
Revise a ordem no código e na tela
Use as ferramentas do navegador ou um inspetor de acessibilidade para listar títulos e níveis. Confira se a sequência representa o conteúdo e se todos os itens importantes são alcançáveis. Faça uma leitura visual para verificar contraste, tamanho e espaçamento. A aparência pode ser clara enquanto a estrutura programática está errada, e o inverso também pode acontecer.
Leitura complementar no acervo da Você Digital: Produtos com validade: crie uma rotina simples de conferência.
Teste zoom e tela pequena. Títulos que quebram em muitas linhas podem desorganizar a hierarquia visual; cor ou tamanho insuficientes podem tornar seções difíceis de localizar. Ajuste apresentação sem mudar o nível semântico apenas para acomodar o layout.
Leitura complementar no acervo da Você Digital: Ferragens online: monte fichas com medidas e unidades claras.
Em conteúdo criado por CMS, revise modelo de blocos, componentes e texto colado de documentos. Conteúdo copiado pode trazer estilos e níveis inesperados. Um processo editorial pode normalizar títulos, mas precisa preservar divisões que tenham significado.
Leitura complementar no acervo da Você Digital: Estoque de velas: separe fragrâncias para evitar erros de expedição.
Corrija em lotes e mantenha o padrão
Comece com modelos que publicam muitas páginas: artigo, serviço, produto e página de categoria. Corrija componentes para que autores não precisem improvisar nível de título a cada publicação. Em seguida, priorize páginas longas ou com navegação por sumário e verifique exemplos antes de atualizar todo o acervo.
Leitura complementar no acervo da Você Digital: Artigos pet: deixe claras as medidas de coleiras e peitorais.
Registre convenções como título principal do template, nível inicial de seções do corpo, formato de subtítulos e tratamento de caixas laterais. Desenvolvedores, designers e editores devem usar o mesmo mapa, mesmo que controlem partes diferentes da página.
Leitura complementar no acervo da Você Digital: Retirada local: organize horários e confirmação dos pedidos.
Uma auditoria simples pode percorrer cada página sem olhar o estilo visual e anotar os títulos na ordem em que aparecem. O esquema resultante deve formar um resumo lógico: se a sequência pula de uma seção geral para um tópico que parece independente, talvez falte um título intermediário ou a relação esteja mal expressa. Confira também nomes repetidos como “Saiba mais” e “Outros” quando aparecem muitas vezes na mesma página. Se o CMS transforma um título em navegação lateral, veja se a hierarquia continua compreensível no celular. Só depois de corrigir a estrutura escolha tipografia e espaçamento para reforçar visualmente a organização.
Leitura complementar no acervo da Você Digital: Eletrônicos usados: organize a descrição do estado de conservação.
A hierarquia de títulos é uma ferramenta de orientação. Uma ordem lógica, nomes descritivos e separação entre semântica e aparência ajudam leitores a entender a página, permitem navegação mais rápida e tornam o sistema editorial mais previsível.
Leitura complementar no acervo da Você Digital: Afiliados de organização: faça um tutorial para armários pequenos.
Leitura complementar no acervo da Você Digital: Pedidos por encomenda: calcule prazo para peças de madeira.
Leitura complementar no acervo da Você Digital: Utensílios de cozinha: descreva materiais sem exagerar benefícios.
Leitura complementar no acervo da Você Digital: Caixas de presente: prepare um calendário de produção realista.
Leitura complementar no acervo da Você Digital: Frete de tapetes: compare medidas dobradas e enroladas.
Leitura complementar no acervo da Você Digital: Brinquedos com pilhas: explique conteúdo e uso na ficha do produto.
Leitura complementar no acervo da Você Digital: Checkout mobile: encontre atritos na compra de acessórios esportivos.
Leitura complementar no acervo da Você Digital: Presentes personalizados: organize a aprovação da arte do cliente.
Leitura complementar no acervo da Você Digital: Peças de reposição: cadastre compatibilidade antes da primeira venda.
Leitura complementar no acervo da Você Digital: Cosméticos em transporte: controle vazamento e calor na entrega.
Leitura complementar no acervo da Você Digital: Papelaria online: organize variações sem confundir os compradores.
Leitura complementar no acervo da Você Digital: Fotos de joias pequenas: mostre escala, brilho e acabamento.
Leitura complementar no acervo da Você Digital: Embalagem para cerâmica: reduza avarias sem inflar o frete.
Leitura complementar no acervo da Você Digital: Core Web Vitals: priorize rapidez nas páginas que ajudam a decidir.
Leitura complementar no acervo da Você Digital: Página de agradecimento: confirme o envio e guie o próximo passo.
Leitura complementar no acervo da Você Digital: Página de preços de serviço: mostre escopo e diferenças reais.
Leitura complementar no acervo da Você Digital: Texto de botão: chamada clara para a ação certa.
Comentários
Nenhum comentário publicado ainda. Compartilhe uma ideia ou dúvida sobre este artigo.