Estruturar a página com tags HTML que dizem a sua função
Descrição
Este critério verifica se o código da sua página indica a função de cada parte. O iPand verifica três pontos: um elemento <main> (ou role="main") e pelo menos dois elementos entre <header>, <nav> e <footer>; pelo menos metade do texto principal em elementos de texto (parágrafos, listas, títulos, células de tabela, citações, legendas); um atributo lang válido (BCP 47) em <html>.
O segundo ponto não é avaliado quando o texto principal tem menos de 100 palavras.
Por que isso importa para as IAs
As tags semânticas separam o conteúdo principal do cabeçalho, do menu e do rodapé, e dizem o que é cada bloco: parágrafo, lista, tabela. Assim, um programa que lê o código encontra o texto útil da página sem precisar adivinhá-lo pelo layout.
- <main> distingue o conteúdo próprio da página do que se repete em todo o site.
- Um texto em parágrafos e listas se divide com mais clareza que um texto solto em <div> sem função.
- Segundo o W3C, o atributo lang é usado por motores de busca, ferramentas de tradução e sintetizadores de voz.
Como corrigir
- 1 Delimite as grandes áreas da página Envolva o conteúdo próprio da página em um único elemento <main>, o cabeçalho do site em um <header>, o menu em um <nav> e o rodapé em um <footer>. Se o seu tema só usa <div>, peça ao seu desenvolvedor ou ao criador do tema que os substitua.
- 2 Escreva o texto em parágrafos e listas Coloque cada parágrafo em um <p>, as enumerações em <ul> ou <ol> com um <li> por item, e os dados comparáveis em uma <table>. Evite texto colocado diretamente em <div> ou <span>: pelo menos metade do texto principal deve estar em elementos de texto.
- 3 Declare o idioma da página Adicione o atributo lang à tag <html> com um código BCP 47: lang="pt" para português, lang="pt-BR" para o português do Brasil, lang="en" para inglês. Em um site em vários idiomas, cada versão declara o próprio idioma.
- 4 Verifique a estrutura Na ferramenta de inspeção do seu navegador, localize os elementos <main>, <header>, <nav> e <footer>, e depois o atributo lang da tag <html>. Confira também se o texto principal está em <p> e <li>, e não em <div>.
Pontos-chave
Áreas nomeadas, texto em parágrafos e idioma declarado tornam a página legível sem adivinhar o layout. O iPand verifica esses três pontos todos os dias no código da página.
