Enlaces

Una de las características básicas del HTML (probablemente la más importante) es la capacidad de enlazar páginas.

Los enlaces se hacen mediante la directiva <A>. Es una directiva que exige cierre </A>. El modificador más importante es HREF, que indica la dirección del fichero al que se enlaza. Recordar que, el nombre del fichero al que se enlaza, por ser el valor de un modificador, debe ir siempre entre comillas.

Aquí se muestra un enlace a otra página.
 

Código fuente.

Resultado.

<P><A HREF="homer.htm"> <B>Homer</B> </A>

Homer

En el caso anterior, como el fichero al que se enlaza está en el mismo directorio que el fichero origen, no ha sido necesario indicar la ruta. Sin embargo, no siempre es así. Muchas veces el fichero de destino se encuentra en un directorio dentro del directorio actual, o en un directorio superior... Puede ocurrir, incluso, que el fichero de destino no se encuentre en nuestro servidor.

A continuación, se muestran los códigos a ficheros situados en directorios diferentes al del fichero origen.
 

Código fuente.

Resultado.

<P><A HREF="directorio/index.htm"><B>Index</B></A>

Enlace a un fichero almacenado en un subdirectorio dentro del actual. (El código "entra" dentro del directorio).

<P><A HREF="../index.htm"><B>Index</B></A>

Enlace a un fichero almacenado en un directorio superior al actual. (El código "sube" un directorio).

<P><A HREF="../directorio/index.htm"><B>Index</B></A>

Enlace a un fichero almacenado en un directorio distinto del actual pero a un mismo nivel. (El código "sube" un directorio y "entra" en otro).

<P>
<A HREF="http://www.google.es">
<B>Edición digital del diario "Google".</B>
</A>

Enlace a una página situada en otro servidor. Hay que dar la dirección URL completa.

Aquí, lo que se carga no es una página web, sino un fichero gráfico.
 

Código fuente.

Resultado.

<P>
<A HREF="homer.gif">
<B>Homer.gif</B>
</A>

Homer.gif

También es posible definir el enlace utilizando una imagen en vez de texto.

En los ejemplos que se muestran a continuación, ambas imágenes enlazan con otro fichero. En la primera de ellas la imagen muestra un borde azul. Este borde lo muestra por defecto el navegador, pero se ha eliminado en la segunda imagen.
 

Código fuente.

Resultado.

<P>
<A HREF="homer.htm>
<IMG SRC="Homer.gif">
</A>

<P>
<A HREF="homer.htm">
<IMG SRC="Homer.gif" BORDER="0">
</A>

El enlace también puede servir para enviar un mensaje de correo electrónico:
 

Código fuente.

Resultado.

<P>
<A HREF="mailto:usuario@servidor.ext>
<B>usuario@servidor.ext></B>
</A>

usuario@servidor.ext

 

alt64@alt64.org

Página principal del curso
Página principal de Alt+64