13.6.13

Enlaces dentro de una entrada


Cuando el contenido de una entrada hace necesario, por su extensión, dividirlo en varias partes, es conveniente crear enlaces que lleven, desde un índice, a cada una de las partes en particular. Estos enlaces se denominan marcadores, y no solamente se utilizan en índices, aquí lo hacemos a manera de ejemplo; también se pueden utilizar, en entradas de contenido muy extenso, para facilitar al usuario ir a cualquier parte de la misma de forma rápida.

Veamos la explicación con un ejemplo:

En una entrada se va a tratar un artículo sobre informática, considerando los siguientes aspectos: definición, etimología, orígenes y funciones.

En el índice ponemos los títulos de cada una de las partes en las que hemos dividido el contenido de la entrada:


Índice
  1. Definición
  2. Etimología
  3. Orígenes
  4. Funciones

 

Enlace origen

Cada título del índice lo ponemos, en el editor HTML de la entrada, al crear la misma, dentro de un enlace que apunte a la parte de la entrada correspondiente (destino del enlace), así:

<a href="#Definición" title="Definición">Definición</a>
<a href="#Etimología" title="Etimología">Etimología</a>
<a href="#Orígenes" title="Orígenes">Orígenes</a>
<a href="#Funciones" title="Funciones">Funciones</a>

  • El signo numeral (#) hace que el enlace apunte a un elemento dentro de la misma entrada. Sin este signo el enlace no encontrará el elemento ya que lo buscará por fuera de la entrada, y aparecerá un mensaje indicando que esa página no existe.
  • El atributo title hace que aparezca un texto con el título correspondiente al poner el cursor sobre cada uno de ellos (es opcional).
  • Cada uno de los títulos con este color es el texto que aparece en el índice.

 

Destino del enlace

Cada uno de los títulos de cada una de las partes en que hemos dividido el contenido de la entrada, en el editor HTML de la misma, lo ponemos dentro de un código destino, así:

<a name="Definición"> <h3>Definición</h3></a>
<a name="Etimología"> <h3>Etimología</h3></a>
<a name="Orígenes"> <h3>Orígenes</h3></a>
<a name="Funciones"> <h3>Funciones</h3></a>

  • El atributo name asigna un nombre al destino del enlace para que éste lo pueda identificar.
  • Las etiquetas <h3>...</h3> dan a los títulos el formato de tales (según el formato por defecto de los títulos en cada blog, pueden ser <h1>...</h1> , <h2>...</h2> o <h3>...</h3>).
  • Cada uno de los Textos con este color es el título de cada una de las partes en que hemos dividido el contenido de la entrada.

 

Enlace "Ir al principio"

Por último podemos utilizar, al final de cada parte en que dividimos la entrada, o al final de la misma, el siguiente código, que nos genera un enlace para volver al principio de la entrada:

<a href="#"title="Ir al principio" >Ir al principio</a>

  • El texto Ir al principio podemos cambiarlo por "Ir al inicio" "Regresar" "Ir arriba" etc.
  • El atributo title hace que aparezca el texto Ir al principio al poner el cursor sobre el enlace.

 

Veamos los enlaces en funcionamiento:

Enlaces dentro de una entrada

4 comentarios :

Este blog ya cumplió su ciclo, por esta razón, aunque sigue a disposición de los usuarios, no se harán más publicaciones ni se atenderán más consultas. La respuesta a su inquietud puede estar entre los comentarios hechos hasta aquí.

El autor.