Saltar la navegación

3.2.4. Enlaces y marcadores

Los enlaces se encuentran en casi todas las páginas web. Los enlaces permiten a los usuarios hacer clic en su camino de una página a otra. Los enlaces HTML son hipervínculos. Un enlace no tiene que ser texto. Puede ser una imagen o cualquier otro elemento HTML.

En HTML, los vínculos se definen con la etiqueta <a> :

<a href="https://www.institutonervion.es" target="_blank">Visita nuestra página web</a>

El atributo href especifica la dirección de destino del enlace. 

El atributo target especifica dónde abrir el documento vinculado y pude tener los siguientes valores:

  • _blank - Abre el documento vinculado en una nueva ventana o pestaña
  • _self - Abre el documento vinculado en la misma ventana / pestaña que se hizo clic (esto es el predeterminado)
  • _parent - Abre el documento vinculado en el marco padre
  • _top - Abre el documento vinculado en todo el cuerpo de la ventana
  • framename - Abre el documento vinculado en un marco con nombre

Marcadores

Al crear una página web con un contenido extenso, existen ciertos enlaces que permiten saltar directamente a una parte concreta de la página. Este tipo de enlaces o hipervínculos se llaman marcadores o enlaces locales.

Un ejemplo claro se puede visualizar en la web www.wikipedia.es en cualquiera de sus artículos (por ejemplo, aquí) donde se utiliza en el menú para acceder a los diferentes apartados.

Para crear marcadores se debe contar con una etiqueta de tipo enlace < a > para el origen y otra, de cualquier tipo, para el destino (el marcador).

  • En el origen se declara como referencia href un nombre utilizado como marcador, precedido por el símbolo # (almohadilla).
  • En el destino, se debe declarar el atributo id o el atributo name con dicho nombre de marcador pero sin la almohadilla. Esta etiqueta puede contener en su interior un texto, una imagen o incluso podemos crear una en blanco. Lo importante es el id.

<a href="#nombre_marcador">Soy el origen que se pulsa</a>

...

<etiqueta id="nombre_marcador">Soy el marcador que se mostrará al pulsar en el origen</etiqueta>

 

¿Podría usarse para acceder a marcadores de otras páginas?

La respuesta es sí. Simplemente se declara como referencia el nombre del marcador en la etiqueta enlace.

<a href="sierradepinares.html#quinto_pino">Pulsa para acceder al quinto pino</a>

Ejercicio

Descarga este archivo (html - 5122 B) y modifícalo para poder acceder a los diferentes apartados así como poder regresar al Inicio cuando se acabe de leer cada uno de ellos.

Guarda el ejemplo como ej4.html

Creado con eXeLearning (Ventana nueva)