Lenguaje HTML/Enlaces

Un documento html es sobre todo un hipertexto, un documento en el que los contenidos pueden estar enlazados, a otros contenidos dentro del mismo documento o en otro distinto, que puede estar en el mismo ordenador, o en cualquier punto de la web. Desde este punto de vista, los enlaces pueden clasificarse de la siguiente manera:

Tipos de enlaces

• Internos

Dentro del mismo documento.

• Externos

A otro documento, y dependiendo de donde se halle:

Elemento a

a (anchor = ancla)
Sus etiquetas son: <a></a> (ambas obligatorias)
Sus principales atributos son:

href -(hipertexto-referencia) indica el recurso al que queremos acceder desde el ancla origen

name - (nombre) asigna un nombre al elemento a para que pueda ser usado como ancla destino

Su estructura básica consiste en el tag <a href="página"> al principio del enlace y cerrando con el tag </a>. El término página hace referencia a una URL (Localización de Recurso Universal, por sus siglas en inglés) que puede indicar la referencia a un documento HTTP, FTP, MAIL y otros protocolos de Internet que permiten localizar información en la Red.

Ejemplos:

• Referencia a una página local...

  <a href="index.html">Principal </a>

• Referencia a una página en un servidor HTTP...

  <a href="http://www.wikipedia.org/index.html"> Bienvenido a Wikipedia </a>

• Referencia a un archivo en un servidor FTP...

  <a href="ftp://ftp.debian.org/gcc.zip"> Archivo del compilador GCC </a>

URL absoluta y relativa

absolutas - contienen la ruta de acceso completa al recurso.

relativas - contienen la ruta de acceso desde la ubicación del documento que contiene el ancla origen.

Supongamos que en el directorio /home/yo/Desktop/enlaces/ tenemos los siguientes directorios y archivos:
indice.html
doc-0.html
11/doc-11.html
22/doc-22.html
22/222/doc-222.html

Los vínculos locales con referencias absolutas a estos archivos serían:
<a href='/home/yo/Desktop/enlaces/indice.html'>vínculos al indice.html</a>
<a href='/home/yo/Desktop/enlaces/doc-0.html'>vínculos a doc-0.html</a>
<a href='/home/yo/Desktop/enlaces/11/doc-11.html'>vínculos a doc-11.html</a>
<a href='/home/yo/Desktop/enlaces/22/doc-22.html'>vínculos a doc-22.html</a>
<a href='/home/yo/Desktop/enlaces/22/222/doc-222.html'>vínculos a doc-222.html</a>

Si queremos que indice.html incluya vínculos locales relativos a los otros documentos:
<a href='doc-0.html'>vínculos a doc-0.html</a>
<a href='11/doc-11.html'>vínculos a doc-11.html</a>
<a href='22/doc-22.html'>vínculos a doc-22.html</a>
<a href='22/222/doc-222.html'>vínculos a doc-222.html</a>

Si queremos que doc-11.html incluya vínculos locales relativos a los otros documentos:
<a href='../doc-0.html'>vínculos a doc-0.html</a>
<a href='../indice.html'>vínculos a indice.html</a>
<a href='../22/doc-22.html'>vínculos a doc-22.html</a>
<a href='../22/222/doc-222.html'>vínculos a doc-222.html</a>

Si queremos que doc-222.html incluya vínculos locales relativos a los otros documentos:
<a href='../../doc-0.html'>vínculos a doc-0.html</a>
<a href='../../indice.html'>vínculos a indice.html</a>
<a href='../doc-22.html'>vínculos a doc-22.html</a>
<a href='../../11/doc-11.html'>vínculos a doc-11.html</a>