Comunidad de diseño web y desarrollo en internet

Anclas (anchors) en XHTML

Ya sabemos cómo posicionar con CSS, crear menus de navegación y encabezados en XHTML. Ahora explicaremos ligeramente qué es una ancla (anchor) y para qué sirven.

Nota: Para éste tutorial necesitas tener previos conocimientos sobre XHTML.

¿Qué son las anclas y para qué sirven?

Las anclas (anchors) son literalmente enlaces interiores hacia una página, esto nos ayuda a manejar, organizar y acceder al contenido de una página facilmente.

Usando IDs

El método es sencillo, IDs. Cada que un ID es agregado, una ancla ha sido creada, por ejemplo veamos el siguiente ejemplo.

<div id="encabezado"></div>
<div id="contenido">
 <h3 id="titulo">Lorem ipsum</h3>
 <p>Lorem ipsum dolor sit amet</p>
</div>
<div id="pie"></div> 

Cada uno de estos ID mostrados son anclas: Encabezado, contenido, titulo y pie. Y estos pueden ser enlazados de la siguiente manera:

<a href="#titulo">Lorem ipsum</a>

Como se puede observar, el ID es representado por un simbolo de número (#) adelante de su nombre, de mismo modo que en CSS.

Nota: Cabe recalcar que las anclas son sensibles a las mayúsculas y minúsculas, case-senstive.

Usando names

Quizás algunos de ustedes deben estar confundidos y usaban anclas con el atributo name en una etiqueta <a> vacía. Como el siguiente ejemplo.

<a name="titulo"></a>

Pero este método ha sido descartado por la W3C y dejó de ser válido en el XHTML estricto, y será completamente erradicado del XHTML 2.

Ejemplos en el mundo real

Como un ejemplo real podemos encontrar los indices usados en monografías.com, o en las especificaciones del W3C. Además existe algo conocido como accesibilidad web, lo cual nos recomienda la creación de una lista de enlaces dentro de la página como:

  • Ir al contenido
  • Ir a la navegación
  • Ir arriba

Enlaces externos

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Descargar Archivo

Publica tu comentario

El autor de este artículo ha cerrado los comentarios. Si tienes preguntas o comentarios, puedes hacerlos en el foro

Entra al foro y participa en la discusión

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate