¬ŅQu√© es la etiqueta Hreflang y cu√°ndo utilizarla?

que es hreflang

El Hreflang es una etiqueta que le indica a los motores de b√ļsqueda que existen varias versiones de esa p√°gina web en distintos idiomas.¬†

Esto lo implementamos con la idea de indicarle a los motores de b√ļsqueda que tenemos varias versiones de una misma p√°gina web y que as√≠ no se considere como contenido duplicado.¬†

Por supuesto, esto no es solo de cara a los motores de b√ļsqueda, ya que, eso tambi√©n ayuda a que el navegador sepa qu√© versi√≥n mostrar al usuario y as√≠ mejorar su experiencia en la web.

¬ŅQu√© es el Hreflang?

como ver hreflang

La etiqueta Hreflang es una etiqueta HTML que, como ya mencionamos, les indica a los motores de b√ļsqueda que se ha encontrado con una web multiidioma y la versi√≥n m√°s adecuada para mostrar al usuario.

¬ŅEso quiere decir que dos personas pudi√©ramos ver contenidos diferentes en la misma p√°gina web?

La respuesta es sí y no. Es decir, los navegadores atenderán a un tipo de preferencia a la hora de mostrar el contenido a un usuario.

Por eso, si entramos desde distintas partes del mundo, veremos dos versiones de una misma p√°gina que no necesariamente signifique 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.

¬ŅPor qu√© deber√≠a implementar la etiqueta Hreflang?

pag web en idiomas

Implementar las etiquetas dentro de tu p√°gina web (si se trata de una web multiidioma) es de suma importante 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.

Recuerda que la experiencia de usuario es lo m√°s importante para los motores de b√ļsqueda.

Tomando todo en cuenta, podemos resumir la importancia entre:

  • Mejora tu posicionamiento en cada pa√≠s.

funcionamiento hreflang

En cada país al cual estés apuntando cada una idioma de tu página web, tendrás un mejor posicionamiento web. 

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.

contenido duplicado

Aunque John Muller de Google se ha pronunciado recientemente sobre el contenido duplicado en las p√°ginas web, la verdad es que las p√°ginas con contenido duplicado no rinden como las p√°ginas con contenido original y optimizado.

Aquí hay que hacer un paréntesis: No porque John Muller haya dicho que los contenidos duplicados como los del footer o algunos contenidos de un ecommerce no afectan negativamente el posicionamiento de una web, vas a replicar el mismo.

Lo cierto es que debes diferenciar entre ‚Äúcontenido duplicado‚ÄĚ y ‚Äúcontenido copiado‚ÄĚ. En el segundo caso Google tiene una pol√≠tica de 0 tolerancia.

La metaetiqueta 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.

  • ¬ŅCu√°ndo utilizar el Hreflang?

Básicamente hay 3 casos en los cuales se recomienda implementar la meta etiqueta Hreflang: 

  • 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.¬†
  • 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.¬†
  • 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.¬†

 

Ahora que sabes los aspectos básicos para poder implementar, de la mejor manera tu etiqueta Hreflang, debes saber cómo implementarla en tu sitio web. Esta era solo la parte teórica, ahora viene lo más divertido: el proceso de implementación, y en Los Creativos te mostramos todos los pasos que debes tener en cuenta, con ejemplos prácticos, para implementar dicha etiqueta de la mejor manera.

Toma papel y l√°piz y anota este proceso:

Toda p√°gina que quiera apuntar a un p√ļblico internacional o cubrir regiones fuera de la local, necesita de una etiqueta Hreflang.

Cada una de las maneras en las cuales tratamos el contenido de nuestras p√°ginas web nos da m√°s cercan√≠a a la cima de los resultados de b√ļsquedas en los motores de Google.

El detalle que vemos nosotros es el c√≥mo llevar esa informaci√≥n hacia los motores de b√ļsqueda para que pueda entender que ofrecemos versiones distintas de nuestro contenido. ¬ŅC√≥mo logramos esto?¬†

Conoce entonces a detalle y con casos pr√°cticos, lo f√°cil que es implementar la etiqueta Hreflang en tu p√°gina web.

¬ŅQu√© es el Hreflang?

hreflang en SEO

El Hreflang es una etiqueta HTML ubicada en el <head> que sirve para indicarles a los motores de b√ļsqueda que hay variaciones de un mismo contenido dirigido a varios p√ļblicos objetivos.

Las formas en las cuales vemos los contenidos en diferentes idiomas atienden a una preferencia especial en cuanto al contenido que veremos especialmente dentro de un navegador.

Cada etiqueta va de la mano con una región específica y con una lengua también especifica. Todo, por supuesto, dentro de lo que quiere encontrar un usuario.

¬ŅC√≥mo implementar la etiqueta Hreflang?

pagina internacional

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 implementar eso 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.

Implementar Hreflang en archivos que no son HTML.

implementar hreflang

¬ŅQu√© sucede cuando estamos en presencia de 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:

contenido y hreflang

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.

¬ŅTienes alguna duda? Aqu√≠ te ayudamos m√°s:

Jes√ļs Berm√ļdez
Especialista SEO

Periodista y comunicador con conocimientos en marketing digital y analítica web. Redactor de contenido con experiencia
en SEO. Se encuentra en constante aprendizaje y actualizaci√≥n de los cambios en los motores de b√ļsqueda.

También te puede interesar

¬ŅQu√© son ventas B2C?
¬ŅQu√© son las ventas B2C y c√≥mo implementar este modelo de negocio?
El mundo del comercio ha experimentado una transformaci√≥n revolucionaria en los √ļltimos a√Īos, y gran
Ver m√°s
Qué son ventas B2B
¬ŅQu√© son las ventas B2B y c√≥mo aprovechar su tendencia en tu negocio?
En la era digital en la que vivimos, las ventas Business-to-Business (B2B) se han convertido
Ver m√°s
Middle of the funnel
¬ŅQu√© es MOFU, en el proceso de embudo de conversi√≥n?
En el mundo del marketing digital, el proceso de embudo de conversión es una herramienta
Ver m√°s
Bottom of the funnel
¬ŅQu√© es BOFU (Bottom of the funnel), en el proceso de embudo de conversi√≥n?
El embudo de conversión es una representación visual del viaje que recorren los clientes potenciales
Ver m√°s
Top Of The Funnel
¬ŅQu√© es TOFU (top of the funnel), en el proceso de embudo de conversi√≥n?
El proceso de embudo de conversión es una estrategia fundamental en el ámbito del marketing
Ver m√°s
¬ŅQu√© es Flywheel?
¬ŅQu√© es el flywheel, y por qu√© se convirti√≥ en el nuevo modelo de ventas en el inbound marketing ūüöÄ?
En el mundo del marketing digital en constante evolución, el modelo de ventas tradicional basado
Ver m√°s
Ver todos

Las personas hoy en d√≠a realizan m√°s del 70% de las compras a trav√©s de la b√ļsqueda de informaci√≥n.

¬°Quiero conocer m√°s sobre los servicios!