¿Qué es la etiqueta Hreflang y como utilizarla?

Escrito por: Agencia SEOlogy

La etiqueta hreflang es una etiqueta HTML que indica a los motores de búsqueda que se ha encontrado un sitio web multilingüe y presenta al usuario la mejor versión.

Esto se implementa con la idea de indicar a los buscadores que existen múltiples versiones de una misma página web para que no sean consideradas contenido duplicado.

Por supuesto, esto no solo se aplica a los motores de búsqueda. También ayuda al navegador a saber qué versión mostrar al usuario y mejorar la experiencia web.

Lo cual quiere decir que dos personas pueden ver contenidos diferentes en la misma página web, es decir, los navegadores atenderán a un tipo de preferencia a la hora de mostrar el contenido a un usuario. Es por eso que, si entramos desde distintas partes del mundo, veremos dos versiones de una misma página, aunque no necesariamente significa que veamos contenidos diferentes. No estamos diciendo que el contenido sea 100% traducido, quizás veas diferencias mínimas que atiendan a las diferencias idiomáticas o de target, pero será el mismo.

¿Cuándo utilizar el Hreflang?

Existen 3 casos en los cuales se recomienda implementar la meta etiqueta Hreflang:

  1. El contenido web está en un solo idioma, pero se traduce la plantilla sobre la cual está la página web, es decir, el pie de página, área de navegación y todo. Un ejemplo de esto, son los foros.
  2. El contenido está en un mismo idioma, pero cuenta con variaciones regionales con lo cual apuntamos distintivamente a cada región por separado. Esto se ve por ejemplo en páginas que estén en español de España y español de Latinoamérica, por ejemplo.
  3. Tienes contenido 100% traducido con lo que apuntas a mencionar a los motores de búsqueda que cuentas con variaciones de contenido en tu página web. Como ejemplo, un ecommerce que esté en francés, inglés, español, etc.

Conociendo los aspectos básicos para poder implementar de la mejor manera tu etiqueta Hreflang, debes saber cómo implementarla en tu sitio web.

¿Cómo implementar la etiqueta Hreflang?

En líneas generales tenemos que nuestra etiqueta debería lucir así:

  • <link rel=”alternate” href=”https://www.estaestuweb.com/es/” hreflang=”es” /> si quieres especificar que el contenido está en español.
  • <link rel=”alternate” href=”https://www.estaestuweb.com/e/” hreflang=”en” /> si quieres indicar que el contenido está en inglés.

Ahora, si quieres, además, identificar que tu web es parte de una región en específico, luciría así:

  • <link rel=”alternate” href=”https://www.estaestuweb.com/es/” hreflang=”es-la” /> Si quieres indicar que tu contenido está en español, pero que además es español latinoamericano.
  • <link rel=”alternate” href=”https://www.ejemplo.com/en/” hreflang=”en-ca” /> Por si deseas indicar que tu contenido está en inglés pero que además es inglés de Canadá.

Una vez conoces esto, pasas a lo que te interesa, ver cómo implementarlo en tu página web. En el caso de una página HTML la implementación es bastante simple, pues lo único que tienes que hacer es agregar el código en el <head> y con ello tendrás todo listo.

¿Por qué debería implementar la etiqueta Hreflang?

Implementar las etiquetas dentro de tu página web, es de suma importancia de cara al posicionamiento que tendrá tu página web. Tu web tendrá considerablemente mejor posicionamiento si apunta de forma directa a cada persona a quien apunta su contenido.

Teniendo esto en cuenta, podemos resumir la importancia entre:

  • Mejora tu posicionamiento en cada país: En cada país al cual estés apuntando cada idioma de tu página web, tendrás un mejor posicionamiento. Es decir, la etiqueta Hreflang te da un empujón necesario a nivel internacional sin dejar atrás los elementos de posicionamiento a nivel local.
    En caso de que no hagas caso a la implementación de la etiqueta, pasarás desapercibido delante de Google y solo se mostrará una versión de la web, lo que no te dará la visión que estás buscando a nivel global.
  • Evita el contenido duplicado: lo importante es diferenciar entre “contenido duplicado” y “contenido copiado”, ya que en el segundo caso Google tiene una política de 0 tolerancia.
    La meta etiqueta Hreflang es una forma de decirle a los motores de búsqueda que un contenido tiene diferentes versiones por lo que, mostrará el más adecuado para el usuario.

Implementar Hreflang en archivos que no son HTML

¿Cómo hacer para indicarle a los motores de búsqueda que un archivo en PDF, un audio MP3 o un vídeo está en un idioma específico?

En el caso de que quieras indicar el idioma de un archivo particular, tienes que indicar de esta forma:

  • Enlace: ; rel=”alternate”; hreflang=”código_idioma_1”,; rel=“alternate”; hreflang=”código_idioma_2”,…

La URL de la página debe corresponder con el atributo del Hreflang asociado. Por supuesto, debe incluirse en los símbolos como cualquier otro HTML “< >”. Asimismo, debes saber que debes incluir cada conjunto de valores separados por comas, indicando cada una de las versiones que existen del archivo.

Suena complicado, pero quizás sea mejor verlo con un ejemplo: digamos que queremos mostrar un vídeo especial para España y otro para Latinoamérica.

Nuestro vídeo se vería como:
<https://imagintatuwebaquí.com/unvídeoparausuarios.mp4; rel=”alternate”; hreflang=”es-es”, https://imaginatuwebaquí.com/unvídeoparausuarios.mp4; rel=”alternate”; hreflang=”es-la”>

En nuestro ejemplo estamos utilizando dos regiones del mismo idioma, pero funciona perfectamente igual para el caso en el cual quieras agregar un idioma diferente.

Siguiendo con nuestro ejemplo, quedaría así:
<https://imagintatuwebaquí.com/unvídeoparausuarios.mp4; rel=”alternate”; hreflang=”es-es”, https://imaginatuwebaquí.com/unvídeoparausuarios.mp4; rel=”alternate”; hreflang=”es-la”, https://imagintatuwebaquí.com/unvídeoparausuarios.mp4; rel=”alternate”; hreflang=”en”>

Como podemos ver, están separadas por coma e incluyendo cada link que tenemos.

Implementar Hreflang con sitemaps:

Esta es una forma fácil de indicarle directamente a los motores de búsqueda que existen varias versiones de un mismo link.

En el caso de que quieras tomar este camino, debes agregar una única URL que, a su vez, tenga las entradas secundarias con las variantes que existan, incluyendo el idioma y la región de la misma.

Para esto tienes que generar tu sitemap, en cuyo caso, deberías seguir estas reglas:

  • Especificar bien los nombres xhtml así: xmlns:xhtml=”https://www.w3.org/1999/xhtml
  • Solo vas a usar un elemento por URL.
  • Debes incluir siempre, elementos secundarios que indiquen las URL de una página.
  • En cada elemento debe contener elementos secundarios que indiquen las versiones alternativas del contenido, incluyendo la suya propia.

Con esto listo, solo debes subir tu sitemap a tu web.

Tabla de Contenidos
    Add a header to begin generating the table of contents
    Scroll to Top