Si tu sitio WordPress sirve contenido en varios idiomas o se dirige a regiones distintas, implementar etiquetas hreflang es esencial para el posicionamiento en buscadores. Sin ellas, Google y otros buscadores pueden mostrar la versión de idioma equivocada en sus resultados o tratar tus páginas traducidas como contenido duplicado, lo que diluye tu posicionamiento en todas las versiones de idioma. Las etiquetas hreflang indican a los buscadores exactamente qué idioma y variante regional representa cada página, de modo que los usuarios siempre llegan a la versión más relevante para ellos.
Qué son las etiquetas hreflang y cómo las usan los buscadores
Hreflang es un atributo HTML que especifica el idioma (y opcionalmente el destino geográfico) de una página. Aparece como un elemento <link> en la sección <head> de tu página, o como una entrada en tu sitemap XML. Así se ve un conjunto típico de etiquetas hreflang para una página disponible en inglés y alemán:
<link rel="alternate" hreflang="en" href="https://example.com/en/about/" />
<link rel="alternate" hreflang="de" href="https://example.com/de/ueber-uns/" />
<link rel="alternate" hreflang="x-default" href="https://example.com/en/about/" />Cuando Googlebot rastrea una página y encuentra estas etiquetas, entiende que ambas URL representan el mismo contenido en idiomas diferentes. Después sirve la versión apropiada según las preferencias de idioma y la ubicación de quien busca. La etiqueta x-default actúa como respaldo general para usuarios cuyo idioma o región no coincide con ninguno de los valores hreflang especificados.
Hreflang utiliza códigos de idioma ISO 639-1 (por ejemplo, en, de, fr) y opcionalmente códigos de país ISO 3166-1 Alpha 2 (por ejemplo, en-US, de-AT, pt-BR). El código de idioma por sí solo se dirige a todos los usuarios de ese idioma sin importar su ubicación, mientras que añadir un código de país acota la segmentación a una región concreta.
Cuándo necesitas segmentación regional o solo por idioma
Elegir entre códigos solo de idioma (como de) y códigos específicos por región (como de-DE, de-AT, de-CH) depende de tu estrategia de contenidos:
- Solo idioma (
de): úsalo cuando tu contenido en alemán sirva para todos los hablantes de alemán independientemente de su país. Es la opción correcta para la mayoría de blogs, sitios informativos y productos SaaS. - Específico por región (
de-DE,de-AT): úsalo cuando tengas contenido distinto adaptado a países concretos. Por ejemplo, una tienda online con disponibilidad de productos, precios o información legal diferentes para Alemania, Austria o Suiza necesita etiquetas específicas por región.
Un error común es usar códigos específicos por región cuando bastaría con códigos solo de idioma. Si tu contenido en alemán es idéntico para todos los hablantes de alemán, usar de es más sencillo y evita la necesidad de crear páginas separadas para cada región.
Configurar hreflang con WPML
WPML (WordPress Multilingual Plugin) es el plugin multilingüe premium más utilizado y gestiona las etiquetas hreflang automáticamente:
- Compra e instala WPML Multilingual CMS desde wpml.org.
- Ejecuta el asistente de configuración. Elige tu idioma predeterminado y añade todos los idiomas que admite tu sitio.
- Selecciona la estructura de URL. WPML admite subdirectorios (
/en/,/de/), subdominios (en.example.com) o dominios separados. Los subdirectorios son los más comunes y los más fáciles de gestionar. - Empieza a traducir tu contenido. Para cada entrada o página, haz clic en el icono "+" junto al idioma de destino en la caja de idioma de WPML para crear una traducción.
- WPML genera automáticamente etiquetas hreflang para cada página que tenga traducciones. También añade la etiqueta
x-defaultapuntando a la versión en tu idioma predeterminado.
Para verificar el resultado, ve el código fuente de cualquier página traducida y busca hreflang. Deberías ver una etiqueta <link> por cada idioma, incluyendo el idioma de la página actual (un hreflang autorreferencial, que es obligatorio).
WPML también se integra con Yoast SEO y Rank Math. Cuando ambos plugins están activos, el plugin SEO se hace cargo de la generación de hreflang y añade su propia capa de validación, que puede detectar configuraciones erróneas habituales.
Configurar hreflang con Polylang
Polylang es una alternativa gratuita popular a WPML. Genera etiquetas hreflang automáticamente para todas las traducciones enlazadas:
- Instala y activa Polylang desde el directorio de plugins de WordPress.
- Ve a Idiomas > Idiomas y añade cada idioma que admite tu sitio. Establece la configuración regional, el código de idioma y el formato de URL (se recomienda subdirectorio).
- Asigna un idioma a cada entrada y página existente. Polylang añade una columna de idioma a tu listado de entradas, lo que facilita ver qué entradas están traducidas.
- Enlaza las traducciones entre sí. Al editar una entrada, usa la caja "Traducciones" en la barra lateral para conectarla con su equivalente en otros idiomas.
- Polylang emite automáticamente etiquetas hreflang en el
<head>para todas las traducciones enlazadas.
Una diferencia importante con respecto a WPML: Polylang no añade automáticamente la etiqueta x-default en todas las configuraciones. Para asegurarte de que está presente, ve a Idiomas > Ajustes > Hreflang y comprueba que x-default está establecido en tu idioma principal. Si usas Polylang Pro (la versión premium), esto se gestiona automáticamente.
Configurar hreflang con TranslatePress
TranslatePress adopta un enfoque distinto al permitirte traducir contenido directamente desde el front-end:
- Instala y activa TranslatePress.
- Ve a Ajustes > TranslatePress y añade tus idiomas.
- Haz clic en "Traducir sitio" en la barra de herramientas del administrador para abrir el editor visual de traducción.
- Navega a cualquier página y haz clic en los elementos de texto para traducirlos en línea.
- TranslatePress se encarga automáticamente de generar las etiquetas hreflang para todas las páginas traducidas.
TranslatePress almacena las traducciones en la base de datos en lugar de crear entradas separadas, lo que simplifica la gestión de contenidos pero limita más las opciones de estructura de URL.
Combinar Yoast SEO o Rank Math con plugins multilingües
Tanto Yoast SEO como Rank Math detectan los plugins multilingües populares y se hacen cargo de la generación de etiquetas hreflang cuando ambos están activos. Esta integración añade validación adicional:
- Coincidencia con la URL canónica: el plugin SEO verifica que el href de hreflang coincide con la URL canónica de cada página, evitando una configuración errónea común.
- Gestión de noindex: las páginas marcadas como noindex se excluyen automáticamente del resultado hreflang, ya que los buscadores no deberían indexarlas de todos modos.
- Integración con sitemap: las anotaciones hreflang se incluyen en el sitemap XML generado por el plugin SEO, proporcionando a los buscadores una segunda fuente de datos hreflang.
Si usas Yoast SEO con WPML o Polylang, comprueba SEO > General > Funciones y asegúrate de que la función hreflang no está deshabilitada. Rank Math gestiona esto automáticamente sin necesidad de configuración adicional.
Implementación manual de hreflang en WordPress
Para sitios con una configuración multilingüe personalizada (por ejemplo, usando instalaciones de WordPress separadas para cada idioma o un enfoque de CMS headless), puede que necesites añadir las etiquetas hreflang manualmente:
function add_hreflang_tags() {
if (is_singular()) {
$post_id = get_the_ID();
// Define tu mapeo de idioma a URL
// Almacena las traducciones como post meta o en una tabla personalizada
$translations = array(
'en' => get_post_meta($post_id, '_url_en', true),
'de' => get_post_meta($post_id, '_url_de', true),
'fr' => get_post_meta($post_id, '_url_fr', true),
);
// Elimina entradas vacías
$translations = array_filter($translations);
// Añade la página actual (el hreflang autorreferencial es obligatorio)
$current_lang = get_locale();
$lang_code = substr($current_lang, 0, 2); // 'en_US' becomes 'en'
$translations[$lang_code] = get_permalink();
// Emite las etiquetas hreflang
foreach ($translations as $lang => $url) {
echo '<link rel="alternate" hreflang="' . esc_attr($lang) . '" href="' . esc_url($url) . '" />' . "
";
}
// x-default (normalmente apunta al inglés o a tu idioma principal)
if (!empty($translations['en'])) {
echo '<link rel="alternate" hreflang="x-default" href="' . esc_url($translations['en']) . '" />' . "
";
}
} elseif (is_front_page() || is_home()) {
// Gestiona la página de inicio por separado
$home_translations = array(
'en' => 'https://example.com/en/',
'de' => 'https://example.com/de/',
'fr' => 'https://example.com/fr/',
);
foreach ($home_translations as $lang => $url) {
echo '<link rel="alternate" hreflang="' . esc_attr($lang) . '" href="' . esc_url($url) . '" />' . "
";
}
echo '<link rel="alternate" hreflang="x-default" href="' . esc_url($home_translations['en']) . '" />' . "
";
}
}
add_action('wp_head', 'add_hreflang_tags');En una configuración de producción, sustituirías los arrays de URL fijas por consultas dinámicas a tu sistema de mapeo de traducciones, ya sea post meta, una tabla personalizada de la base de datos o una llamada a la API de tu plataforma de gestión de traducciones.
Añadir hreflang a sitemaps XML
En sitios con miles de páginas, declarar hreflang en tu sitemap XML puede ser más eficiente que añadir etiquetas en el HTML de cada página. El enfoque de sitemap XML reduce el tamaño de página y ofrece a los buscadores una fuente centralizada de datos hreflang. Este es el formato XML:
<url>
<loc>https://example.com/en/about/</loc>
<xhtml:link rel="alternate" hreflang="en"
href="https://example.com/en/about/" />
<xhtml:link rel="alternate" hreflang="de"
href="https://example.com/de/ueber-uns/" />
<xhtml:link rel="alternate" hreflang="x-default"
href="https://example.com/en/about/" />
</url>Tanto WPML como Polylang añaden anotaciones hreflang a sus sitemaps automáticamente. Si usas Yoast SEO junto con un plugin multilingüe, Yoast también incluye hreflang en su sitemap. Para implementaciones manuales, puedes usar un plugin como "XML Sitemap Generator for Google" y personalizar la salida del sitemap para incluir entradas hreflang.
Puedes usar etiquetas hreflang en HTML y anotaciones en el sitemap XML al mismo tiempo. Google procesa ambas y las concilia. Si hay conflictos entre las dos, Google aplica sus propias heurísticas para determinar el mapeo correcto.
Reglas críticas de hreflang que debes seguir
Hreflang es famosamente fácil de implementar de forma incorrecta. Sigue estas reglas para evitar los errores más comunes:
- El enlazado bidireccional (recíproco) es obligatorio: si la página A (inglés) incluye un hreflang que apunta a la página B (alemán), entonces la página B también debe incluir un hreflang que apunte de vuelta a la página A. Si el enlace es solo unidireccional, los buscadores lo ignoran por completo. Este es el error de hreflang más común con diferencia.
- El hreflang autorreferencial es obligatorio: cada página debe incluir una etiqueta hreflang que apunte a sí misma. Si tu página en inglés tiene etiquetas hreflang para las versiones en alemán y francés, también debe tener una etiqueta hreflang para la versión en inglés que apunte a su propia URL.
- Usa solo URL canónicas: la URL en cada etiqueta hreflang debe coincidir exactamente con la URL canónica de esa página. Si una página tiene una etiqueta
rel="canonical"que apunta a una URL distinta, usa la URL canónica en la etiqueta hreflang, no la URL de la página actual. - Cada variante de idioma necesita el conjunto completo: si tienes 4 versiones de idioma, cada variante de página debe incluir las 4 etiquetas hreflang más x-default. Los conjuntos incompletos hacen que los buscadores ignoren toda la anotación hreflang para ese grupo de páginas.
- Las páginas deben devolver un código de estado 200: no incluyas en las etiquetas hreflang URL que redirijan (301/302) o devuelvan errores (404/500). Los buscadores las marcarán como errores de hreflang y, con el tiempo, podrían dejar de procesar tus anotaciones hreflang.
- Incluye siempre x-default: la etiqueta x-default sirve como respaldo para los usuarios cuyo idioma o región no coincide con ninguna de tus variantes especificadas. Sin ella, esos usuarios podrían no ver tu contenido en absoluto en los resultados de búsqueda.
Depurar y validar tu implementación de hreflang
Después de configurar las etiquetas hreflang, una validación exhaustiva es fundamental. Incluso pequeños errores pueden inutilizar toda tu configuración de hreflang:
- Análisis con InspectWP: pasa cada versión de idioma de tu sitio por InspectWP. Detecta todas las etiquetas hreflang y lista cada variante de idioma, lo que facilita comprobar que todas las etiquetas están presentes y apuntan a las URL correctas.
- Google Search Console: revisa el informe Segmentación internacional (en Herramientas e informes antiguos) para ver errores de hreflang. Google reporta problemas como enlaces de retorno faltantes, códigos de idioma desconocidos y conflictos de hreflang con etiquetas canónicas.
- Inspección manual del código fuente: ve el código fuente de cada versión de idioma y comprueba que las etiquetas hreflang estén presentes, sean bidireccionales y autorreferenciales. Verifica que las URL sean absolutas (no relativas) y usen el protocolo correcto (https, no http).
- Auditoría con Ahrefs o Screaming Frog: para sitios grandes, usa una herramienta de rastreo para revisar todas las páginas a la vez. Estas herramientas pueden identificar etiquetas hreflang faltantes, enlaces no recíprocos y discrepancias de códigos de idioma en todo tu sitio.
Hreflang en redes WordPress Multisite
Si gestionas un WordPress Multisite donde cada subsitio representa un idioma distinto, la implementación de hreflang requiere conocimiento entre sitios. WPML admite configuraciones Multisite y enlaza el contenido entre subsitios. Para implementaciones manuales, necesitas consultar las bases de datos de los demás subsitios para encontrar la entrada traducida correspondiente y construir la URL hreflang dinámicamente. La función switch_to_blog() de WordPress te permite consultar los datos de otro subsitio dentro de la misma red.
Consideraciones de rendimiento para sitios multilingües grandes
En sitios con muchos idiomas (10 o más), las etiquetas hreflang pueden añadir un marcado considerable a cada página. Cada página necesita una etiqueta por idioma más x-default, así que un sitio con 15 idiomas añade 16 elementos <link> al head de cada página. Para sitios con requisitos de rendimiento, considera estas estrategias:
- Usa hreflang en el sitemap XML en lugar de HTML: trasladar las declaraciones hreflang al sitemap elimina por completo el marcado de tus páginas, reduciendo el tamaño de página.
- Cachea la salida de hreflang: si generas las etiquetas hreflang dinámicamente (por ejemplo, a partir de consultas a la base de datos), cachea el resultado usando transients de WordPress o tu caché de objetos para evitar consultas repetidas a la base de datos en cada carga de página.
- Usa cabeceras HTTP para contenido no HTML: para PDF y otros recursos no HTML, puedes declarar hreflang usando cabeceras HTTP
Linken lugar de etiquetas HTML.