jueves, 24 de enero de 2013

El enlace "saltar a"

Los usuarios que manejan el ordenador con el teclado, principalmente los usuarios ciegos o los usuarios con movilidad reducida que no pueden emplear un ratón, se benefician de los enlaces del tipo "saltar a" que permiten saltar a partes importantes de una página web.

Sobre este tema proporcioné dos consejos el verano pasado:
Parecen el mismo consejo, pero no lo son.

El primer consejo dice que coloques al principio de la página enlaces (por ejemplo, mediante una barra de navegación especial) que permitan saltar directamente a partes concretas de la página: al menú principal, al menú secundario, al contenido principal, a la zona de comentarios, al pie de página, etc.

El segundo consejo dice que coloques a lo largo de la página enlaces para saltar algunas partes de la página. Por ejemplo, para saltar todo el menú principal, saltar el menú secundario, saltar el contenido principal, etc.

Ambos consejos se complementan y permiten una navegación más rápida a los usuarios que manejan el ordenador con el teclado.

En muchas páginas he visto que se usan estos enlaces, pero en muchos casos se hace mal. Por ejemplo, en el nuevo sitio web de la Universidad de Alicante, la universidad en la que trabajo.

Este fallo lo detecté cuando entrevisté a una persona ciega (el vídeo de esta entrevista se publicará dentro de poco). Durante la entrevista hicimos una prueba con el sitio web de la Universidad de Alicante, y esta persona encontró un enlace que le llamó la atención porque no lo entendía: "SALTAR CUERPO".

"¿Qué es SALTAR CUERPO?", me preguntó.

Si consultamos el código fuente, lo podemos ver (lo siento, pero Blogger no permite copiar código HTML para que se visualice, siempre me lo interpreta, ¿alguien sabe cómo se tiene que hacer?):


No se debería llamar SALTAR CUERPO, sino algo más significativo para el usuario, como por ejemplo, "Saltar contenido" o "Saltar contenido principal".

Además, en esta página sólo se está aplicando el consejo 6, también se debería aplicar el consejo 5 que quizás es mucho más útil (porque siempre se puede, en cualquier momento, volver al inicio de la página y ahí encontrar todos los enlaces a las distintas partes).

En esta página también podemos encontrar otros dos enlaces "saltar a", "Saltar cabecera" y "Saltar barra-herramientas" que quizás sus textos tampoco son muy significativos.

Pero lo peor lo encontramos cuando visitamos una página de segundo nivel, como Presentación o Centros y departamentos. En estas dos páginas (y no he seguido mirando, pero seguro que ocurre en más), existe el enlace "Saltar cabecera" para saltar al contenido principal, pero el destino del enlace no existe. Así que, ese enlace no sirve de nada, es más, puede llegar a confundir al usuario.


Pero además, si revisamos la accesibilidad de la página con Wave 5, descubriremos que en la página hay tres enlaces "saltar a" ("Saltar cabecera", "Saltar barra-herramientas" y "Saltar contenido-centro", ¿qué diablos será contenido-centro), y los tres enlaces están rotos, es decir, no tienen un destino en la misma página.


Y ya que estamos... ¿qué prefieren los usuarios? "Saltar al contenido", "Saltar al contenido principal" o "Saltar navegación".

En primera encuesta del WebAIM sobre el uso de lectores de pantalla, Survey of Preferences of Screen Readers Users, la combinación "Saltar al contenido" o "Saltar al contenido principal" es preferida por el 50% de los usuarios, mientras que "Saltar navegación" por sólo el 6%.

3 comentarios:

Taurë dijo...

Lo de insertar código fuente... No conozco Blogger, pero imagino que tendrá alguna opción para editar el texto en modo código fuente... En ese caso lo que habría que hacer es meter el código que queremos que se vea íntegro dentro de etiquetas de texto preformateado: < pre >< /pre >

Sergio Luján Mora dijo...

No, eso no funciona bien, igual que la etiqueta < xmp > tampoco la respeta.

Gracias a tu comentario he visto que al dejar un espacio en blanco "se respeta" el HTML, pero tendría que modificar el código a mano :-(

amram dijo...

Independientemente de la etiqueta que uses para mostrar tu código, pre, code o xmp, si vas a mostrar html primero tienes que escaparlo (la verdad odio esta palabrita). Para ello puedes usar alguna aplicación web, como http://www.khurshid.com/i-make-postable/ que te ahorra el trabajo de hacerlo tu mismo.