El atributo HTML link rel explicado
¿Qué es el atributo link rel?
En la industria SEO, el atributo link relation, indicado en código fuente como <link rel="value">, se utiliza para comunicarle a los motores de búsqueda la relación entre varias páginas.
Sin embargo, el atributo link relation se ha estado utilizando durante más de una década con muchos otros fines, tales como hojas de estilos CSS, favicons, o para designar la versión imprimible de una página.
En este artículo describiremos los atributos link relation más comunes para SEO de los que deberías saber.
link rel=”alternate” hreflang
El atributo rel=”alternate” hreflang=”x”, atributo hreflang para abreviar, se utiliza para indicar cuál es el público al que se destina una página. Esto puede basarse simplemente en el idioma (por ejemplo, español), o en una combinación de idioma y situación geográfica (por ejemplo, español en España).
¿Qué aspecto tiene el atributo hreflang?
Un ejemplo del atributo hreflang en el código fuente de la página:
<link rel="alternate" hreflang="en" href="https://www.example.com/" />
<link rel="alternate" hreflang="es" href="https://www.ejemplo.es/" />¿Por qué deberías preocuparte del atributo hreflang?
Si tienes un sitio web disponible en varios idiomas, querrás que los motores de búsqueda muestren el contenido correcto a cada público.
Utiliza el atributo hreflang para indicarle a los motores de búsqueda a que público quieres dirigir tu contenido, y será más probable que estos le muestren el contenido correcto a cada público.
Además de dejar claro a motores de búsqueda que versión deben mostrar a sus usuarios, también se consigue prevenir problemas de
contenido duplicado.
lectura recomendada:
link rel=”alternate” media
El atributo rel=”alternate” media, atributo mobile para abreviar, se utiliza para indicar la relación entre el sitio web para ordenador y el de móvil a los motores de búsqueda. El atributo mobile solo es necesario si tienes dos sitios web separados para ordenador y móvil.
¿Qué aspecto tiene el atributo mobile?
Un ejemplo del atributo mobile en el código fuente de la página:
<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/">¿Por qué deberías preocuparte del atributo mobile?
Si tienes un sitio web diferente para móvil y para ordenador, y te preocupa tu SEO, debes utilizar el atributo mobile. El atributo mobile ayuda a motores de búsqueda a mostrar la página correcta a cada usuario, lo que significa que a los usuarios que entran a la página desde un ordenar se les mostrará la versión para ordenador cuando busquen en Google y Yandex, mientras que a aquellos que accedan desde un dispositivo móvil se les mostrará la versión móvil.
Una vez más, además de dejar claro a motores de búsqueda qué versión deben mostrar a los usuarios, se consigue evitar problemas de contenido duplicado cuando se utiliza el atributo mobile. De lo contrario, las versiones para móvil y para ordenador competirían entre ellas.
link rel=”prev”/”next”
Los atributos rel="next" y rel="prev", atributo de paginación para abreviar, se utilizan para indicar la relación entre las páginas de una secuencia de páginas a los motores de búsqueda.
¿Qué aspecto tiene el atributo de paginación?
Un ejemplo de un atributo de paginación en el código fuente de la página:
<link rel="prev" href="http://www.ejemplo.com/page-2.html">
<link rel="next" href="http://www.ejemplo.com/page-4.html">¿Por qué deberías preocuparte del atributo de paginación?
El atributo de paginación ayuda a los motores de búsqueda a entender la relación entre las páginas de una secuencia de páginas. A menudo estas páginas no contienen mucho contenido único, por lo que los motores de búsqueda asumen que prefieres que muestren contenido alternativo antes que las páginas paginadas.
Lectura recomendada:
link rel=”amphtml”
El atributo link rel="amphtml" se utiliza para indicar la relación entre una página AMP y una página no-AMP.
¿Qué aspecto tiene el atributo link rel=”amphtml?
La versión no AMP de una URL, por ejemplo https://www.ejemplo.com/helado/, tiene una refencia a la versión AMP de la URL:
<link rel="amphtml" href="https://www.ejemplo.com/helado/amp/".
¿Por qué deberías preocuparte del atributo link rel=”amphtml”?
Sin el atributo link rel="amphtml", Google no sabría de la existencia de una versión AMP de las páginas.
Lectura recomendada:
Steven es el Director ejecutivo para clientes en ContentKing; lo que que significa que tiene a su cargo todo relacionado con los clientes y con el inbound marketing. Esto es justo lo que más le gusta: mejorar el posicionamiento de sitios web y hablar del inbound marketing.
Vojtěch es el Manager de localización y soporte al cliente de ContentKing. Él es quien responderá a tus preguntas cuando te pongas en contacto con nosotros. También es traductor, por lo que, además de hacer felices a nuestros usuarios, también le encanta asumir nuestros desafíos de localización.
Ondřej es el Especialista en marketing de contenido de ContentKing. Vive en las trincheras del marketing de contenido, asegurándose de que nuestro contenido se mantiene actualizado y de que hay un flujo continuo de contenido nuevo.
