Atributos de hipervínculos en HTML

Un enlace en HTML tiene la estructura:

<a href =”URL“>Texto</a>

Pero de esta forma, el enlace se abrirá en la misma pestaña en la que nos encontremos.

Para cambiar esto y abrir el enlace en una nueva pestaña hay que incluir un target, que en HTML consistiría en añadir el comando target=”_blank” justo después de la URL (para ser exactos, después de las comillas inglesas y un espacio).

La estructura general para crear un enlace en HTML que se abra en una nueva pestaña sería la siguiente (las partes que debemos personalizar son la URL de destino y el Texto visible que tendrá el enlace):
<a href =”URL” target=”_blank”>Texto</a>.

En una entrada anterior, tenemos un ejemplo de este tipo:

Cómo "embeber" / insertar contenidos multimedia en blogger

Si observamos el resultado en la pestaña HTML, tenemos esto:

<a href="https://www.slideshare.net/rafaelballesteros1/cmo-embeber-insertar-contenidos-multimedia-en-blogger-28834549" target="_blank" title="Cómo &quot;embeber&quot; / insertar contenidos multimedia en blogger">Cómo "embeber" / insertar contenidos multimedia en blogger</a>

Esta etiqueta nos indica que la URL de destino es https://www.slideshare.net/rafaelballesteros1/cmo-embeber-insertar-contenidos-multimedia-en-blogger-28834549 y el texto que aparece en el link es Cómo "embeber" / insertar contenidos multimedia en blogger. Este enlace se abrirá en una nueva pestaña porque usamos el atributo target=”_blank” justo después de la URL. En esta etiqueta en concreto aparece otro atributo: title. Este atributo hace que, al colocarnos con el ratón encima del enlace, podamos leer un texto informativo (el que aparece entre comillas) sobre el link. En este ejemplo concreto, el texto es Cómo "embeber"; / insertar contenidos multimedia en blogger.

Vamos a probar el atributo target y vamos a cambiar el texto del hipervínculo, manteniendo el enlace:

Cómo insertar contenidos embebidos

Otro uso interesante es la forma de enlazar una imagen a un enlace en HTML. Lo hacemos así:

<a href="URL DESTINO"><img src="URL DE LA IMAGEN"></a>

Siendo URL DESTINO la dirección a la que queremos que nos lleve la imagen y URL DE LA IMAGEN, la imagen en la que pincharemos para ir a la dirección.

Para finalizar esta entrada, hablaremos de la etiqueta <br />: la etiqueta <br /> inserta un salto de línea, lo cual es útil a la hora de dar formato a los contenidos.