Cómo incluir saltos de enlaces en una misma página
Los saltos de enlaces en una misma página son conocidos por «enlaces de anclaje». Son bastantes útiles sobre todo cuando estamos antes un texto denso y, al mismo tiempo, fáciles de implantar en tu sitio web. Seguramente ya sabes para qué se utilizan así que ¡saltamos a la práctica!
Cómo incluir saltos de anclaje
Parte 1: Esto es un enlace de anclaje
Parte 2: Así se crea el salto
Parte 3: Compruébalo
Parte 1: Esto es un enlace de anclaje
En esta ocasión no vamos a tener mucho texto pero lo importante es aprender a crear el salto. Como ya sabrás, en el editor de tu CMS (WordPress, Joomla…) puedes editar el contenido de dos formas, de forma Visual o HTML. Si no te manejas con HTML, puedes crear el texto como hasta ahora lo has hecho y cambiar las instrucciones que te daré a continuación en la forma HTML. No te agobies, es muy fácil :D.
Para crear estos enlaces, en la parte superior del documento crearemos los índices o títulos que queremos desarrollar posteriormente, más abajo. En este caso, vamos a desarrollar tres apartados que hemos enumerado.
Una vez creado el índice, nos iremos al visor HTML y buscamos en el desarrollo la línea de código (da igual si no lo entiendes) que queramos asociar con nuestro índice:
<
h3
> Parte 1: Esto es un enlace de anclaje</
h3
>
Parte 2: Así se crea el salto
Una vez que tengas localizado el código en el visor HTML, conviértelo de esta forma:
<
h3
id
=
"enlacedeanclaje"
>Parte 1: Esto es un enlace de anclaje</
h3
>
Colocaremos un identificador (ID) que posteriormente utilizaremos para asociarlo a la Parte 1. Añadiremos la etiqueta id=»nombrequelequeramosponer». En este caso hemos utilizado como identificador las palabras «enlacedeanclaje». Pues bien, haremos lo mismo para el índice 2 y 3. Por lo que quedaría así:
<
h3
id
=
"elsalto"
>Parte 2: Así se crea el salto</
h3
>
<
h3
id
=
"comprobar"
>Parte 3: Compruébalo</
h3
>
Ya tenemos identificadas nuestras tres partes. Ahora sólo tenemos que asociarlas al índice. Volvemos al visor (o si lo prefieres, crea un enlace en HTML) y nos colocamos en el índice. Ahora tenemos que enlazar cada índice con su respectivo desarrollo. ¿Cómo lo enlazamos? Muy fácil:
Colócate en el primer índice y e inserta un enlace. En esta ocasión no vamos a poner una dirección web puesto que no queremos ir a otra página sino que queremos dar un salto en la que nos encontramos. ¿Te acuerdas de los ID que definimos anteriormente? Pues ha llegado el momento de usarlos. En lugar de una dirección web, colocaremos el id precedido por #. ¡Así de simple! Y lo haremos para cada índice. Por lo que quedaría de esta forma:
#enlacedeanclaje
#elsalto
#compruebalo
Parte 3: Compruébalo
Check it out! ¡Es momento de comprobar los enlaces! Seguro que todo te ha ido de maravilla. Si no te ha quedado claro, escríbeme un comentario y te ayudaré encantada :D
Periodista y SEO. Autora de éste blog donde comparto mis conocimientos y curiosidades sobre SEO y Márketing Digital. Actualmente, entrepeneur en The Conservas.