¿Desarrollas webs para todo tipo de usuarios o exclusivamente para personas que acceden de la misma forma que tú? ¿Sabes que hay usuarios disléxicos así como personas daltónicas o con otra serie de impedimentos para navegar de forma  usual a través de la web? El post de esta semana es el segundo, de una serie de tres partes, en la cuáles hablamos de la accesibilidad web desde el punto de vista de los diferentes roles:

Este artículo se centra en los desarrolladores. En el contenido anterior, hablábamos de los diseñadores y en el próximo y último, lo haremos en base a los editores. En cada contenido, aportamos consejos concretos sobre cómo crear una web accesible para todo tipo de usuarios.

Títulos de páginas

Asegúrate de que todas las páginas de la web, tengan un título descriptivo que refleje el contenido de la página. Así mismo, es importante que los editores web puedan introducir los títulos de página a través de la herramienta de gestión de contenido o CMS que estéis utilizando.

Navegación a través del teclado

Todo el contenido de una página web debe ser navegable tanto con el ratón del ordenador como con el teclado. Esto se aplica a formularios, botones y enlaces.

Ten en cuenta que algunos usuarios no están capacitados para usar el ratón. Este tipo de usuarios hacen uso del teclado para navegar en la web mediante la tabulación a través del contenido. Por esta razón, siempre debe ser visualmente evidente en qué parte de la página web se encuentra navegando actualmente. La mayoría de los navegadores lo muestran automáticamente con una línea punteada alrededor del contenido. Podemos implementar diferentes formas de mostrarlo, lo importante es que el usuario lo detecte con facilidad.

Secuencia de los contenidos

Cuando se codifica el contenido de las páginas web, hay que asegurarse de que tenga un orden significativo, tanto visualmente así como en la secuencia de codificación. Algunos usuarios navegan por las páginas en este orden, por ello debemos garantizar que la estructura sigue un orden coherente incluso si los estilos estuviesen desactivados y que se podría navegar igualmente a través del contenido.

Ampliación de pantalla

Asegúrate de que el texto de la página web pueda cambiar de tamaño hasta un 200% como mínimo, y seguir siendo visualmente atractivo (los navegadores y soportes más nuevos pueden hacer zoom en el contenido de forma automática).

Lenguaje

Para que los usuarios puedan mostrar el contenido en el idioma correcto, es importante que las páginas tengan una definición de idioma adecuada en la etiqueta HTML de una página web. La etiqueta de idioma debería ser 'en' para las páginas en inglés, por ejemplo, y 'da' para las páginas en danés, etc.

El CMS debe dar a los editores web la posibilidad de resaltar el texto que está en un idioma diferente al del resto de la página. El contenido resaltado debería añadir el atributo lang="" al código.

Programando

Para asegurarnos de que la web es consistente en diferentes plataformas (como operadores de sistemas y navegadores diversos) y asegurar que las tecnologías puedan renderizar el contenido de una manera significativa, se debe cumplir con el lenguaje estándar para el formato en el que se publica. Si, por ejemplo, está publicando en XHTML 1.0 o HTML 5.0 se deben seguir las reglas sintácticas para este formato. Puede comprobar si hay errores de sintaxis en la siguiente herramienta: http://validator.w3.org/

También se debe revisar que los elementos estén marcados con las etiquetas correctas. Por ejemplo, los encabezados HTML deben etiquetarse como <h1></h1> (h1...h6).

Las tablas de datos deben estar etiquetadas como <table> y los editores web deben ser capaces de añadir descripciones a las tablas de datos a través de la etiqueta <caption>. Los encabezados de las columnas y filas deben definirse mediante el uso de <th> y quizás `id de encabezado' y `ámbito de aplicación'. Si una tabla de datos compleja requiere una explicación para los usuarios que necesitan un programa lector de pantalla, esto debe hacerse a través de un 'resumen'.

Al escribir texto, los editores web deben ser capaces de enfatizar partes del contenido con las etiquetas <strong> y <em>.

Cuando se utilizan elementos de formulario, se debe conectar explícitamente una etiqueta a cada control y se deben ensamblar los elementos de formulario que pertenecen al mismo grupo. Por ejemplo, un grupo de botones de opción debe agruparse con <fieldset> y <legend>. Hay una serie de técnicas para asegurar esto: Técnicas para 1.3.1 y Técnicas para 4.1.2.

Entrada de usuario

Si el usuario debe introducir información en un campo de texto, asegúrate de que si el texto se introduce en un formato incorrecto, se le notifique, y, si es posible, ayude al usuario a corregir el error. Cuando se rellena un formulario que forma parte de una operación financiera o de un compromiso legal en el que se modifican los datos, el sistema debe verificar la entrada para evitar errores o bien el usuario debe tener la opción de leer la entrada antes de enviarla. Una tercera opción es permitir que el usuario anule el envío.

Gráficos

Si la web contiene elementos visuales que no son texto, es importante aportar una descripción textual a los mismos. Por ejemplo las imágenes. En HTML se utiliza el atributo (alt=””) que define en palabras el contenido de la imagen.

Es importante tener en cuenta que un texto alternativo adecuado refleja el propósito de la imagen y no necesariamente qué elemento contiene.

Las herramientas de gestión de contenidos (CMS), deben permitir la introducción de textos alternativos para las imágenes. El atributo alt debe estar siempre etiquetado en todas las imágenes, y debe permitir al editor web dejar el campo vacío o dar una descripción para la imagen.

El texto alternativo debe especificar de qué se trata la imagen en su contexto, por ello sería poco práctico o descriptivo, introducir un único texto por imagen al subirla a la librería de medios. El CMS debería permitirnos introducir un nuevo texto alternativo cada vez que se utilice una imagen en una página de la web.

Si la web contiene archivos multimedia, debería también ofrecernos la posibilidad de añadir una etiqueta descriptiva para el mismo.

Audio y video

Si publicas un audio o video en una web, debes aportar un formato alternativo y añadir descripciones de audio. Asegúrate de que todos los botones y la navegación del reproductor de vídeo se pueden utilizar tanto con el ratón del ordenador como con el teclado. Proporciona descripciones de texto para todos los botones de navegación para ayudar al software que lee la pantalla

Para un vídeo, se debería poder introducir una pista dedicada a la descripción de audio y añadir subtítulos.  Si un audio se inicia automáticamente, el usuario debe ser capaz de pausar, detener o controlar el volumen del sonido.

Control del usuario

Algunos usuarios necesitan mucho tiempo para leer y navegar páginas web. Por lo tanto, si hay un límite de tiempo en las páginas, como por ejemplo un tiempo muerto, los usuarios deben poder cambiar el límite ya sea ajustándolo, ampliándolo o desactivándolo.

Si se añade contenido movible, parpadeante o desplazable, también es importante que el usuario pueda pausar, detener u ocultar este contenido.

Para que los usuarios de lectores de pantalla no tengan que escuchar el mismo contenido cada vez que cargan una página nueva, ofrezca la opción de omitir bloques de contenido repetido. El contenido repetido puede ser un menú global (y un menú local) y funciones de ayuda. Hay varias técnicas que se pueden aplicar para asegurarse de esto. La técnica más sencilla es proporcionar un enlace en la parte superior de todas las páginas que lleve al usuario al contenido principal de la página (por ejemplo, el título 1 de la página en la sección de contenido). También hay otras opciones: Técnicas para 2.4.1.

Cuando un elemento va a ser pulsado por el usuario, como un menú desplegable, un botón de radio o similar, es importante que actúe como el usuario espera. Los elementos no deben reaccionar hasta que el usuario haya tenido tiempo de elegir y confirmar.

Contenido parpadeante

El contenido no debe parpadear con una frecuencia de más de tres veces por segundo, de lo contrario puede causar un episodio epiléptico al lector. 

Si quieres aprender más sobre la accesibilidad web, descarga nuestro libro electrónico de accesibilidad digital completo.

¿Quieres más información acerca de cómo empezar con la accesibilidad web? Descarga gratis nuestra guía de accesibilidad web.

 

Guía de accesibilidad de Siteimprove