SEO técnico para sites feitos em React (sem esperar pelo Google)

Se abrir o código-fonte de muitos sites feitos em React, encontra isto e mais nada de relevante: uma <div> vazia e um script. Todo o conteúdo aparece depois, quando o navegador executa JavaScript.

O Google consegue, na maioria dos casos, executar esse JavaScript e ver a página. O problema é que "na maioria dos casos" e "depois" são duas condições que ninguém quer ter no caminho da sua página de serviços.

Porque é que isto continua a ser um risco

A indexação de páginas que dependem de JavaScript acontece em duas passagens: primeiro o HTML, e só mais tarde — pode ser horas ou dias — a renderização. Nessa segunda fila, três coisas correm mal com frequência:

• Páginas novas demoram muito mais a entrar no índice
• Se um recurso falhar ou demorar de mais durante a renderização, a página é indexada incompleta
• Outros sistemas que leem a página — redes sociais, agregadores, muitos motores de IA — não executam JavaScript de todo

Esse último ponto tornou-se decisivo. Quando alguém partilha o seu site e aparece um cartão sem título nem descrição, não é um detalhe estético: é o sinal de que o conteúdo não existe no HTML.

A solução: gerar o HTML antes do visitante

Existem três abordagens e a escolha depende de com que frequência o conteúdo muda.

Pré-renderização estática

No momento do build, o site é renderizado uma vez por rota e gravado como ficheiro HTML completo. O visitante — e o motor de busca — recebe a página pronta; o JavaScript entra depois só para tornar a página interativa. É a opção certa para sites institucionais, portefólios e blogs, e é assim que este site funciona.

Renderização no servidor

O HTML é gerado a cada pedido. Faz sentido quando o conteúdo depende de quem está a ver ou muda ao minuto — catálogos com stock, plataformas com sessão iniciada. Custa mais infraestrutura e mais complexidade.

Híbrido

Páginas públicas estáticas, área privada em cliente. Na prática é o que a maioria dos projetos acaba por fazer, e é geralmente a decisão certa: o SEO só interessa nas páginas públicas.

Teste em dez segundos: desligue o JavaScript no navegador e abra o seu site. O que aparecer é, aproximadamente, o que os sistemas que não renderizam conseguem ler.

Meta tags: uma por rota, não uma para o site todo

O erro mais comum em aplicações de página única é ter um único título e uma única descrição no ficheiro HTML base, iguais para todas as páginas. O resultado são dezenas de páginas com o mesmo título nos resultados de pesquisa, a competirem umas com as outras.

Cada rota precisa do seu conjunto próprio, escrito no HTML entregue:

• title único, com a palavra que interessa à esquerda e a marca à direita
• meta description escrita para ser lida por pessoas, entre 140 e 160 caracteres
• link canonical absoluto, para não haver duas versões da mesma página
• Open Graph e Twitter Card, para a partilha não ficar vazia
• Dados estruturados em JSON-LD adequados ao tipo de página

Vale a pena manter este mapa de rota para metadados num único ficheiro, consumido tanto pelo cliente como pelo processo de geração do HTML. Assim o que o Google lê e o que o utilizador vê nunca divergem — e a divergência entre os dois é uma das causas silenciosas de perda de posições.

Dados estruturados que valem o esforço

Não é preciso marcar tudo. Para a maioria dos sites de empresa, três blocos chegam:

1. Organization, uma vez, com nome, logótipo, morada e perfis sociais — reutilizado por referência nas outras páginas
2. BreadcrumbList em páginas internas, que o Google mostra em vez do URL nos resultados
3. FAQPage onde existirem perguntas reais na página, e apenas aí

Um aviso: os dados estruturados têm de descrever o que está mesmo na página. Marcar avaliações que não existem ou perguntas que o visitante não vê é uma forma rápida de perder os resultados enriquecidos e a confiança do motor de busca.

Os erros que fazem páginas desaparecer

• Navegação feita com onClick em vez de âncoras — sem <a href>, não há ligação para seguir
• Sitemap gerado à mão que deixa de acompanhar as rotas reais ao fim de dois meses
• Conteúdo que só carrega depois de um clique ou de um scroll
• Rotas inexistentes a devolver a página inicial em vez de um 404 — o índice enche-se de duplicados
• Ambiente de testes indexado por esquecimento de uma linha no robots.txt

Nenhum destes problemas é difícil de resolver. São todos, no entanto, muito mais baratos de evitar na primeira semana do projeto do que de corrigir seis meses depois, com o site no ar e as posições já perdidas.