Marketingamida

Guía sobre los enlaces salientes de una web en HTML

Post de las categorías marketing digital, seo y tutoriales. Tiempo de lectura aproximado: 5 minutos.

Este post pretende ser una guía sobre los enlaces salientes de una web en HTML. Te hablo de sus atributos para considerarlo dentro de tu estrategia Seo. Google no para de actualizar pautas y debes estar a la última.

Aquí tienes un resumen del contenido de este post. Puedes navegar pulsando encima del título que te interese visitar en el siguiente desplegable:

¿Qué es un link, hipervínculo o enlace?

¿Para qué sirve un enlace?

¿Cuál es la anatomía o forma de un enlace?

¿Qué es el anchor text en un enlace?

¿Qué atributos pueden conformar un enlace saliente?

¿Qué es un link, hipervínculo o enlace?

Un link, hipervínculo o enlace es una función normalmente en código html que relaciona o vincula una página con otra de modo que si le das clic te lleva a esa página. En resumen, un trozo de texto o imagen que al clicarlo te lleva a otra url.

imagen de un enlace

¿Para qué sirve un enlace?

Puede servir para vincular dos lugares dentro de una misma página (por ejemplo, cuando tienes un menú que es clicable y te lleva a otra parte de esa misma página. Eso sería así con el menú de esta misma página). Puede servir para vincular dos páginas web del mismo sitio web o para llevarte a otro sitio web, que sería un enlace saliente.

¿Cuál es la anatomía o forma de un enlace?

La forma o anatomía de un enlace sería así:

<a href="https://marketingaida.cat/"> anchor text </a>

¿Qué es el anchor text de un enlace?

En el caso anterior, lo que está detrás de href sería la url de destino del enlace y el anchor text sería el texto que vería el usuario para clicar encima y que está vinculado a una página concreta (en este caso, la home de mi web). 

Por tanto, el anchor text es el texto sobre el que clica el usuario y que está lincado o vinculado a una url a la que te conduce al pulsar encima. En el ejemplo de aquí abajo, sustiuyo anchor text por «anchor text de ejemplo».

<a href="https://marketingamida.cat/"> anchor text de ejemplo </a>

Lo que vería el usuario sería esto y si le diera al clic, le conduciría a la home de mi web (aunque en este caso no lo haya lincado):

anchor text de ejemplo

¿Qué atributos pueden conformar un enlace?

Antes que nada decirte que los atributos de un enlace se pueden combinar entre sí.

  • 1.Title

 En este caso, al pasar el ratón por encima del anchor text el usuario vería el tool tip (la cajita que se abre) de profesional del marketing y enlace destino. De esta forma le das más información tanto al usuario como al bot de Google, que sabe no sólo a dónde se dirige el enlace, sino la temática o el contexto. 
<a href="https://marketingamida.cat/" title="profesional del marketing"> anchor text </a>

  • 2.Rel

El atributo rel marca la relación entre el sitio origen y el sitio destino de ese enlace . Entre otros, dentro del atributo rel encontramos:

    • 2.1-Follow

Indicamos a Google que debe seguir ese enlace, que lo clique y viaje hasta él. Esto afecta al posicionamiento de esa página. La forma sería así:

<a href="https://marketingamida.cat/" rel="follow"> anchor text </a>

Ahora entramos en los tipos de enlaces que Google denomina «hints«: no sabemos seguro si Google los sigue o no, simplemente los considera una especie de aclaración o recomendación. Los hints son los nofollow, los sponsored y los ugc.

    • 2.2-No Follow

Desde setiembre 2019, el nofollow está dentro de las categoría de enlaces “hint”, es decir, recomendaciones. En teoría el bot de Google no va, no lo sigue (aunque no se puede saber con seguridad). 

En principio si un enlace es follow o nofollow afecta al posicionamiento del sitio web destino. Si es follow, su posicionamiento aumentaría si yo le enlazo, si es nofollow no debería variarle el posicionamiento. La forma sería así:

<a href="https://marketingamida.cat/" rel="nofollow"> anchor text </a>
    • 2.3-Sponsored

Le indicas al bot de Google que es un enlace pagado o esponsorizado. Por ejemplo, un enlace de afiliado o publicitario.

<a href="https://marketingamida.cat/" rel="sponsored"> anchor text </a>

    • 2.4-UGC

Ugc viene de user generated content. Le indicas a Google que es un comentario de alguien que ha puesto en nuestra página, pero que no nos interesa (puede ser negativo, de poca autoridad, etc). 

En este caso combinamos el nofollow con el ugc para indicarle que es de un usuario externo y que no lo siga.

<a href="https://marketingamida.cat/" rel="nofollow ugc"> anchor text </a>

  • 3-Target

Indica como se abre el enlace.

    • 3.1-Target Self

Si es target self se abre en la misma pestaña. Es lo normal si tu no indicas lo contrario.

<a href="https://marketingamida.cat/" target="_self"> anchor text </a>
    • 3.2-Target blank

Deberás indicar target blank si quieres que enlace se abra en una nueva pestaña.

<a href="https://marketingamida.cat/" target="_blank"> anchor text </a>

Cuando el enlace es a una pestaña nueva, y por temas de seguridad para evitar vulnerabilidades, se tiende a poner casi siempre los atributos rel “noopener” y “noreferrer” para asegurarte que el enlace te lleva del punto A al punto B sin que nadie se meta por medio. Eso asegura que no haya intromisiones en medio de los enlaces. Como los atributos se pueden combinar entre ellos, podríamos tener algo así:

<a href="https://marketingamida.cat/" target="_blank" rel="follow noopener noreferrer">  anchor text </a>

Decir que el noopener y noreferrer no afecta al posicionamiento.

Espero que la guía sobre los enlaces salientes de una web en HTML te haya sido útil. Tienes más información en informar a Google del tipo de enlaces salientes de un sitio web.

Gracias por leerme. Si el post ha sido de tu interés, te agradeceré que lo compartas. También te invito a suscribirte al blog y recibir las últimas novedades una vez al mes.

Muchas gracias y estamos en contacto.

Suscríbete al blog
Suscribirme
Comparte esta entrada
Otros artículos del blog

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *