Traducir un sitio web de Next.js: rutas por idioma rastreables y SEO

Aprende a traducir un sitio de Next.js con URL por idioma basadas en rutas, metadatos localizados, hreflang y un flujo de trabajo con glosarios fácil de mantener, sin depender exclusivamente de cookies para cambiar de idioma.

Grant DaviesActualizado

Traducir un sitio web Next.js: árbol de carpetas del App Router de Next.js con un nodo [locale] que conduce a una página sobre una cuadrícula blanca

Traducir un sitio web Next.js no consiste solo en trabajar con una biblioteca de i18n. Los motores de búsqueda necesitan URL distintas y rastreables para cada versión lingüística, con los metadatos y el contenido de la página incluidos en la respuesta HTML inicial. Los cambios de idioma basados en cookies o realizados únicamente en el cliente sobre una misma URL no ofrecen a Google páginas independientes que indexar.

Si necesitas una sola regla antes de profundizar en los segmentos de App Router: asigna a cada idioma su propia URL rastreable. Google recomienda usar URL diferentes para cada idioma o región, en lugar de depender únicamente de las cookies o del idioma del navegador. Los prefijos de ruta como /en/ y /de/, los subdominios específicos o los dominios independientes crean direcciones indexables. Los cambios basados solo en cookies sobre una misma URL no lo hacen.

Cambiar de idioma mediante cookies puede resultar cómodo durante el desarrollo porque evita duplicar rutas. Sin embargo, de cara al SEO en producción, este enfoque oculta las variantes lingüísticas a los rastreadores. Las versiones por idioma basadas en rutas ofrecen direcciones estables que puedes incluir en sitemaps, anotar con hreflang y supervisar en Search Console. Para profundizar en las diferencias entre una estrategia por mercados y una por idiomas, consulta nuestra guía sobre SEO internacional frente a SEO multilingüe.

Elige una estructura de URL por idioma para Next.js

Los equipos que trabajan con Next.js suelen elegir una de estas tres estructuras rastreables:

  1. Subdirectorios: example.com/en/docs, example.com/fr/docs. Fáciles de desplegar en un único host; jerarquía clara para hreflang.
  2. Subdominios: en.example.com, fr.example.com. Útiles cuando los equipos regionales trabajan con cierta independencia; también requieren enlaces hreflang recíprocos.
  3. ccTLD o dominios específicos: ofrecen la señal geográfica más fuerte cuando realmente se gestionan propiedades independientes; implican la mayor carga operativa.

Google determina el idioma de una página principalmente a partir del contenido visible. Elijas la estructura que elijas, mantén cada URL predominantemente en un solo idioma, incluidos la navegación, los enlaces del pie de página y las páginas de error. Evita mezclar idiomas en una misma plantilla si no hay un motivo claro que lo justifique de cara al usuario.

No redirijas automáticamente a los visitantes basándote en suposiciones sobre su idioma o ubicación. Google desaconseja este comportamiento porque puede bloquear a los rastreadores y frustrar a los usuarios. En su lugar, ofrece un selector de idioma visible que enlace a la URL de la versión correspondiente.

App Router y diseño de segmentos por idioma

En App Router, lo habitual es usar un segmento dinámico [locale]: app/[locale]/layout.tsx contiene las páginas localizadas. Define las configuraciones regionales admitidas en un único objeto de configuración y valida params.locale en los layouts o en el middleware. Las configuraciones regionales no válidas deben devolver un error 404, no mostrar la versión en inglés en la misma URL sin avisar.

El middleware puede redirigir / sin prefijo a una carpeta de idioma predeterminada, como /en/, pero las versiones alternativas deben seguir siendo accesibles mediante enlaces. Combina el middleware con generateStaticParams cuando generes páginas de marketing estáticas para que cada versión regional se genere de antemano.

Versiones por idioma mediante cookies o rutas: La negociación mediante cookies o cabeceras en una misma URL cambia el contenido sin modificar la dirección. Los rastreadores suelen acceder a cada URL una sola vez; no verán todas las variantes lingüísticas. Las versiones por idioma basadas en rutas (o sus equivalentes con subdominios o dominios) se ajustan a la recomendación de Google de usar URL diferentes. Las cookies pueden seguir guardando la preferencia del usuario después de que elija un idioma, siempre que las URL públicas sigan siendo distintas.

Usa next-intl, next-i18next o bibliotecas similares para cargar los mensajes, pero deja que el enrutamiento —y no solo las cookies— defina las URL públicas.

Localiza los metadatos, Open Graph y los datos estructurados

Cada ruta por idioma necesita su propio <title>, metadescripción, URL canónica y etiquetas Open Graph en el HTML renderizado en el servidor. En App Router, usa generateMetadata en cada página y obtén los textos traducidos de tus archivos de mensajes. El título y la metadescripción localizados no deben depender de un cambio de idioma en el cliente después de la hidratación.

Aplica el mismo rigor a JSON-LD: los bloques WebPage, Organization y FAQ deben usar textos traducidos y valores de inLanguage adecuados para la configuración regional. Si incluyes elementos de enlace hreflang, genera el conjunto completo de enlaces recíprocos en el layout o en la función auxiliar de metadatos de la página: la falta de enlaces de retorno rompe los grupos hreflang.

Hreflang, URL canónicas y mapas del sitio para Next.js

Hreflang indica a Google las URL alternativas para otros idiomas o regiones. Cada URL de un grupo debe hacer referencia a todas las demás, incluida ella misma, con los códigos correspondientes. Implementa hreflang en <head>, en las cabeceras HTTP o en los mapas del sitio XML mediante entradas xhtml:link. Elige un único método y úsalo de forma coherente en todo el sitio.

Cada URL localizada también necesita una etiqueta canónica que apunte a la URL preferida para ese idioma cuando existan duplicados (por ejemplo, por parámetros de seguimiento o versiones para imprimir). No establezcas la versión en inglés como URL canónica de una página en francés; las etiquetas canónicas consolidan duplicados dentro de un mismo idioma.

Genera mapas del sitio para cada configuración regional o un único índice de mapas del sitio que incluya todas las URL de los distintos idiomas. Los mapas del sitio facilitan el descubrimiento de páginas y pueden incluir anotaciones hreflang. Tras el despliegue, comprueba una muestra de URL con la herramienta de inspección de URL de Search Console y un proceso de pruebas de hreflang. Nuestra descripción general de la plataforma de SEO multilingüe explica cómo los equipos de SEO auditan estas señales en las distintas versiones regionales.

Evitar estructuras de idioma que dependen solo del cliente

Un error frecuente en Next.js es renderizar una estructura HTML en inglés y después sustituir los textos en useEffect. Los rastreadores pueden no ejecutar ese cambio de forma fiable, y los usuarios ven brevemente el contenido en el idioma equivocado. Los componentes de servidor, la generación estática o el renderizado del lado del servidor (SSR) deben incluir el contenido traducido en la primera respuesta. Los componentes de cliente pueden hidratar los elementos interactivos, pero los textos de marketing y los encabezados deben estar en el árbol de componentes del servidor.

Las rutas por configuración regional basadas en rutas de acceso o subdominios crean URL distintas que se pueden rastrear; los cambios de configuración regional basados únicamente en cookies no cumplen la recomendación de Google. Si utilizas un proxy de traducción para las vistas previas, asegúrate de que en producción se siga sirviendo HTML completo para cada URL localizada.

Flujo de trabajo de contenido: glosario, memoria de traducción y revisión

Las decisiones técnicas no dan resultado en el mercado si las traducciones se alejan de la terminología del producto. Complementa los archivos de internacionalización (i18n) de Next.js con un glosario, una memoria de traducción (MT) y una revisión humana. Las directrices de Google sobre contenido útil dan prioridad a las páginas pensadas para las personas; las versiones en otros idiomas con poco contenido o solo textos genéricos son poco eficaces tanto para el SEO como para servir de fuentes de respuestas.

Esquema del flujo de trabajo:

  • Extrae los textos de archivos JSON o PO e incorpóralos a un flujo compatible con herramientas de traducción asistida por ordenador (TAO).
  • Aplica los términos del glosario a los nombres de productos y las etiquetas de la interfaz.
  • Realiza controles de calidad lingüística en las URL del entorno de pruebas; no te limites a comparar los archivos fuente.
  • Vuelve a sincronizar cuando cambie el original en inglés; las versiones localizadas desactualizadas restan confianza.

Lista de comprobación para la implementación

Antes del lanzamiento, comprueba las rutas de rastreo, los metadatos y las anotaciones:

Las directrices para webmasters de Bing también hacen hincapié en el contenido útil y rastreable y en una estructura clara: las prácticas que favorecen a Google suelen facilitar también la indexación en Bing.

Errores comunes

Configuración regional basada solo en cookies en una única URL: oculta las variantes a los rastreadores.

Ausencia de enlaces hreflang de retorno: rompe la reciprocidad y debilita la agrupación de las páginas.

URL canónica en inglés en páginas traducidas: envía una señal de consolidación incorrecta.

Metadatos generados solo en el cliente: los títulos y las descripciones no aparecen en el HTML inicial.

Redirección automática por IP o Accept-Language: bloquea a los rastreadores e ignora la elección del usuario.

Elementos de la interfaz sin traducir: la navegación en varios idiomas dificulta la detección del idioma.

Traducción automática de contenido escaso y sin revisión: no cumple las expectativas de contenido útil.

Fundamentos de la búsqueda tradicional y los motores de respuestas

Las bases comunes de las rutas por configuración regional de Next.js y del HTML renderizado en el servidor siguen siendo importantes para Google, Bing y los motores de respuestas: versiones en cada idioma que puedan rastrearse, entidades claramente definidas, afirmaciones respaldadas por pruebas, datos estructurados que reflejen fielmente el contenido y una localización real, no simples estructuras con contenido solo en inglés. Considera las siguientes guías como enfoques específicos de cada plataforma para alcanzar el mismo nivel de calidad en la publicación multilingüe.

En la Búsqueda de Google, el descubrimiento depende de URL localizadas rastreables, con HTML en el idioma correspondiente, títulos y encabezados precisos y etiquetas hreflang recíprocas cuando existen versiones alternativas. Los fundamentos técnicos incluyen contenido indexable —no cambios de idioma basados únicamente en cookies—, metadatos localizados, mapas del sitio y un uso riguroso de las URL canónicas. La calidad del contenido exige que el contenido principal de cada idioma esté pensado ante todo para las personas; la autoridad proviene de una identidad clara de la organización y de fuentes que corroboren la información, no de la publicidad de herramientas de traducción. En un contexto multilingüe, esto implica que cada URL destinada a un mercado o idioma debe ser autónoma. Mide los resultados con la cobertura de Search Console y la inspección de URLs para cada versión localizada. Lo conocido frente a lo incierto: Google documenta el comportamiento multilingüe y de hreflang, pero no garantiza posiciones en los resultados por utilizar un CMS o un flujo de trabajo de posedición de traducción automática (MTPE).

Guía de plataforma: Bing

Bing descubre e indexa páginas multilingües rastreables con una estructura clara, con requisitos similares a los de Google en cuanto a la claridad de las URL y del contenido. Los fundamentos técnicos incluyen URL accesibles para cada versión regional o de idioma, contenido útil y seguimiento en Bing Webmaster Tools. Prioriza la localización de encabezados, afirmaciones y preguntas frecuentes frente a traducir únicamente los elementos de la interfaz. Las señales de autoridad siguen dependiendo de fuentes fiables y entidades coherentes. Implicación multilingüe: no ocultes los idiomas tras selectores que funcionen únicamente en el lado del cliente. Mide la indexación y las estadísticas de rastreo en Bing Webmaster Tools. Lo conocido y lo incierto: las directrices de Bing hacen hincapié en el contenido útil y rastreable; no inventes factores de posicionamiento exclusivos de Bing para las herramientas de traducción.

Guía de plataforma: ChatGPT

ChatGPT puede citar o resumir páginas de acceso público cuando las versiones lingüísticas están claramente identificadas y el contenido está preparado para responder preguntas. El descubrimiento no sigue el modelo convencional de rastreo y clasificación; la visibilidad consiste en que una página se seleccione como fuente o se mencione en las respuestas. Los fundamentos técnicos siguen partiendo de URL con HTML accesible, no de widgets superpuestos que ocultan el texto. Entre las características del contenido que ayudan están las respuestas directas, las preguntas frecuentes y la terminología coherente basada en glosarios. La autoridad proviene de las pruebas y de la coherencia de las entidades entre las distintas versiones localizadas. En un contexto multilingüe, esto implica que cada página localizada debe poder leerse de forma independiente. La medición es imperfecta: considera las comprobaciones de citas como hipótesis. Lo conocido frente a lo incierto: no existe ninguna garantía documentada de que la posedición de traducción automática (MTPE) o una integración con un CMS genere citas en ChatGPT.

Guía de plataforma: Gemini

Gemini y las experiencias de IA relacionadas de Google se benefician de entidades coherentes, datos estructurados precisos y páginas localizadas indexables. La visibilidad consiste en que el contenido se cite o se reconozca, no en inventar factores de posicionamiento para Gemini. Los fundamentos técnicos coinciden con los de la Búsqueda de Google en cuanto a rastreabilidad y calidad de los metadatos. El contenido debe presentar afirmaciones y definiciones claras en cada idioma. La autoridad depende de la coherencia de la organización y de la corroboración de la información. Implicación multilingüe: los nombres de producto sujetos a un glosario reducen la confusión entre versiones regionales o de idioma. Mide los resultados de forma tradicional con Search Console y analiza cualitativamente una muestra de respuestas de IA. Lo conocido y lo incierto: el comportamiento de Gemini no sustituye las directrices documentadas de la Búsqueda de Google sobre hreflang y las versiones de idioma.

Guía de plataforma: Google AI Overviews

Google AI Overviews puede enlazar a páginas que respalden sus respuestas; los criterios para poder aparecer siguen basándose en contenido indexable y pensado ante todo para las personas. No es un selector de idioma ni sustituye a hreflang. Los fundamentos técnicos siguen siendo el HTML rastreable de las versiones regionales o de idioma y los datos estructurados que reflejen fielmente el contenido. Entre las cualidades del contenido se encuentran las respuestas concisas y los encabezados claros en cada idioma. Las señales de autoridad reflejan los criterios de contenido útil. Implicación multilingüe: ninguna página traducida tiene garantizada su inclusión en AI Overviews. Consulta los informes sobre IA generativa de Search Console cuando estén disponibles y mantén separadas las métricas de indexación tradicionales. Lo conocido y lo incierto: ningún flujo de trabajo de traducción puede prometer la aparición en AI Overviews.

Dónde encaja GlotEO

Una implementación a medida de i18n en Next.js funciona para sitios pequeños; al crecer, hacen falta control del glosario, colas de revisión y validación SEO para cada configuración regional. GlotEO se conecta con arquitecturas tecnológicas modernas para que los equipos de marketing gestionen las traducciones mientras los de desarrollo mantienen la estructura de App Router.

Los equipos que abordan la localización como una cuestión de enrutamiento y calidad del contenido, y no solo como una sustitución de cadenas de texto, publican nuevas versiones más rápido sin interrumpir las rutas de rastreo. Comparte un glosario antes de que empiecen los traductores, revisa las páginas en contexto en el entorno de pruebas y vuelve a comprobar hreflang cada vez que añadas rutas. Mide la indexación en Search Console por carpeta o subdominio de cada configuración regional, en lugar de basarte en los datos agregados de todo el sitio.

Descubre la plataforma de localización web en Localización de sitios web con GlotEO y compara los precios y planes de GlotEO al definir el alcance del despliegue.

Referencias