En curso lleva a: Índice estamos en: Pauta 4

En curso...

Imagen

Comunicación

Diseño

Accesibilidad

Nuevas Tecnologías

 

Aplicación práctica del Dodecálogo

 

4.- Enlaces hipertextuales. Use texto que tenga sentido leído fuera de contexto. Por ejemplo, evite "pincha aquí".

La pauta pone como ejemplo el tan habitual "pincha aquí", pero se refiere a cualquier expresión que no indica a dónde lleva el enlace, que tan sólo invita a seleccionar ese enlace. Hay que tener en cuenta, que no todos los usuarios utilizan un ratón, por tanto no "pinchan en ningún sitio" ni hacen "clic" (expresión surgida del sonido característico del ratón cuando se aprieta una de sus teclas). Muchos usuarios utilizan las teclas para moverse e interactuar con el contenido de las páginas, por ejemplo, aquellos que tienen dificultades para utilizar ratones o aquellos que acceden a internet a través de otros dispositivos, como el teléfono móvil.

Además, hay que tener en cuenta que algunas herramientas de acceso a Internet presentan una relación de los enlaces contenidos en la página, con lo que si los enlaces tienen el mismo nombre o no son comprensibles fuera de contexto, el usuario no sabrá a dónde apuntan además de encontrarse con una lista de palabras incomprensible e inaccesible.

Por tanto, es fundamental que los enlaces estén conformados por una o varias palabras que sean comprensibles fuera de contexto, y para facilitar dicha comprensión debe usarse el atributo "title", con el que puede precisarse aún más hacia dónde apunta el enlace o qué se encontrará el usuario cuando descargue la página de destino.

 

Procedimiento para titular los enlaces

En Frontpage: No he encontrado un cuadro de diálogo que permita incluir el elemento "title", por tanto hay que ir a la vista "html" y en ella incluir a mano dentro del "tag": "a href="dirección.htm"" el elemento 'Title=""' escribiendo dentro de las comillas el título del enlace que deseamos.

En HotMetal: Una vez creado el enlace, se selecciona y, o bien con el botón "Atribute Inspector" o en el menú "Vew" la opción correspondiente o bien con el comando [Mayúsculas+F6], se abre una ventana con el "Inspector de atributos", una vez en el Inspector de atributos, en la pestaña "All" se encuentra un campo llamado "title" en el que podemos escribir el título del enlace.

En HomeSite: Para crear el enlace con el botón correspondiente o con las teclas [Mayuúscula+Control+a] aparece un cuadro de diálogo en el que ya existe un campo llamado "Title" al que se puede acceder con el tabulador o con [Alt+l].

En Dreamwever: Se selecciona el texto u objeto que se quiere convertir en un enlace, con ctrl+L o yendo al menú "Modify" y seleccionando "Make link" se abre un cuadro de diálogo para indicar dónde debe apuntar el enlace. Lo mismo se consigue con el Inspector de propiedades en el que hay un campo llamado "Link" para poner una dirección externa o un icono con forma de carpeta para seleccionar un fichero. Para incluir el atributo "title" se puede pinchar con el botón derecho del ratón sobre el enlace y seleccionar "Edit tag <a>..", que abre un cuadro con la codificación del enlace entonces, se puede escribir a mano o se puede pinchar dentro del código y aparece un cuadro de selección con todos los atributos html, en el que seleccionaremos "title", incrustándose automáticamente éste elemento y las comillas correspondientes entre las que hay que escribir el texto que se desea para titular el enlace.

En Amaya: Para crear el enlace se selecciona el texto u objeto que se desea sea un enlace y en el menú "link" o con el botón de crear enlaces (Botón para insertar enlaces en Amaya.)o con la combinación control+mayúsculas+L el tipo de enlace que se desea crear. Aparece entonces un cuadro de diálogo para indicar a dónde debe apuntar. Para utilizar el atributo "title", con el enlace seleccionado se elige el atributo "title" del menú "Attributes" y en el cuadro de diálogo que aparece se pone el título del enlace.

Esta pauta en concreto es más fácil de comprender si vemos primeros las malas prácticas, muy comunes en la Red, para más adelante ver el mismo ejemplo más accesible.

 

Malas prácticas

A continuación un ejemplo típico de creación incorrecta de enlaces.

Ejemplo (Los enlaces realmente no llevan a ninguna parte, sólo son un ejemplo)

Pincha aquí para ver mi album
Las fotos de París están aquí
Si quiere ver las de Londres, haz clic aquí
Salta al índice

El código de este ejemplo es:

<a href="enla.htm#malas">Pincha aquí</a> para ver mi album<br> Las fotos de París están <a href="enla.htm#malas">aquí</a><br> Si quiere ver las de Londres, haz <a href="enla.htm#malas">clic aquí</a><br> <a href="enla.htm#malas">Salta</a> al índice

Fin del ejemplo

 

Buenas prácticas

Ahora veamos la forma correcta de crear los mismos enlaces con los mismos textos, para que se vea claramente la diferencia, aunque lo ideal sería redactar de otra manera.

Ejemplo (Los enlaces realmente no llevan a ninguna parte, sólo son un ejemplo)

Pincha aquí para ver mi album
Las fotos de París están aquí
Si quiere ver las de Londres, haz clic aquí
Salta al índice

El código de este ejemplo es:

Pincha aquí para ver <a href="enla.htm#buenas" title="Album personal de fotografías.">mi album</a><br> Las <a href="enla.htm#buenas" title="Fotos tomadas en París.">fotos de París</a> están aquí<br> Si quiere ver las de <a href="enla.htm#buenas" title="Fotos tomadas en Londres.">Londres</a>, haz clic aquí<br> Salta al <a href="enla.htm#buenas" title="Índice del album de fotografías.">índice</a>

Fin del ejemplo

 

Verificando el trabajo

Las herramientas de evaluación no pueden verificar automáticamente si un enlace está o no bien redactado, lo único que pueden indicar es si el enlace contiene el elemento "title" o nó. Pero la utilización de Lynxme o del TAW o de Bobby en su opción sólo texto, pueden ayudar al Webmaster a verificar la corrección de los enlaces.

Anterior Flecha que apunta hacia la izquierda. Índice Flecha que apunta a la derecha. Siguiente

Para hacer sus aportaciones, comentarios o sugerencias, envíe un mensaje a la autora: Emmanuelle Gutiérrez y Restrepo


Creada: 15 de diciembre de 2000