Manual HTML Aversitenteras

16 pasos sencillos para construir tu propia web




13. ENLACES



.

bullet  Tejiendo la tela de araña:

Los enlaces o links proporcionan a las páginas web la verdadera potencia del lenguaje de hipertexto ya que se permite enlazar textos u otros elementos con otras páginas o ficheros, entrelazándose entre si y generando un cierto orden.

Para enlazar se utiliza la etiqueta A y añadiremos el atributo href para indicarle la ruta del enlace.


Ejercicio:

<A href="pagina.htm">Elemento contenedor del link</A>

Como veremos a continuación, vamos a diferenciar tres tipos de enlaces según el valor que tome el atributo href:

a) Enlaces a otra página.  Este tipo de links enlazan una ruta relativa ya que se trata de enlaces a elementos dentro de una misma máquina o servidor. Recordemos que ya vimos esta forma de rutas relativas en el tema de Imágenes - Primera parte.

Ejercicio: 

<HTML>
<HEAD>
<TITLE>Vínculos</TITLE>
</HEAD>
<BODY>
<A href="ejercicio8bis.htm">Ir a Ejercicio8bis<A>
</BODY>
</HTML>

Copiamos este código en el editor de texto y lo nombramos como ejercicio8.htm, pero antes de cargarlo en el navegador nos vamos a crear la página a la que apunta este vinculo, para ello nos creamos una web a la que aƱadimos cualquier cosa de las que hemos aprendido hasta la fecha a vuestra elección y la llamamos ejercicio8bis.htm. Esta página según la ruta relativa que hemos dado como valor al atributo href tenemos que guardarla en el mismo directorio que ejercicio8.htm. Bien, por último si cargamos la web ejercicio8.htm en el navegador y este debería ser el resultado:


enlaces

Si pinchamos en el vínculo veremos que nos lleva a la página ejercicio8bis.htm.


a) Enlaces a una URL.  No siempre las páginas o archivos que queremos vincular están en nuestra máquina o servidor por lo que en ese caso deberemos incluir la URL o dirección completa.

Ejercicio:  Modificamos el ejercicio8.htm:

<HTML>
<HEAD>
<TITLE>Vínculos</TITLE>
</HEAD>
<BODY>
Enlace a otra página:<BR>
<A href="ejercicio8bis.htm">Ir a Ejercicio8bis<A>
<BR><BR>
Enlace a otra URL:<BR>
<A href="http://www.google.es">Ir al buscador Google<A>
</BODY>
</HTML>


enlaces

Si pinchamos sobre el último link veremos que nos lleva a la página de google.


a) Enlaces a una dirección de correo.  Este tipo de link se utiliza para que al hacer click salte el programa de correo por defecto configurado en la máquina cliente, preparado para redactar un correo electrónico a la dirección configurada.

En este caso el valor que se pasa al atributo href es un poco diferente, ya que para interpretar que es una dirección de correo, el email va precedido de "mailto:".

Ejercicio:  Completamos el ejercicio8.htm con añadiendo el último tipo de vínculo:

<HTML>
<HEAD>
<TITLE>Vínculos</TITLE>
</HEAD>
<BODY>
Enlace a otra página:<BR>
<A href="ejercicio8bis.htm">Ir a Ejercicio8bis<A>
<BR><BR>
Enlace a otra URL:<BR>
<A href="http://www.google.es">Ir al buscador Google<A>
<BR><BR>
Enlace a una dirección de correo electrónico:<BR>
<A href="mailto:mailto:aversitenteras@gmail.com">Mandarme un mail<A>
</BODY>
</HTML>


enlaces



anterior     indice     siguiente