Cómo traducir un sitio web de Astro: enrutamiento i18n y SEO

La arquitectura de Astro, que prioriza el contenido estático, encaja de forma natural con los sitios de marketing multilingües, siempre que los equipos traten el enrutamiento i18n, las colecciones de contenido y las anotaciones SEO como tareas de ingeniería de primer nivel. A menudo, los desarrolladores de Astro publican carpetas por idioma impecables y luego descubren que falta hreflang, que los elementos comunes del diseño siguen en inglés o que las islas híbridas muestran textos sin traducir en el cliente.

Esta guía explica cómo traducir un sitio web de Astro con HTML rastreable por idioma, colecciones de contenido organizadas, diseños y etiquetas SEO localizados, mapas del sitio preparados para hreflang, precauciones sobre el renderizado híbrido y flujos de trabajo editoriales para Markdown y MDX. Todo ello se basa en los requisitos de Google para sitios multilingües, sin factores de posicionamiento inventados.

Preguntas que responde esta guía

• ¿Cómo permite el enrutamiento i18n de Astro crear versiones por idioma rastreables?
• ¿Cómo se deben organizar las colecciones de contenido por idioma?
• ¿Cómo se localizan los elementos comunes del diseño y las etiquetas SEO en Astro?
• ¿Cómo se debe generar hreflang para la salida estática de Astro?
• ¿Cuándo se necesita el renderizado híbrido en los sitios multilingües de Astro?
• ¿Cómo se debe integrar el flujo de traducción con el contenido en Markdown/MDX?
• ¿Cuáles son los errores habituales en los sitios multilingües de Astro?
• ¿Cuándo deberían los equipos que usan Astro adoptar una plataforma de traducción?

Respuesta rápida: el HTML estático por idioma es la ventaja SEO de Astro

Respuesta breve: usa el enrutamiento i18n de Astro para prerenderizar URL distintas por idioma con HTML totalmente localizado, incluidos la navegación, los metadatos y el contenido principal. Después, añade anotaciones hreflang recíprocas entre las versiones alternativas.

El HTML prerenderizado para cada URL de idioma encaja bien con la preferencia de Google por versiones lingüísticas rastreables con URL distintas. Astro puede generar archivos estáticos por idioma durante la compilación, lo que permite a los rastreadores acceder al mismo documento en el idioma correspondiente que reciben los usuarios, sin depender de selectores de idioma del lado del cliente.

Google recomienda usar URL distintas y rastreables para cada versión lingüística, en lugar de depender únicamente de las cookies o del idioma del navegador. El enrutamiento astro:i18n de Astro (o patrones equivalentes con prefijos de idioma) permite aplicar este modelo si se genera una ruta de salida por idioma.

Enrutamiento i18n de Astro y diseño de URL

Configura Astro con idiomas definidos explícitamente y un idioma predeterminado. Estos son algunos patrones de URL habituales:

• Incluir el prefijo del idioma predeterminado (/en/about, /fr/about): explícito y fácil de anotar.
• Ocultar el idioma predeterminado (/about para inglés, /fr/about para francés): ofrece URL más limpias para el mercado principal; documenta la correspondencia en hreflang.

En astro.config.mjs, configura i18n.locales, i18n.defaultLocale y i18n.routing de acuerdo con tu matriz. Cada archivo de ruta debe recibir el idioma activo mediante las API de Astro para que las plantillas se rendericen en el idioma correcto.

Google determina el idioma de una página principalmente a partir del contenido visible; en cada versión lingüística, el contenido y la navegación deben estar mayoritariamente en un solo idioma. Conecta los componentes de navegación a diccionarios de traducción que tengan en cuenta el idioma activo, de modo que los encabezados y pies de página coincidan con el cuerpo de la página.

Evita las redirecciones automáticas basadas en suposiciones sobre el idioma o la ubicación. Google desaconseja las redirecciones automáticas y recomienda un selector de idioma visible para el usuario que enlace a las URL alternativas.

Para conocer el contexto estratégico de la segmentación por idioma frente a la segmentación por país, lee SEO internacional frente a SEO multilingüe.

Colecciones de contenido por idioma

Las colecciones de contenido de Astro sirven de base para blogs, documentación y textos de páginas de destino. Organiza el contenido multilingüe de forma planificada:

• Directorios de colecciones separados por idioma (src/content/blog/en/, src/content/blog/fr/) con esquemas compartidos.
• Un campo de idioma en el frontmatter para filtrar una única colección cuando el volumen de contenido es pequeño.
• Índices generados o enlazados mediante enlaces simbólicos que incluyan solo los elementos disponibles en cada idioma; evita publicar páginas vacías para los distintos idiomas.

Cada documento localizado debe hacer referencia a recursos y enlaces internos adecuados para su idioma. Una entrada en francés que enlaza a un documento disponible solo en inglés perjudica la confianza del usuario y la coherencia lingüística.

Si no existe contenido equivalente en un idioma, no inventes versiones alternativas en hreflang: traduce el contenido correspondiente u omite la relación hasta que esté listo.

Localización de diseños, SEO y Open Graph

Centraliza los elementos comunes del diseño en componentes que tengan en cuenta el idioma activo:

• BaseLayout.astro lee Astro.currentLocale (o tu función auxiliar de i18n) y selecciona los textos de diccionarios JSON o TS.
• <title> y la metadescripción proceden del frontmatter o de los campos del CMS de cada página, no de textos en inglés fijados en el código.
• Las etiquetas de Open Graph y Twitter reflejan el título y la descripción localizados.
• El atributo html lang coincide con el idioma activo (mejora la accesibilidad y la claridad; Google sigue usando el contenido visible para detectar el idioma).

Los títulos SEO y las metadescripciones localizados deben ser únicos para cada URL de idioma. Una localización superficial, limitada a los elementos comunes —navegación traducida con el cuerpo de los artículos en inglés—, da lugar a versiones lingüísticas deficientes.

Generación de hreflang y mapas del sitio

Los sitios de Astro también deben generar anotaciones hreflang recíprocas (en HTML, cabeceras o mapas del sitio) entre las URL de los distintos idiomas cuando existan versiones alternativas. Durante la compilación, genera una matriz de idiomas a partir de tu grafo de contenido:

1. Para cada página lógica, enumera todas las URL publicadas en los distintos idiomas.
2. Incluye <link rel="alternate" hreflang="..." href="..." /> en <head> en cada archivo HTML estático, o bien
3. Genera un mapa del sitio XML con versiones alternativas xhtml:link para cada entrada de URL.

Los mapas del sitio XML facilitan el descubrimiento de las versiones lingüísticas y pueden incluir anotaciones hreflang mediante xhtml:link cuando se eligen como método de implementación.

Cada URL de idioma debe tener una URL canónica claramente definida en el mismo idioma. Las directrices de Google sobre URL canónicas se aplican por igual a los sitios estáticos y a los dinámicos.

Integra la generación del mapa del sitio en la integración continua (CI) —@astrojs/sitemap junto con hooks de serialización personalizados funciona bien— para que hreflang se mantenga sincronizado cuando cambie el contenido.

Consulta fundamentos del SEO multilingüe para saber cómo los equipos editoriales gestionan las anotaciones en coordinación con lo que genera el equipo de ingeniería.

Islas híbridas y precauciones con el contenido dinámico

La arquitectura de islas de Astro permite hidratar componentes de React, Vue o Svelte de forma selectiva. Ten en cuenta estas precauciones para los sitios multilingües:

• Los widgets que se ejecutan solo en el cliente pueden mostrar contenido en inglés hasta que se cargue JavaScript, lo que perjudica la detección del idioma y la experiencia de usuario.
• Renderiza en el servidor el HTML inicial de las islas en el idioma correcto siempre que sea posible.
• Las rutas dinámicas (output: 'server' o hybrid) necesitan que la configuración regional se pase a través del middleware para que el HTML generado mediante SSR coincida con el prefijo de la URL.

¿Cuándo es necesaria la renderización híbrida? Utiliza la renderización híbrida o en el servidor cuando el contenido sea personalizado, requiera autenticación o se obtenga en el momento de la solicitud, pero sigue generando estructuras estáticas localizadas y rastreables para las páginas de marketing que deban posicionarse. Las versiones regionales de marketing deben usar la generación estática de forma predeterminada; reserva la renderización dinámica para las secciones de la aplicación que requieren autenticación.

Flujo de trabajo editorial para contenido MDX y de CMS

Para muchos equipos, Markdown y MDX siguen siendo la capa de contenido de Astro más fácil de mantener:

1. Cadenas de origen en archivos de traducción (src/i18n/fr.json) para los elementos de la interfaz.
2. Frontmatter en cada archivo de configuración regional para el contenido extenso.
3. Solicitudes de incorporación de cambios por lote de configuración regional con comprobaciones del glosario.
4. Exportación a herramientas TAO o TMS para grandes conjuntos de documentación, con posterior reimportación a src/content.

Las directrices de Google sobre contenido útil dan prioridad a las páginas pensadas para las personas; publicar traducciones automáticas sin revisión da lugar a versiones localizadas de escaso valor.

Define controles de publicación: no se deben integrar cambios si faltan campos obligatorios de la configuración regional, si los enlaces internos llevan fuera de la versión regional o si los pares hreflang de muestra no superan las comprobaciones de reciprocidad.

Lista de verificación de la implementación

• Configura las opciones regionales de i18n de Astro y la estrategia de prefijos de las rutas
• Crea archivos de diseño y diccionarios que tengan en cuenta la configuración regional
• Organiza las colecciones de contenido por configuración regional con esquemas compartidos
• Localiza el título, los metadatos, OG y html lang en cada plantilla
• Crea una matriz de configuración regional × URL durante la compilación
• Genera referencias hreflang recíprocas en el HTML o en el mapa del sitio
• Define URL canónicas del mismo idioma en cada página estática generada
• Renderiza las islas mediante SSR o de forma estática con la configuración regional activa
• Añade un selector de idioma visible sin redirecciones forzadas
• Ejecuta un rastreo en el entorno de preproducción tras el lanzamiento de cada versión regional

Errores habituales

1. Estructura de diseño solo en inglés en rutas localizadas.
2. Ausencia de hreflang porque las rutas estáticas se mantenían manualmente.
3. Configuración regional predeterminada oculta sin documentar las alternativas: se rompe la reciprocidad.
4. Selector de idioma renderizado en el cliente sin URL diferenciadas.
5. MDX con idiomas mezclados por la integración de traducciones parciales.
6. Publicación de versiones regionales incompletas con lorem ipsum o textos provisionales en inglés.
7. Omisión del mapa del sitio en sitios estáticos grandes, lo que ralentiza el descubrimiento.
8. URL canónica que apunta a otro idioma por descuido.

Las directrices de Bing para webmasters también destacan la importancia de ofrecer contenido útil y rastreable y una estructura de sitio clara para la indexación en distintos mercados.

Fundamentos de los buscadores tradicionales y los motores de respuesta

Los fundamentos comunes del HTML estático localizado de Astro y de las colecciones de contenido siguen siendo importantes para Google, Bing y los motores de respuestas: versiones lingüísticas rastreables, entidades claras, afirmaciones respaldadas por pruebas, datos estructurados que reflejen la realidad y una localización auténtica, no estructuras solo en inglés. Considera las guías siguientes como perspectivas específicas de cada plataforma sobre un mismo nivel de exigencia para la publicación multilingüe.

Guía de la plataforma: Google Search

En la Búsqueda de Google, el descubrimiento depende de que cada versión regional o de idioma tenga URL rastreables, con HTML en el idioma correspondiente, títulos y encabezados precisos y etiquetas hreflang recíprocas cuando existan versiones alternativas. Las bases técnicas incluyen contenido indexable (no cambios de idioma basados solo en cookies), metadatos localizados, mapas del sitio y una gestión rigurosa 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 procede de una identidad organizativa clara y de fuentes que respalden la información, no del marketing de herramientas de traducción. Implicación multilingüe: cada URL de mercado o idioma debe funcionar de forma autónoma. Evalúa los resultados con la cobertura de Search Console y la inspección de URL para cada versión regional o de idioma. Lo conocido frente a lo incierto: Google documenta el comportamiento multilingüe y de hreflang; no garantiza posicionamiento con ningún CMS ni flujo de trabajo de posedición de traducción automática (MTPE).

Guía de la plataforma: Bing

Bing descubre e indexa páginas multilingües rastreables y con una estructura clara, de forma similar a los requisitos de Google sobre la claridad de las URL y el contenido. Los fundamentos técnicos incluyen URL accesibles para cada configuración regional, contenido útil y seguimiento mediante Bing Webmaster Tools. Prioriza la localización de encabezados, afirmaciones y preguntas frecuentes frente a traducir solo 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 detrás de selectores que funcionen únicamente del lado del cliente. Mide la indexación y las estadísticas de rastreo en Bing Webmaster Tools. Lo conocido frente a lo incierto: las directrices de Bing destacan el contenido útil y rastreable; no inventes factores de posicionamiento exclusivos de Bing para las herramientas de traducción.

Guía de la plataforma: ChatGPT

ChatGPT puede citar o resumir páginas de acceso público cuando sus versiones de idioma están claramente identificadas y el contenido está preparado para responder preguntas. El descubrimiento no funciona como el posicionamiento convencional basado en el rastreo; la visibilidad consiste en que una página se seleccione como fuente o se mencione en las respuestas. Las bases técnicas 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 una terminología estable basada en glosarios. La autoridad procede de las pruebas y de la coherencia de las entidades entre las distintas versiones regionales o de idioma. Implicación multilingüe: cada página regional o de idioma debe poder leerse de forma independiente. La medición es imperfecta: trata 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 la 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 se cite o reconozca el contenido, no en inventar factores de posicionamiento de Gemini. Los fundamentos técnicos coinciden con la rastreabilidad y la calidad de los metadatos exigidas por Google Search. 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: gestionar los nombres de producto mediante un glosario reduce la confusión entre configuraciones regionales. Mide los resultados de forma tradicional con Search Console y analiza muestras de respuestas de IA de forma cualitativa. Lo conocido frente a lo incierto: el comportamiento de Gemini no sustituye las directrices documentadas de Google Search sobre hreflang y versiones por idioma.

Guía de la plataforma: Google AI Overviews

Google AI Overviews puede enlazar a páginas de apoyo; los criterios para aparecer siguen basándose en contenido indexable y centrado en las personas. No es un selector de idioma ni sustituye a hreflang. Los fundamentos técnicos siguen siendo el HTML rastreable de cada configuración regional y los datos estructurados veraces. Entre las cualidades del contenido se incluyen respuestas concisas y encabezados claros en cada idioma. Las señales de autoridad reflejan las expectativas de contenido útil. Implicación multilingüe: ninguna página traducida tiene garantizada su inclusión en AI Overviews. Consulta los informes sobre funciones generativas de Search Console cuando estén disponibles y mantén separadas las métricas de indexación tradicionales. Lo conocido frente a lo incierto: ningún flujo de trabajo de traducción puede prometer la aparición en AI Overviews.

Cómo encaja GlotEO

¿Cuándo deberían los equipos que usan Astro adoptar una plataforma de traducción? Cuando la aplicación del glosario, las colas de revisión por configuración regional y las matrices hreflang ya no puedan gestionarse mediante solicitudes manuales de incorporación de cambios en JSON y MDX.

El equipo de ingeniería puede implementar un enrutamiento i18n impecable en Astro; aun así, la localización necesita glosarios, colas de revisión y rigor en la publicación. Descubre la localización de sitios web de GlotEO para conectar las instrucciones de los proyectos, el flujo de traducción y los controles de calidad con los procesos de contenido de los sitios estáticos. Así, las actualizaciones de MDX y de los diccionarios se mantendrán alineadas con las referencias hreflang y los metadatos SEO que genera la compilación de Astro.

Compara los precios y planes de GlotEO cuando el volumen de traducción supere lo que puedes gestionar con ediciones manuales de JSON, y utiliza herramientas para el flujo de trabajo de SEO multilingüe para que tanto los desarrolladores como los equipos de contenido tengan a la vista las matrices de configuración regional y los requisitos editoriales.

Complementa este tutorial de Astro con la comparación entre SEO internacional y SEO multilingüe cuando la estrategia de idiomas y países deba definirse antes de la implementación.