Publicar conteúdo encontrável em vários idiomas

Uma página só existe para o buscador e para o assistente de IA quando o servidor entrega o texto pronto, e cabeçalho e corpo dizem a mesma coisa. Quem decide a tecnologia do site e quer ser citado escolhe a montagem de cada página, preenche os quatro metadados e escreve a frase que o assistente copia.

Três caminhos entregam o conteúdo pronto para quem rastreia, e você escolhe página por página. A geração estática grava o arquivo na hora do build, a etapa que gera os arquivos do site, e serve o mesmo texto a todos. É o certo para blog e ficha de produto que muda pouco.

A montagem no servidor refaz a página a cada pedido, o certo quando preço ou estoque muda o dia inteiro. Componentes de servidor rodam no servidor por padrão e mandam ao navegador só o que precisa de interação. É o comportamento nativo do Next.js, o framework, o conjunto de ferramentas prontas que monta o site, recomendado para site novo.

Site de conteúdo sem área logada sai mais leve no Astro, que manda quase zero JavaScript ao navegador. Relatório único, aberto sem servidor e auditado linha a linha, fica em HTML puro com ES Modules, os arquivos de script que o navegador importa direto, sem empacotador. É a arquitetura que o manual de setembro de 2026 mantém para relatório offline.

O teste que resolve a dúvida em dez segundos: abra a página, desligue o JavaScript nas configurações do navegador e recarregue. Se o texto sumiu da tela, ele também some do índice do Google e da resposta do assistente.

O que o buscador e o assistente conseguem citar é um endereço. Aba, filtro e página de resultado que vivem só na memória do navegador não têm endereço, e o link copiado volta para a tela inicial. Guarde esse estado na URL, com o nuqs em React, e cada combinação de filtro vira uma página citável.

Onde a otimização para buscador e a acessibilidade importam, rolagem infinita é anti-padrão. O rastreador não rola, o leitor de tela não alcança o rodapé e a pessoa não consegue voltar ao item 40. Paginação numerada com endereço próprio resolve os três.

A Speculation Rules API, a lista, no HTML, dos endereços que o navegador busca antes do clique, pré-carrega a ficha do produto enquanto a pessoa lê a lista. O manual a recomenda para menus e paginação. Cada endereço listado gasta dado do celular de quem talvez nunca clique, por isso liste só o destino mais provável.

A função generateMetadata, o código que preenche título, descrição e endereço oficial da página, fica no arquivo da rota. Ela devolve um objeto que o Next.js transforma nas linhas do cabeçalho, e a descrição fica entre 150 e 160 caracteres.

Se a rota responde em /blog/artigo e a URL preferida declarada no rel=canonical diz /blog/artigo/, o Google trata a página como cópia e ela sai do índice sem aviso. O endereço declarado precisa casar, barra por barra, com o que o site serve.

O JSON-LD, um bloco de texto dentro da página, no vocabulário schema.org, dizendo o que ela é, descreve autor, data e organização. Preencha só o que a página mostra de verdade: marcar algo que não aparece no texto visível é motivo declarado de penalidade nas diretrizes do Google.

Por hora investida, o que rende mais é a cápsula de resposta, a frase curta que responde direto à pergunta do título, logo no início da seção. Abra cada seção com a pergunta real como título e responda na primeira frase, em texto que se sustente sozinho fora da página.

Antes de publicar uma página nova, desligue o JavaScript do navegador e recarregue. Se o texto sumir da tela, ele some do índice e da resposta do assistente; troque a montagem antes de seguir adiante.

Depois escreva o título como a pergunta que a pessoa faz. Responda na primeira linha, com número e condição: R$ 420 o casal, com café da manhã. É essa frase que o assistente copia.

Catálogo por idioma, formatação e direção pelo navegador

Levar o produto para outro idioma é dois trabalhos: o de engenharia, feito uma vez, e o de conteúdo, repetido a cada mercado. O custo do segundo quase iguala o do primeiro, porque cada tela precisa ser reaberta à mão.

Quem decide expandir estima o prazo pelo catálogo de chaves, pela formatação delegada ao navegador e pelo critério entre quatro bibliotecas.

Quem mistura os dois trabalhos cola lógica de tradução dentro do componente, a peça de tela que se repete, e a conta aparece no segundo idioma. A saída é uma indireção simples: cada texto recebe um identificador, a chave, e o produto pede o texto por essa chave.

A tradução vive num catálogo por idioma, um pt-BR.json e um en-US.json com as mesmas chaves preenchidas, e acrescentar um idioma vira entregar mais um arquivo.

A regra mais barata: nunca monte frase traduzida juntando pedaços. A ordem das palavras muda de idioma para idioma. Em alemão o verbo vai para o fim, em japonês o objeto vem antes do verbo, em árabe a frase corre ao contrário. O operador de soma congela a ordem do português dentro do código, onde nenhuma tradução consegue consertá-la.

A chave leva a frase inteira com marcador de variável, como t("inbox", { total }), e o catálogo guarda "Você tem {total} mensagens". Quando a frase varia por quantidade, a variação entra nela mesma, no formato ICU: "{total, plural, one {# mensagem} other {# mensagens}}". O tradutor passa a controlar a frase toda, incluindo a posição da variável.

Data, número, moeda e plural têm formatação nativa em todos os navegadores relevantes, pela API Intl, a interface que o navegador expõe para formatar valores por idioma. Monte o preço à mão e você erra separador, posição do símbolo e casa decimal. O real sai R$ 1.234,56, o dólar inverte ponto e vírgula, e o iene não tem casa decimal.

O Intl.PluralRules resolve o plural: o árabe tem seis categorias, o russo quatro, o polonês três, e o navegador informa qual categoria uma quantidade ativa. A direção de leitura vem do CSS. Margem e alinhamento escritos em início e fim da linha, como margin-inline-start e text-align: start, espelham o layout sozinhos em árabe e hebraico.

A biblioteca junta catálogo, roteamento por idioma e formatação, e o critério de escolha em 2026 é onde a mensagem é resolvida. O Paraglide JS e o Lingui compilam as mensagens no build. Cada chave vira uma função e o navegador recebe só o idioma pedido, com custo zero na borda de rede que atende quem acessa perto de casa.

O Paraglide tem suporte oficial a TanStack Start, SvelteKit e Astro desde janeiro de 2026. O next-intl segue como padrão para o Next.js com App Router, porque integra com o roteamento por prefixo de idioma e funciona em componente de servidor. O react-i18next fica para a base legada, porque migrar catálogo que funciona sai mais caro que o ganho.

Escreva o nome escolhido dentro do pedido ao agente, porque pedido sem nome de biblioteca volta com uma opção que ninguém no time conhece. Para o next-intl, instale, crie os arquivos de mensagem de cada idioma com as mesmas chaves, e crie o arquivo que devolve as mensagens do idioma ativo.

Mova as páginas para a pasta do idioma e acrescente o redirecionamento da raiz para o idioma padrão.

Antes de publicar a segunda versão, abra a mesma tela nos dois endereços de idioma e confira se preço, data e plural mudam de formato sozinhos. Se não mudarem, a chamada ainda está escrita à mão, e o texto solto precisa virar chave.

O sinal mais barato de que falta chave é o preço: formatado à mão, um aluguel de R$ 2.500,00 sai igual em espanhol, e a frase montada por soma erra o plural.