Vamos a ver qué son los hiperenlaces, para qué sirven y cómo crearlos. Son un elemento muy común en cualquier página web, de hecho, podríamos decir que el hiperenlace o hipertexto es la instrucción o etiqueta más importante del lenguaje HTML como se desprende del propio nombre (Hyper Text Markup Lenguage).
En este vídeo puedes ver hiperenlaces, primera parte:![Ver un videotutorial Videotutorial](https://www.aulaclic.es/html/comunes/icono_youtube_peq.png)
En este vídeo puedes ver hiperenlaces, segunda parte:![Ver un videotutorial Videotutorial](https://www.aulaclic.es/html/comunes/icono_youtube_peq.png)
Hiperenlaces. Definición
Un hiperenlace se escribe con la etiqueta <a> y permite ir (navegar) a un recurso de internet designado por su dirección de internet (URL). El recurso más usual es una página web pero también puede ser un archivo de imagen, vídeo, dirección email, dirección ftp, punto de ancla, ...
Un hiperenlace tiene dos partes fundamentales, el destino y el elemento que activa el enlace. Vamos a explicarlo sobre el siguiente ejemplo.
La forma más usual de utilizar la etiqueta <a> es para enlazar con otra página web mediante un texto:
Visita aulaClic
El código correspondiente es este:
<a href="http://www.aulaclic.es">Visita aulaClic</a>
El elemento que activa el enlace es el texto Visita aulaClic que al ser pulsado nos lleva al destino del hiperenlace. El destino se indica con el atributo href que en este caso es una dirección de internet (URL). Al colocar el cursor en el texto del hiperenlace el cursor toma la forma de una mano para indicarnos que se trata de un hiperenlace. Si hacemos clic con el botón derecho aparecerá un menú contextual con varias opciones (Abrir en una pestaña nueva, Guardar enlace, ...). En los dispositivos táctiles, al no existir cursor, el comportamiento es diferente. No hay forma de saber si un texto contiene un enlace hasta que demos una pulsación corta, con lo cual se activará; o demos una pulsación larga para que aparezca el menú contextual.
También es frecuente que el elemento que activa el enlace sea una imagen, como en el siguiente ejemplo:
![](https://www.aulaclic.es/html/comunes/logo_ac1_50.gif)
El código correspondiente es este:
<a href="http://www.aulaclic.es"><img src="comunes/logo_ac1_50.gif"/></a>
El elemento que activa el enlace se escribe entre las etiquetas <a> y </a> y puede ser una etiqueta de texto (párrafo, h1, ..), una imagen y también otros elementos (section, lista, ...); incluso podemos colocar más de un elemento, por ejemplo una imagen y un texto.
Otra forma de nombrar un hiperenlace es hipervínculo o hipertexto, y si estamos en un contexto que se habla de Internet también se les puede llamar simplemente enlace o vínculo.
EJEMPLO: En el siguiente ejemplo se presenta una tabla con 3 hiperenlaces que conllevan a paginas cuyas url fueron copiadas de la barra del navegador y se despliegan desde una imágen cada uno.
<HTML>
<HEAD>
<BODY BGCOLOR="BLUE">
</HEAD>
<BODY>
<CENTER><h1>AUTOS ALEMANES</h1><br><br>
<TABLE border="1">
<TR>
<TD>
<a href="https://www.mercedes-benz.com.co/"><img src="mercedes.png"></a>
</TD>
</TR>
<TR>
<TD>
<a href="https://bmwshop.autogermana.com.co/"><img src="bmw.jfif"></a>
</TD>
</TR>
<TR>
<TD><a href="https://www.audi.com.co/"><img src="audi.jfif"></a>
</TD>
</TR>
</TABLE>
</CENTER>
</BODY>
</HTML>
ACTIVIDADES
1. Observa con atención los videos planteados en esta guía.
2.Realiza en el blog de notas un ejercicio similar al ejemplo presentado, puedes utilizar cualquier otro tema de tu preferencia.
3. Envia tus trabajos al correo habitual hasta el 28 de Octubre de 2021