Addaw, ir a inicio Donar

Técnica Técnicas generales WCAG 2.2

G61Mantener el mismo orden en los bloques que se repiten en todas las páginas

Nombre oficial en el W3C: Presentar los componentes repetidos en el mismo orden relativo cada vez que aparecen

En pocas palabras

Los bloques que aparecen en muchas páginas, como el logotipo, el buscador o el menú, deben salir siempre en el mismo orden. Una página puede tener un bloque de más o de menos, pero los que se repiten no cambian de posición entre sí. Así la persona aprende la estructura una vez y la reconoce en todo el sitio.

Por qué es importante

Quien usa un lector de pantalla (programa que lee en voz alta lo que hay en la pantalla) recorre la página en orden. Si el menú unas veces va antes del buscador y otras después, tiene que explorar de nuevo cada página.

Lo mismo le ocurre a quien usa una lupa de pantalla y solo ve una parte cada vez. También a las personas con dificultades de memoria o de atención. Una estructura previsible ahorra tiempo y errores a todo el mundo.

Cómo se hace

  1. Haga una lista de los bloques comunes: logotipo, buscador, menú principal, migas de pan, pie de página.
  2. Fije ese orden en la plantilla del sitio (por ejemplo, el tema de WordPress) para que todas las páginas lo hereden.
  3. Si una página no necesita un bloque, quítelo sin mover los demás. Una página sin buscador mantiene el logotipo antes del menú.
  4. En los menús, conserve el orden de los enlaces principales. Puede añadir los enlaces propios de una sección, como los cursos dentro de «Formación», sin reordenar el resto.
  5. Cuide que el orden del código coincida con el que se ve en pantalla. El lector de pantalla y el teclado siguen el orden del código.

Cómo comprobarlo

  1. Elija varias páginas de secciones distintas: portada, una noticia, el formulario de contacto.
  2. Anote en qué orden aparecen los bloques repetidos en cada una.
  3. Confirme que el orden relativo es siempre el mismo, aunque falte algún bloque.
  4. Compare los enlaces del menú principal entre páginas y compruebe que no cambian de orden.
  5. Recorra las páginas con la tecla Tab para confirmar que el orden del foco también se mantiene.
Ver el texto completo del W3C (traducción al español)

Esta es una traducción no oficial al español de la técnica G61 de Techniques for WCAG 2.2, del W3C. Puede contener errores. El único documento oficial y normativo es la versión original en inglés, publicada en el sitio web del W3C.

Aplicabilidad

Cualquier tecnología.

Descripción

El objetivo de esta técnica es facilitar el uso del contenido haciendo más predecible la ubicación de los componentes repetidos. Esta técnica ayuda a mantener una disposición o presentación coherente entre páginas web presentando los componentes que se repiten en el conjunto de páginas web en el mismo orden relativo cada vez que aparecen. Pueden insertarse otros componentes entre ellos, pero su orden relativo no cambia.

Esta técnica también se aplica a los componentes de navegación que se repiten. Las páginas web suelen contener un menú de navegación u otro componente de navegación que permite al usuario saltar a otras páginas web. Esta técnica hace más predecible la ubicación de los componentes de navegación presentando los enlaces o referencias programáticas dentro de un componente de navegación en el mismo orden relativo cada vez que se repite el componente de navegación. Pueden eliminarse otros enlaces o insertarse entre los existentes, por ejemplo para permitir la navegación dentro de una subsección de un conjunto de páginas web, pero el orden relativo no cambia.

Ejemplos

  • Un sitio web tiene un logotipo, un título, un formulario de búsqueda y una barra de navegación en la parte superior de cada página; estos aparecen en el mismo orden relativo en cada página en la que se repiten. En una página falta el formulario de búsqueda, pero los demás elementos siguen en el mismo orden.
  • Un sitio web tiene un menú de navegación a la izquierda con enlaces a las principales secciones del sitio. Cuando el usuario sigue un enlace a otra sección del sitio, los enlaces a las secciones principales aparecen en el mismo orden relativo en la página siguiente. A veces se eliminan enlaces y se añaden otros, pero los demás enlaces se mantienen siempre en el mismo orden relativo. Por ejemplo, en el sitio web de una empresa que vende productos y ofrece formación, cuando un usuario pasa de la sección de productos a la sección de formación, los enlaces a los productos concretos se eliminan de la lista de navegación, mientras que se añaden enlaces a la oferta formativa.

Pruebas

Procedimiento

  1. Enumerar los componentes que se repiten en cada página web de un conjunto de páginas web (por ejemplo, en cada página de un sitio web).
  2. Para cada componente, comprobar que aparece en el mismo orden relativo con respecto a los demás componentes repetidos en cada página web en la que aparece.
  3. Para cada componente de navegación, comprobar que los enlaces o referencias programáticas están siempre en el mismo orden relativo.

Resultados esperados

  • La comprobación n.º 2 es verdadera.
  • La comprobación n.º 3 es verdadera.

Cómo lo comprobamos en ADDAW

En cada auditoría de ADDAW revisamos esta técnica página a página y le entregamos los errores con capturas y la forma de corregirlos.

Solicitar una auditoría

Basado en la técnica G61 del W3C (WCAG 2.2). Explicación y ejemplos: ADDAW. Traducción no oficial del texto del W3C © W3C, licencia de documentos del W3C. ¿Ha visto un error? Escríbanos.