Como enlazar a una parte concreta de una página web

En HTML4 y en HTML5 las diferentes etiquetas pueden tener un nombre concreto mediante un identificador. Por ejemplo, si entro en la parte de la edición HTML de este artículo puedo llamar “primerp” a este párrafo (<p>) que estoy escribiendo: <p id=”primerp”>. Que las etiquetas (sean <div>, <h2>, <p>…) estén denominadas de esta forma permite enlazar a ellas, pudiendo funcionar como ancla.Dos páginas de navegado, una con un ancla en su interior y otra con una cadena; podría simbolizar cómo funciona el enlace a una parte de una página web
Para conocer la utilidad de este atributo, tenemos que hacer primero como que hemos redactado un texto bastante largo.
Párrafo – 3
Párrafo – 4
Párrafo – 5
Párrafo – 6
Párrafo – 7
Párrafo – 8
Párrafo – 9
Párrafo – 10
Párrafo – 11
Párrafo – 12
Párrafo – 13
Párrafo – 14
Párrafo – 15
Párrafo – 16
Párrafo – 17
Bien. Siempre hay dos pasos: denominar de alguna manera el párrafo al que queremos que se dirijan (id=”nombre”) y después poner un vínculo en la expresión que llevará hasta allí (<a href=”link#nombre”>Estas palabras tendrán el enlace</a>). Veamos ejemplos.

Enlace a una parte de la misma página

Podemos introducir un vínculo a la zona que queramos de una misma página, en este caso vayamos al primer párrafo de esta página. Si no queremos escribir el código a mano y el sistema de gestión de contenidos que usamos tiene un simbolito de “insertar enlace”, lo debemos activar sobre la palabra que queramos que tenga el hipervínculo (por ejemplo, encima de una expresión como “Ir al inicio de este artículo”) y escribimos que debe enviar a los usuarios a tal parte, con una almohadilla y el nombre del identificador: #primerp.
El código HTML sería: <a href=”#primerp”>Ir al inicio de este artículo</a>. La etiqueta <a href> inserta un enlace que hemos llamado “Ir al inicio…” y cada vez que alguien lo clique lo llevará al lugar de la página que le hemos indicado, en este caso, al <p> denominado “primerp”.

Enlace a una parte de otra página

Si deseamos que un enlace apunte a un lugar que está en otra página nuestra, habrá que poner lo mismo pero especificando antes del identificador el link a la página en la que se encuentra, luego # y el nombre del identificador (#DRM). El HMTL sería en este caso: <a href=”https://www.techleo.es/infraccion-de-los-derechos-de-autor/#DRM”>Las tecnologías de control de acceso</a>.
¿Y si queremos apuntar a un párrafo de una página ajena, sobre cuyo HTML no tenemos control? Podremos enlazar si la parte que nos interesa tiene un identificador propio, lo cual depende de la persona que haya escrito esa página. Se puede saber cuál es el identificador viendo el código fuente de la página (accede a este por ejemplo al clicar con el ratón el botón derecho) y buscando la zona que nos interesa. ¿Alguna etiqueta próxima con “id”? Pues se puede enlazar ahí.
Es habitual poner identificadores en los textos online con varios apartados, como las leyes, artículos y libros. Un ejemplo fácil de comprobar: cualquier entrada de Wikipedia. Al inicio hay un índice con enlaces a las diferentes secciones del texto.

Comentarios

Entradas populares de este blog

Cómo colocar los checkboxs de contact form 7 en vertical

Cómo añadir aceptación de términos y condiciones en Contact Form 7