Accesibilidad web: Diversidad funcional visual

Introducción

Como ya sabes hay muchas personas, que tienen diversidad funcional visual, y no pueden disfrutar de la tecnología y del acceso a Internet como las personas videntes.

Por eso, existen diversas formas de acceder a Internet para las personas que tienen algún tipo de dificultad para ver o directamente visión nula.

diversidad funcional visual

Ceguera: ¿Cómo acceden las personas ciegas a Internet?

En primer lugar, vamos a hablar de lo más importante que una persona ciega pueda acceder a los contenidos en Internet: el lector de pantalla.

Lectores de pantalla

Los lectores de pantalla permiten a las personas usuarias navegar a través del contenido web de muchas formas: Puede que lea toda la web, pasar de encabezado en encabezado, pasar por enlaces, etc. Algunos ejemplos de lectores de pantallas son: JAWS, NVDA y VoiceOver.

Los lectores de pantalla también puede ser utilizados por aquellas personas que son sordas e invidentes, pero en lugar de convertir texto en voz, los lectores de pantalla para los sordo-ciegos pueden convertir texto en caracteres Braille actualizables en dispositivos Braille.

Los dispositivos de este tipo poseen pines pequeños que se pueden subir o bajar para formar los caracteres Braille que las personas sordo-ciegas pueden sentir.

dispositivo braille

Problemas y limitaciones del lector de pantalla

Imágenes: Uno de los problemas más importantes que tienen es poder acceder al contenido de las imágenes porque los lectores de pantalla no pueden describir las imágenes. Para ello, tenemos que poner textos alternativos con el atributo alt.

Diseño visual: Las personas que ven se percatan de cómo está estructurado un sitio web. Mientras que, los lectores de pantalla no pueden estudiar la totalidad de una página web. No puede hacer eso porque se lee de forma lineal.

Tablas de datos: Del mismo modo, los lectores de pantalla deben leer de manera lineal tablas de datos lo que puede llegar a ser muy confuso. Imagínese tratando de escuchar una tabla de datos de gran tamaño. Os dejo un artículo que escribí sobre la elaboración de tablas accesibles.

Accesibilidad mediante teclado

El hecho de que los usuarios de lectores de pantalla usan el teclado como su medio principal de navegación en la Web es un punto que los desarrolladores deben tener en cuenta. Sin siquiera darse cuenta de las consecuencias, algunos desarrolladores web hacen que los sus sitios sean únicamente accesibles mediante el ratón. Os dejo un artículo que escribí sobre los problemas que existen y cómo mejorar la accesibilidad por teclado.

Diferentes problemas a los que se enfrentan las personas usuarias y posibles soluciones

  • Cuando no usan ratón, es imprescindible el uso alternativo del teclado.
  • En cuanto a imágenes, fotos gráficos, proporcionar descripciones de texto en el atributo alt y, si es necesario, añadir explicaciones detalladas, ya sea en la misma página o mediante un enlace a otra página.
  • Cuando leen las páginas mediante lector de pantallas, permitir saltarse menús y contenido que sea tedioso de escuchar.
  • Saltar enlaces con la tecla TAB, asegurarse de que los enlaces tengan sentido fuera de contexto.
  • Los marcos no se pueden “ver”, por lo que no es recomendable usar marcos a no ser que sea estríctamente necesario. Si los usas, proporciona el título del marco que comunique su propósito. (“contenido principal”, “marco de navegación”).
  • Para las tablas y gráficos complejos, se recomienda proporcionar descripciones de texto o resúmenes.
  • No todos los lectores de pantalla soportan mapas de imágenes, así que se debe poner enlaces de texto redundantes en la propia página para los puntos calientes en los mapas de imágenes.
  • Los colores no se pueden usar, por lo que no debemos transmitir información sólo con el color. Uno de los problemas más significativos respecto al color, es el daltonismo.
  • Mientras navegan esperan que los enlaces les lleven a otro sitio, por lo que no se debe escribir guiones inferiores en los enlaces que no tienen destinos reales asociados (ejemplo: href="javascript: function(this)")
  • Es difícil poder leer el contenido de la celda una tabla, y tienen sentido cuando se leen fila por fila y de izquierda a derecha.

Tipos de baja visión

Como ya sabemos, hay muchos tipos de problemas de visión. La baja visión es más común entre los ancianos, pero puede ocurrir en personas de cualquier edad como consecuencia de enfermedades como la degeneración macular, glaucoma, retinopatía diabética o las cataratas.

Pero antes de empezar, es importante recordar el principio importante que hay que tener en cuenta: Perceptible.

Degeneración macular

La degeneración macular ocurre cuando los vasos sanguíneos anormales en la parte posterior del ojo empiezan a filtrar líquido o sangre, haciendo borrosa la visión central, siendo a menudo el resultado la pérdida rápida de la visión. El resultado es una pérdida gradual de la visión.

En cualquier caso, la zona central de la vista es la más afectada, por lo que es difícil ver los objetos que la persona está mirando directamente.

Las imagen a continuación son una simulación del efecto de la degeneración macular. El texto puede aparecer roto y poco claro.

dos fotografías iguales donde en una de ellas se ve el efecto de la degeneración macular, que es tener visión central nulaa

Glaucoma

El glaucoma es causado por un aumento de presión dentro del ojo, lo que provoca daños en el nervio óptico. El resultado es el efecto opuesto al de la degeneración macular.

Como se ve con glaucoma, efecto borroso en la visión central

Retinopatía diabética

Uno de los efectos a largo plazo de la diabetes puede ser la filtración de los vasos sanguíneos de la retina, causando manchas oscuras en el campo de visión en la que las fugas se producen. El texto puede aparecer borroso o distorsionado en estas regiones.

retinopatía diabética

Catarata

Las personas con cataratas tienen áreas de opacidad en el cristalino de sus ojos lo que se traduce en un efecto de difuminado o con neblina, especialmente a la luz brillante. El texto puede tender a desaparecer en el fondo. El alto contraste es especialmente importante para las personas con cataratas avanzadas.

cataratas

Magnificadores de pantallas, lupas

La tecnología más común que usan las personas con baja visión es la lupa de la pantalla. Este es un programa de software que acerca un área pequeña de la pantalla al usuario, permitiendo a las personas con baja visión que puedan ver con más claridad. Magnificadores de pantalla comunes incluyen ZoomText y MAGic.

Algunos tipos de contenido son difíciles de interpretar cuando se amplían. Por ejemplo, los gráficos que contienen texto pueden convertirse en bloques y pixelarse demasiado, por lo que el texto es difícil de entender.

Pero lo que es importante es que, para hacer más legible el texto cuando se amplía, la opción recomendada es el uso de texto real, en vez de gráficos o imágenes que contengan texto.

Alto Contraste

Los sitios con bajo contraste puede ser difíciles de leer para las personas con baja visión. Algunos sitios mal diseñados de la web tienen malas combinaciones de color, tales como enlaces de color azul sobre fondo negro, texto en color rojo sobre fondo verde, u otras combinaciones que no son fáciles a los ojos de cualquiera, pero especialmente difíciles para las personas con baja visión.

Por lo tanto, en la medida de lo posible, aumenta el contraste de tu página web, incluyendo gráficos, fuentes y fondos.

Fuentes predilectas y colores de fondo

Algunas personas con baja visión van a cambiar la configuración de su sistema operativo y/o el navegador no sólo para ampliar el texto, sino también para aumentar el contraste del texto en relación con el fondo. A algunas personas les gusta tener un fondo negro con texto blanco o amarillo. Por el contrario, otros prefieren tener un fondo blanco o amarillo con el texto en negro. Estos son los ajustes más comunes, pero hay otras personas que prefieren otras opciones de alto contraste. Y hablando de contrastes, os dejo aquí el artículo que hice sobre la sensibilidad reducida al contraste, que es un problema de baja visión.

color de alto contraste y texto grande

Para permitir que las diferentes personas realicen sus ajustes de contraste, ya que como hemos visto hay multitud de formas, lo mejor es poner el texto en plano, evitando que éste aparezca en fotografías.

Desplazamiento horizontal

Este punto no es tanto una cuestión de accesibilidad, sino más bien de usabilidad. Probablemente ha llegado a sitios web que requieren el uso de su barra de desplazamiento horizontal para ver el contenido de la derecha de la pantalla, a pesar de que tenía la ventana del navegador maximizada.

Esto puede ser un poco molesto para las personas con visión perfecta, pero es aún más para las personas que usan magnificadores de pantalla y se ven obligados a desplazarse aún más hacia el interior izquierdo y derecho del pequeño espacio ampliado que están viendo.

La regla general en el diseño de la baja visión es hacerlo todo configurable. Si el texto es un texto plano, las personas usuarias pueden ampliar, cambiar su color y cambiar el color de fondo. Si el diseño es en porcentajes, la pantalla puede ser ampliada o reducida para satisfacer las necesidades de las personas usuarias. La configuración es la clave.

Problemas y soluciones para la baja visión

  • El texto en gráficos o fotos no se agranda sin software especializado y se ve pixelado cuando se amplía, con lo cual, se recomienda limitar o eliminar el texto en gráficos o fotos.
  • Las personas usuarias pueden establecer su propia fuente y los colores de fondo, por lo que hay que permitir que lo hagan usando texto en plano, y no en texto escrito en una foto o gráfico.
  • Los magnificadores de pantalla reducen el tamaño de la ventana útil, por lo que, hay que utilizar unidades relativas en lugar de absolutas (por ejemplo, porcentajes de utilización de ancho de tabla en lugar de píxeles), para reducir la cantidad de desplazamiento horizontal.

Herramientas que se pueden usar para este tipo de dificultades visuales

  • NoCoffee Vision Simulator

Existen unas extensiones, tanto para Google Chrome como para Mozilla Firefox, que es bastante interesante, para hacernos una idea de cómo ven los sitios web las personas que tienen algún tipo de problema de visión.

Es muy sencilla de usar, simplemente tenemos que ver las diferentes opciones y comprobar el efecto visual que se produce en los sitios web cuando señalamos las opciones que queramos.

Herramienta de NoCoffee para diversidad funcional visual

3 Replies to “Accesibilidad web: Diversidad funcional visual”

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *