Vínculos a otras zonas del mismo documento

En este tutorial aprenderemos, cómo hacer con código HTML, un hipervínculo hacia otra parte del mismo documento; es lo que se llama comúnmente como anclas o marcadores.


1º Para ello, utilizaremos el atributo ID ó NAME en el lugar de destino, como ejemplo, usaremos un marcador o ancla, llamado Capitulo1.

El código sería por ejemplo: <a id="Capitulo1"/>
ó <a name="Capitulo1"/>

Ambas posibilidades son válidas, si bien con navegadores antiguos necesitaremos el atributo NAME, aunque es sintácticamente más correcto utilizar el atributo ID.


2º A continuación, hacemos el propio hipervínculo, para que lleve a la parte donde hemos establecido el ejemplo, en este caso, Capitulo1.

Para ello, el hipervínculo sería uno standard que apuntase a la url del documento, pero le añadiríamos al final de la url el #nombredelmarcador, en este caso, le añadiríamos #Capitulo1.

Lógicamente, podemos tanto utilizar urls relativas, como absolutas.

El ejemplo de código del hipervínculo sería:
<a href="#Capitulo1">Ver Capítulo 1</a> (Forma relativa)
<a href="../../normas.html#Capitulo1">Ver Capítulo 1</a> (Forma absoluta)

Por ejemplo, sería un hipervínculo válido ../../bases.html#objeto, el cual irá a la zona Objeto, dentro del documento bases.html

Evidentemente, estos enlaces pueden utilizarse tanto en el propio documento, como en un documento externo para apuntar directamente a la zona deseada, y no necesitan recargar la página, sino que te llevan directamente a esa zona, agilizando la navegación en documentos extensos.

Espero que este tutorial haya sido de ayuda.