Sitios multilingües y hreflang

Módulo 3: La base técnica de una página · Tiempo de lectura: 12 minutos

Objetivo de aprendizaje: Después de esta lección sabrá configurar correctamente hreflang en un sitio con varios idiomas o para varios países, y comprobar si las referencias son recíprocas.

Conceptos clave: versión de idioma, hreflang, código de idioma (ISO 639-1), código de país (ISO 3166-1 alpha-2), código de escritura (ISO 15924), x-default, reciprocidad (referencia de vuelta), referencia a sí misma, HTML, encabezado HTTP o sitemap, direcciones separadas por idioma, no redirigir automáticamente según el idioma, atributo lang

El problema: ¿qué versión se muestra?

Bloemenatelier Lotte crece. Llega una versión en inglés del sitio para turistas y extranjeros residentes, y otra en alemán para los clientes que viven al otro lado de la frontera. La misma página de ramos de novia existe ahora tres veces:

https://www.example.com/bruidsboeketten          (neerlandés)
https://www.example.com/en/bridal-bouquets       (inglés)
https://www.example.com/de/brautstraeusse        (alemán)

En cada búsqueda, un buscador tiene que elegir cuál de las tres muestra. Una persona de Colonia que busca en alemán debe recibir la versión alemana, no la neerlandesa. Con hreflang le indica al buscador qué páginas son versiones de idioma unas de otras y a qué idioma o país va dirigida cada versión.

hreflang no es un truco para posicionar mejor. Solo sirve para que la versión correcta aparezca en el lugar correcto. Tampoco detecta el idioma: Google indica que no utiliza hreflang ni el atributo lang de HTML para determinar el idioma de una página; eso lo hace él mismo a partir del texto. Aun así, configure bien el atributo lang (<html lang="nl">), para los navegadores, los programas de traducción y los lectores de pantalla.

Primero lo básico: direcciones separadas

Google recomienda una dirección propia para cada versión de idioma y desaconseja cambiar el idioma mediante cookies o la configuración del navegador en la misma dirección. El motivo es práctico: Googlebot suele rastrear desde Estados Unidos. Si el contenido de una misma dirección cambia según quién la visite, es posible que Googlebot solo vea una versión.

Por la misma razón: no redirija automáticamente a los visitantes a otra versión de idioma en función de su idioma o su ubicación. Google lo desaconseja expresamente. Un neerlandés de vacaciones en Alemania quiere el sitio en neerlandés; es mejor poner un selector de idioma claro en la página y dejar que todo el mundo pueda acceder a todas las versiones.

Si trabaja con países en lugar de idiomas, con dominios separados como example.de y example.nl, se aplica lo mismo. Las versiones no tienen por qué estar en el mismo dominio.

Cómo es hreflang

En el <head> de cada versión de idioma figura el mismo conjunto de líneas:

<link rel="alternate" hreflang="nl" href="https://www.example.com/bruidsboeketten">
<link rel="alternate" hreflang="en" href="https://www.example.com/en/bridal-bouquets">
<link rel="alternate" hreflang="de" href="https://www.example.com/de/brautstraeusse">
<link rel="alternate" hreflang="x-default" href="https://www.example.com/bruidsboeketten">

Cuatro reglas que debe conocer:

1. Cada versión se menciona a sí misma y a todas las demás. Por tanto, la página en inglés tiene exactamente las mismas cuatro líneas, incluida la línea de en que apunta a sí misma.
2. Las referencias deben ser recíprocas. Si la página neerlandesa apunta a la alemana, la alemana debe apuntar de vuelta a la neerlandesa. Google lo dice así: si dos páginas no apuntan la una a la otra, las referencias se ignoran. Es el error más habitual, y por eso el ejercicio de esta lección lo comprueba.
3. Direcciones completas. Con https:// incluido. Una ruta como /en/bridal-bouquets o //www.example.com/en/... no sirve.
4. En un <head> limpio. Las líneas van en el <head> del HTML. Si algo interrumpe el head antes de tiempo, por ejemplo un <img> o un <div> suelto que no corresponde ahí, un buscador puede dar el head por cerrado y no ver el resto.

Los códigos

El valor de hreflang es un código de idioma, opcionalmente seguido de un código de país:

El código de idioma procede de ISO 639-1 (dos letras) y el código de país de ISO 3166-1 alpha-2. Las mayúsculas no importan, pero lo habitual es el idioma en minúsculas y el país en mayúsculas. Tres errores frecuentes:

• Un país solo no vale. hreflang="be" significa bielorruso (el código de idioma be), no Bélgica. Un país siempre va detrás de un idioma: nl-BE o fr-BE.
• en-UK no existe. El código de país del Reino Unido es GB. Google indica que códigos como EU, UN o UK no tienen efecto.
• Use un país solo si las versiones realmente son distintas (otros precios, moneda, envío u ortografía). Si tiene una única versión en alemán para todo el mundo, use simplemente de.

x-default

x-default es opcional. Con él señala la página para los visitantes a los que no les corresponde ninguna de sus versiones, por ejemplo alguien que habla francés. A menudo es su idioma principal o una página en la que el visitante elige el idioma.

Tres formas, elija una

Google admite tres formas equivalentes de indicar hreflang:

1. En el HTML, con líneas <link> en el head, como arriba. Es la más utilizada.

2. Como encabezado HTTP Link, útil para archivos sin HTML, como un pdf:

   Link: <https://www.example.com/en/price-list.pdf>; rel="alternate"; hreflang="en"

3. En el sitemap, con líneas xhtml:link por cada <url>. Útil para sitios grandes, porque así las páginas no pesan más.

No es necesario combinarlas. Si usa más de una, deben decir exactamente lo mismo.

hreflang y canonical juntos

hreflang y canonical (lección 3.5) funcionan juntos, pero no los confunda:

• Cada versión de idioma tiene un canonical a sí misma. La página en inglés no es una copia de la neerlandesa, así que no apunta a la neerlandesa como dirección canónica. Si lo hace, está diciendo "la página en inglés en realidad no existe", y desaparece del índice.
• Las direcciones de hreflang son las direcciones canónicas de las versiones. Si hreflang apunta a una dirección que redirige, que da un 404, que tiene noindex o que tiene un canonical hacia otra parte, el grupo se rompe.

Al determinar la dirección canónica, Google prefiere direcciones que forman parte de un grupo hreflang. Por tanto, un grupo bien hecho también ayuda a su canonicalización.

En la práctica: deje que lo haga el sistema

Mantener hreflang a mano es propenso a errores: con diez idiomas y cien páginas son mil líneas que tienen que ser todas correctas. Deje que lo haga su sistema de sitio web. En un sitio multilingüe, el AI Builder de WebOké coloca en cada página referencias hreflang a la misma página en los demás idiomas, además de un x-default al idioma principal, y deja fuera del grupo a propósito cualquier página que no tenga equivalente traducido. En WordPress, los plugins multilingües hacen lo mismo. En otros creadores de sitios web lo encontrará con nombres como "idiomas" o "internacional". Después, compruebe usted mismo que las referencias son correctas en ambos sentidos; eso es lo que hace el ejercicio.

Resumen

• hreflang indica qué páginas son versiones de idioma o de país unas de otras; no detecta el idioma ni es un truco para posicionar.
• Cada versión tiene su propia dirección; nada de redirigir automáticamente según el idioma o la ubicación.
• Cada versión se menciona a sí misma y a todas las demás, con direcciones completas, y cada referencia debe tener su vuelta; si no, Google la ignora.
• Códigos: idioma de ISO 639-1, opcionalmente con país de ISO 3166-1 alpha-2 (en-GB, no en-UK); x-default para el resto.
• Cada versión tiene un canonical a sí misma; hreflang solo apunta a direcciones canónicas que devuelven 200.

Cuestionario

Ejercicio

Ejercicio A3.6: ¿Son recíprocas sus referencias hreflang? Introduzca la dirección de una página que exista en varios idiomas. El programa recoge las referencias hreflang del head y del encabezado Link, comprueba los códigos y la referencia a sí misma, descarga cada una de las demás versiones de idioma y verifica si apunta de vuelta, devuelve 200, no tiene noindex y tiene un canonical a sí misma. ¿No tiene un sitio multilingüe propio? Use https://european-union.europa.eu/index_nl.

Para seguir leyendo

• Google Search Central, Informar a Google sobre las versiones localizadas de su página: https://developers.google.com/search/docs/specialty/international/localized-versions
• Google Search Central, Gestionar sitios multilingües e internacionales: https://developers.google.com/search/docs/specialty/international/managing-multi-regional-sites
• Google Search Central, Consolidar URL duplicadas: https://developers.google.com/search/docs/crawling-indexing/consolidate-duplicate-urls
• Códigos de idioma ISO 639 (Library of Congress): https://www.loc.gov/standards/iso639-2/php/code_list.php