Categorías
Actualidad General

5 maneras de hacer que su sitio web sea accesible

Tecnologías de asistencia son todos aquellos dispositivos como lectores o magnificadores de pantalla, audífonos o líneas braille destinados a facilitar la navegación a través de la web, a todos aquellos usuarios con alguna discapacidad que les impida hacerlo por sí mismos.

Crear una interfaz amigable para estos usuarios y sus dispositivos es responsabilidad de programadores y diseñadores, quienes deben tomar en cuenta una serie de sencillos pasos que no solo ayudarán a estas personas, sino que, incluso, le harán la vida y la navegación más fácil a los usuarios convencionales.

1. Asegúrese de que su sitio web sea compatible con el teclado

Muchas tecnologías de asistencia dependen únicamente del teclado para navegar los sitios web, es por eso que es de primordial importancia que cualquier página o sitio puedan funcionar sin el uso de un mouse. Es decir, a la hora de programar, debe pensar qué haría un usuario si se le “escapa el ratón”, ya sea que se le rompa, se le descomponga o se le pierda.

En un caso así, o en el caso de las tecnologías de asistencia, el usuario debería tener la posibilidad de acceder a todas las funciones principales de la página usando sólo su teclado y la forma más común para hacerlo es usando la tecla Tab. Al presionar esta tecla, el usuario debe saltar entre las áreas de una página que cuentan con un “enfoque de teclado”, lo cual incluye enlaces, botones y formularios.

Por lo tanto, su objetivo debe ser garantizar que se pueda acceder a todo el contenido web y la navegación mediante Tab.

2. Todo el contenido debe ser fácilmente accesible

Otro problema a tomarse en cuenta para la fácil accesibilidad de la página es el contenido dinámico. Además de hacer que el sitio sea compatible con el teclado, también hay que asegurarse de que todo el contenido del sitio sea realmente accesible.

El contenido dinámico es aquel que cambia dependiendo de la actividad del usuario en el sitio —como las recomendaciones que nos hacen los sitios de compras luego de haber agregado artículos al carrito— o su ubicación geográfica —como las recomendaciones de restaurantes de algunas apps para ordenar comida a domicilio—.

En este caso, el problema es con las herramientas de asistencia, ya que si el sitio no les informa sobre dichos cambios, el usuario no se enterará de la existencia del nuevo contenido.

Por ejemplo, muchos lectores de pantalla leerán únicamente el sitio tal como aparece cuando se carga por primera vez; sin embargo, lo ideal es que le informen al usuario cuando el contenido cambie, para que este no se pierda el nuevo contenido.

Una de las formas de solucionar esto es usando puntos de referencia ARIA, que son como un banderín de un árbitro asistente en el futbol; este le avisa al lector de pantalla, que sería el árbitro principal, sobre lo que está sucediendo en un sector específico del campo de juego o, en este caso la pantalla.

Etiquetar el contenido dinámico como una “región en vivo” le permitirá a los lectores de pantalla y dispositivos similares comprender el contenido a medida que cambia.

3. Agregar texto alternativo a todas las imágenes

Es más o menos el mismo caso de los contenidos dinámicos. El texto alternativo de una imagen es lo que aparece en pantalla cuando el contenido gráfico no se puede cargar, por ejemplo “foto de una planta verde” dentro del recuadro donde debería estar la imagen de dicha planta.

Los lectores de pantalla acceden al texto alternativo (a veces denominado atributos alternativos, descripciones alternativas o etiquetas alternativas) para “leer” la imagen; por ello es preciso llenar estos campos con las descripciones necesarias, dándole a los usuarios un contexto que, de otra forma, se perderían.

Se puede pensar en estos como las notas a pie de página en un libro; estos le indican al lector de qué otro libro se extrajo el dato o la cita que está leyendo en ese momento o que aclaran alguna cifra o un dato extra, sin afectar la estructura del resto del texto.

4. Elige tus colores con cuidado

El daltonismo es mucho más que ver las cosas en blanco y negro o la incapacidad para distinguir el rojo del verde; como todo en la vida, hay grados de gris, es decir, hay diferentes niveles de daltonismo, incluso entre quienes no son formalmente daltónicos, cada persona percibe los colores de forma única.

Es por ello que es necesario asegurarse de que los colores seleccionados para su sitio tengan un adecuado nivel de contraste, para que todos puedan distinguir con claridad los diferentes elementos de la página.

Especialmente el texto necesita un buen contraste contra el fondo; en este caso lo ideal es establecer un color oscuro sobre uno claro, asegurándose de que no se desvanezcan entre sí.

Lo más usual es negro sobre blanco, ya que es la que se lee mejor y es eficaz para textos largos; el contrario, blanco sobre negro, se puede usar para textos cortos, que necesitan resaltar; cualquier otra combinación es poco recomendable, especialmente en el caso de gente con algún grado de ceguera al color, además de que suele considerarse que los textos en color son poco serios.

5. Use encabezados para estructurar el contenido correctamente

El uso correcto de los encabezados es clave para que su sitio sea accesible; son como las señales de carretera o como las líneas que marcan una cancha de futbol: le dan estructura al texto y le permiten al usuario y/o a los lectores de pantalla saber dónde están y qué están leyendo.

Además de mejorar el flujo de la página y ayudar a los lectores de pantalla, es muy fácil de hacer; los niveles de encabezado son autoexplicativos, el H1 es el más grande y de ahí puede llegar hasta el H6, que es el más pequeño.

No obstante, como ya se dijo, hay que usarlos de forma adecuada; por ejemplo, solo debe haber un H1 por página, ya que es el título del texto y lo primero que lee el usuario; a este le siguen todos los subtítulos, empezando por el H2, en los que se anidan los H3 y en estos, a su vez, los H4 y así sucesivamente.

Debe evitarse, por todos los medios, usar un H4 debajo de un H1 o de un H2, ya que sería como si el manchón penal estuviera a la mitad del campo o las líneas del área chica se extendieran fuera del área grande en un campo de futbol.

Conclusión

El correcto uso de los recursos de programación y diseño es clave para garantizar la accesibilidad de un sitio o página web; emplear de forma correcta y secuencial los encabezados, una buena selección de color, etiquetar cada imagen con su respectivo texto alternativo harán más amigable la experiencia no solo del usuario que necesita apps o dispositivos de asistencia, sino del público en general.

Esto último, a su vez, es una forma de incentivar la lealtad del usuario, el cual no solo querrá regresar a su página cada que lo necesite, sino que mejora las probabilidades de que la recomiende; así, el tráfico se incrementará y con ello las oportunidades de negocios también crecerán.

Categorías
Actualidad Diseño General

¿Qué tan accesibles son los sitios web en Chile?

El mundo con COVID-19 es nuestra nueva realidad, por lo que estoy incluyendo enlaces a algunas actualizaciones positivas sobre la investigación, al final de cada artículo.

Una cosa que ha sido interesante ver en las últimas semanas es cómo ha cambiado nuestra relación con el tiempo frente a la pantalla. Para muchos, el tiempo frente la pantalla ahora es todo el tiempo y, junto a esto vemos que los sitios web que frecuentan las personas en Chile en general no son para nada accesibles ¿Qué hacemos frente a esta gran problemática?.

Para entender un poco más la situación en Chile, a mediados de Marzo que debemos permanecer en nuestros hogares, para evitar el riesgo de contagio de Coronavirus, esto quiere decir que diariamente usamos una cantidad de aplicaciones que, al menos en mi caso son muchas, ya que trabajo diseño interfaces gráficas específicamente, afortunadamente estas herramientas son accesibles, en el caso que trabaje en una zona con poca iluminación solo debo activar una opción del computador o smartphone para que no me haga forzar la vista y funciona, ¿Por qué? Sencillamente existen contrastes de colores que facilitan la lectura, estar frente a la pantalla es un reto, no solo para quienes debemos pasar más horas, si no que para todos, quienes quieren estar informados que no sea por la tv o radio, quienes entran a twitter para saber quién está vendiendo verduras en su sector con reparto a domicilio o tan solo saber qué tramites online pueden hacer para no salir de sus casas. Es por esto que me pregunto ¿Qué tal funcionan los sitios web chilenos? ¿Realmente están disponibles para todas y todos? Hice un pequeño test para saber que tan bien preparados están para su uso, revisémoslos a continuación:

Contraste de color

Un buen contraste de colores nos permite tener una mayor claridad del contenido que estamos viendo. Según el estándar internacional de las pautas de accesibilidad WCAG 2.1 la relación de contraste entre el fondo y un texto de tamaño normal que son 14pt debe tener una relación de contraste mínimo de 4.5:1. Pongo como ejemplo la página inicial del banco estado en dónde tomé 3 muestras de contrastes de colores en areas claves como la navegación del sitio web e información sobre políticas de seguridad, veamos qué pasa.

1.- Navegación superior: El fondo gris y texto blanco tienen una relación de contraste de 4.47:1. No pasa la prueba.

Barra de navegación superior

2.- Navegación de productos y servicios: El fondo naranjo y texto blanco tienen una relación de contraste de 2.4:1. No pasa la prueba.

Barra de navegación superior de productos y servicios

3.- Pie de página: El fondo y texto tienen una relación de contraste de 4.01:1. No pasa la prueba.

Tomemos como ejemplo un jubilado con poca sensibilidad al contraste:

Problema de contraste: “No pude usar el formulario de pedidos, no había cajas de texto. Después de una larga llamada con el servicio de atención al cliente, supe que las cajas de texto tenían un borde muy claro que yo no podía ver.”

El contraste funciona bien: “Puedo ver los iconos, botones y todo lo demás fácilmente, incluso bajo la luz del sol.”

Fuente: https://www.w3.org/WAI/standards-guidelines/wcag/new-in-21/es

Las pruebas de contraste de colores las hice en la herramienta online “Contrast Checker” de Webaim y la pueden encontrar en https://webaim.org/resources/contrastchecker/

Estructura de encabezados

Al encontrar una página web larga, algunos de nosotros nos desplazamos rápidamente y buscamos los encabezados para tener una idea del contenido. Las personas que usan lectores de pantallas – en inglés Screen readers – y otras tecnologías de asistencia que también tienen la capacidad de navegar por las páginas web desde la estructura de los encabezados, por lo que éstos deben estar bien jerarquizados según el contenido. Pongo como ejemplo la página inicial de Emol. Veamos qué pasa.

Visualización de encabezados desorganizados en el menú de Voice Over de Mac. emol.com

En la imagen está la opción del VoiceOver de mac – Screen Reader –  habilitada  para navegar desde los encabezados de la página y se muestra cómo del nivel 1 siendo la posición más importante de una jerarquía pasa al nivel 3 saltándose el nivel 2 y cada encabezado es independiente al contenido del anterior. La estructura dice que teniendo un encabezado nivel 1 es el más importante siendo así típicamente el titulo de la página, dándole al usuario un indicador de lo que se trata la página completa – se debe tener solo 1 encabezado nivel 1 por página. Cada encabezado nivel 2 crea una sección de contenido. Dividen las páginas en secciones consumibles que ayudan a organizar el contenido.

Cuando llegue al siguiente encabezado, pregúntese: ¿Es una nueva sección? Si es así, un Título 2 sería apropiado. Si es una subsección del último título 2, entonces un Título 3 sería adecuado. Si es una subsección del último Título 3, entonces un Título 4 sería una buena opción, y así sucesivamente.

Ejemplo de estructura de encabezados, desde el encabezado 1 hasta el encabezado 4

Fuente de la imagen: https://www.nomensa.com/blog/2017/how-structure-headings-web-accessibility

Analicemos el sitio web de la BBC, en la imagen siguiente vemos que cumple con esta norma de la estructura, es coherente. Se ha utilizado un solo Título 1 en la página, este se envuelve alrededor del logotipo (que es apropiado solo para la página de inicio). 

Las diferentes secciones de la página se definen como Encabezado 2 (incluidos algunos de los elementos sobre el encabezado 1), esto permite a los usuarios escanear la página fácilmente para encontrar la sección relevante para que la lean. Los encabezados de cada tema se definen como Encabezados 3.

Encabezados organizados correctamente según el contenido en el menú de Voice Over de Mac. BBC.com

Accesible con el teclado

Hay grupos de usuarios, como las personas con movilidad reducida, utilizan el teclado en vez del ratón para controlar el ordenador y navegar por una página web. A veces, ciertas partes de una página web sólo son accesibles mediante el ratón, lo que ocasiona un grave problema de accesibilidad para los usuarios antes citados. Los usuarios que pueden ver, utilizan el teclado para navegar por el computador y a su vez, por una página web, entonces necesitan que los elementos de interacción de la página muestren una señal visual cuando reciban el foco. Pongo como ejemplo la página inicial de vtr, un buen ejemplo para este caso. Veamos qué pasa.

Para comprobar una correcta navegación del sitio debemos presionar la tecla TAB la cual nos dirigirá al primer elemento interactivo, como un botó, link, elemento de formulario, etc. Lamentablemente ninguno de los elementos recibe el foco, por lo que desafortunadamente no pasa la prueba.

La página web presenta un grave problema de accesibilidad y viola el criterio de conformidad 2.1.1 Teclado de WCAG 2.0:

Toda la funcionalidad del contenido es operable a través de una interfaz de teclado sin que se requiera una determinada velocidad para cada pulsación individual de las teclas, excepto cuando la función interna requiere de una entrada que depende del trayecto de los movimientos del usuario y no sólo de los puntos inicial y final. (Nivel A).

Fuente: https://www.observatoriodelaaccesibilidad.es/espacio-divulgativo/articulos/10-pruebas-accesibilidad-web-realizar-10-minutos-parte-1.html

Para concluir, existe un estudio nacional de la discapacidad que se realizó en el 2015 que muestra el porcentaje de la población chilena de 2 años y más en situación de discapacidad .

HOMBRES: 12,9

MUJERES: 20,3

16,7% de la población de 2 y más años se encuentra en situación de discapacidad, es decir:
2 millones 836 mil 818 personas.

Estadística de la población en situación de discapacidad en Chile.

Cada día que no se aplican normas en el contenido web, estamos dejando fuera a muchas personas, tomemos conciencia para que el día de mañana todas y todos podamos disfrutar del mismo contenido y de la misma manera.

Fuente “Estudio nacional de la discapacidad” https://www.ciudadaccesible.cl/wp-content/uploads/2017/02/Folleto-II-Estudio-Nacional-de-la-Discapacidad.pdf

Categorías
General

Hacer que la tecnología sea accesible para tod@s

Hoy nos encontramos en una época en donde el acceso a la información es para todos y todas, ¿Me creerías si te digo que han pasado casi 30 años desde que lanzaron la primera página web? ¡Así es! Existen organizaciones que trabajan en estándares  internacionales para que su contenido sea accesible por todo el mundo.

No te distraigo más y dejo algunos recursos interesantes a continuación:

Mozilla

Guía Breve de Accesibilidad Web. Las cuatro cosas básicas y un montón de buenos enlaces.

Mozilla

https://developer.mozilla.org/es/docs/Web/Accesibilidad

Google

Todo el mundo debería poder acceder a Internet y disfrutar de la Web, y tenemos el compromiso de hacerlo realidad.

Google

  https://www.google.com/intl/es/accessibility/

Microsoft

No hay límites en lo que las personas pueden conseguir cuando la tecnología refleja la diversidad de todo aquel que la utiliza.

Microsoft

https://www.microsoft.com/es-es/accessibility/default.aspx

¡Grande lo que están haciendo estas empresas! ¿Tú qué opinas?

Si tienes material sobre accesibilidad no dudes en dejarlo en los comentarios. ¡Nos leemos!

Categorías
Diseño

Checklist de accesibilidad para diseñadores

El diseño accesible es un buen diseño: una interfaz de usuario accesible (UI) abre experiencias a una gama más amplia de usuarios y mejora las experiencias para los usuarios existentes. Esa es la belleza de diseñar con todas las habilidades en mente: beneficia a todos, no solo a aquellos con visión, audición o movilidad limitadas.

Al diseñar para discapacidades, estás resolviendo para unos pocos, pero extendiéndose a muchos. Tomemos por ejemplo, una tecnología como los subtítulos. Aunque fue diseñado para usuarios con audición limitada, muchas personas usan subtítulos para ver películas o programas de televisión hoy en día. La navegación con teclado es otro gran ejemplo: los usuarios con movilidad limitada usan el teclado para navegar por las pantallas, pero muchos otros usuarios también usan teclados para navegar rápidamente por las páginas. Claramente, todos los usuarios pueden beneficiarse de características más accesibles, y el diseño de la interfaz de usuario accesible no es diferente.

Jerarquía y orden ✓

¿Pueden los usuarios navegar visualmente una página? Al escanear una página para obtener información, los usuarios confían en la jerarquía visual: elementos importantes en la parte superior, elementos relacionados agrupados y encabezados que resumen el contenido. Los usuarios deberían poder recopilar información clave rápidamente y en un orden lógico. Los elementos esenciales incluyen:

  • Un título de página que describe el propósito de la página.
  • Encabezados que transmiten la estructura de la página.
  • Labels correspondientes por cada elemento de formulario.

Referencias:

Estructura de Jerarquía y orden
Ilustración de jerarquía y orden

Orientación (Vertical/Horizontal) ✓

Las aplicaciones o sitio web deben garantizar que el contenido se muestre en la orientación vertical u horizontal que prefiera el usuario. Algunos usuarios tienen sus dispositivos montados en una orientación fija (por ejemplo, en el brazo de una silla de ruedas eléctrica). Por lo tanto se debe pensar en un diseño que soporte ambas orientaciones. Los elementos esenciales incluyen:

  • Distintas resoluciones para cada caso de uso.
  • Coherencia en la estructura del contenido.
  • Zoom para secciones completas o aumento/disminución de texto.

Referencias:

Diseño responsive
Ilustración de diseño responsive

Uso del color y contraste ✓

El color es un elemento importante en el diseño, ya que mejora su atractivo estético, usabilidad y accesibilidad. Sin embargo, algunas personas tienen dificultades para percibir el color. Las personas con visión parcial a menudo experimentan una visión limitada del color, y muchos usuarios mayores no ven bien. Las deficiencias de color pueden afectar un poco el contraste. Por lo tanto, se recomienda tener un contraste adecuado entre el texto y el fondo. Algunas características esenciales son:

  • La relación (ratio) mínima de contraste de texto a fondo debe ser 4.5:1.
  • La relación (ratio) mínima de contraste de componentes (ej: Botón) a fondo debe ser 3:1.
  • El color no debe ser usado como un único indicador.

Referencias:

Ejemplo de buen y mal uso de contraste de colores
Ejemplo de buen y mal uso de contraste de colores

Navegación a través del teclado ✓

Cuando el contenido puede ser operado a través de un teclado o un teclado alternativo de asistencia, es operable por personas sin visión (que no pueden usar dispositivos como el mouse que requieren coordinación ojo-mano), así como por personas que deben usar teclados alternativos o dispositivos de entrada que actúan como emuladores de teclado. Los emuladores de teclado incluyen software de entrada de voz, software de sorber y soplar, teclados en pantalla, software de escaneo y una variedad de tecnologías de asistencia y teclados alternativos. Las personas con baja visión también pueden tener problemas para rastrear un puntero y encontrar el uso de software mucho más fácil (o solo posible) si pueden controlarlo desde el teclado. Para usar el teclado con un control (también componente), el control debe tener foco, y para recibir el foco (sin usar un puntero), el control debe ser accesible en un diseño de interfaz de usuario a través de la navegación por tab. Algunas de sus características principales:

  • Establece un orden de tabulación lógico a través de enlaces, controles de formulario y objetos interactivos.
  • Ajustar el foco de una manera intuitiva en una secuencia de forma coherente.
  • Proporcionar un mecanismo para descartar fácilmente el contenido adicional, como presionar Escape.

Referencias:

Ejemplo de foco activo en navegación por tab del teclado
Ejemplo de foco activo en navegación por tab del teclado

Recursos

Categorías
General

Tipos de discapacidad

La discapacidad se define como cualquier limitación, restricción o discapacidad que restringe las actividades cotidianas y ha durado o es probable que dure al menos seis meses. Las personas pueden nacer con una discapacidad o pueden adquirirla más adelante en la vida. La discapacidad puede ser consecuencia de un accidente, enfermedad, trastornos congénitos o genéticos.

Hay muchos tipos diferentes de discapacidad: física, intelectual o mental. Las siguientes descripciones pueden ayudarlo a comprender los diferentes tipos de discapacidades y cómo impactan en la vida de las personas.

Visual

Las discapacidades visuales pueden variar desde pérdida de visión leve o moderada en uno o ambos ojos hasta pérdida de visión sustancial o completa en ambos ojos. Algunas personas experimentan una reducción o falta de sensibilidad a ciertos colores o daltonismo, así como sensibilidad al brillo.

Éstos incluyen:

  • Daltonismo: dificultad para distinguir entre los colores generalmente rojo y verde, o amarillo y azul, y a veces la incapacidad de percibir cualquier color.
  • Visión baja: incluye visión borrosa, ver solo el centro del campo visual, ver solo los bordes del campo visual y visión nublada.
  • Ceguera: pérdida sustancial de visión en ambos ojos.

Cognitivo, aprendizaje y neurológico.

Las discapacidades cognitivas, de aprendizaje y neurológicas involucran trastornos neurológicos, así como trastornos de conducta y de salud mental. Impactan qué tan bien las personas procesan y comprenden la información.

Éstos incluyen:

  • Trastorno por déficit de atención con hiperactividad (TDAH): implica dificultad para concentrarse en una sola tarea, concentrarse durante períodos más largos o distraerse fácilmente.
  • Trastorno del espectro autista (incluye “autismo”, “síndrome de Asperger”): implica alteraciones de la comunicación social y la capacidad de interactuar.
  • Discapacidades de salud mental: incluyendo ansiedad, delirio, esquizofrenia, trastornos del estado de ánimo. En relación con la accesibilidad web, estas condiciones pueden causar dificultades para enfocar, procesar y comprender la información. Los medicamentos utilizados con frecuencia tienen efectos secundarios que incluyen visión borrosa, temblores en las manos y problemas de memoria.
  • Problemas de memoria: implica memoria limitada a corto plazo, falta de memoria a largo plazo o capacidad limitada para recordar el lenguaje. La demencia es una de las muchas causas diferentes de deterioro de la memoria.
  • Discapacidades de percepción (también llamadas “discapacidades de aprendizaje”): implica dificultad para procesar información sensorial como auditiva, táctil, visual. Esto incluye impedimentos en lectura o dislexia, escritura o disgrafía, manejo de conceptos matemáticos o discalculia.
  • Trastornos convulsivos: incluye diferentes tipos de epilepsia y migrañas, que pueden ser una reacción a la estimulación visual o auditiva.

Auditivo

Las discapacidades auditivas incluyen discapacidad auditiva leve a moderada en uno o ambos oídos. Incluso la pérdida o dificultad parcial puede ser problemática con respecto al contenido de audio.

Éstos incluyen:

  • Dificultad auditiva: discapacidad auditiva leve a moderada en al menos un oído.
  • Sordera: discapacidad auditiva que es sustancial e irrecuperable en ambos oídos.

Físico

Las discapacidades físicas o “motoras” son debilidad y limitaciones del control muscular. Estos incluyen: movimientos involuntarios, incluidos temblores, falta de coordinación, parálisis, limitaciones de la sensación, trastornos articulares como la artritis, dolor que impide el movimiento y falta de extremidades.

Éstos incluyen:

  • Amputación: faltan dígitos, extremidades u otras partes del cuerpo humano.
  • Artritis: inflamación y daño a las articulaciones.
  • Parálisis: pérdida de control sobre una extremidad u otra parte del cuerpo.
  • Lesión por estrés repetitivo: implica lesiones que se producen en los músculos, huesos y articulaciones debido al movimiento repetitivo.

Habla

Las discapacidades del habla incluyen la incapacidad de producir un habla que sea reconocible por otras personas o software. Por ejemplo, el volumen o la claridad del discurso podrían dificultar el reconocimiento.

Éstos incluyen:

  • Silencio: la incapacidad de hablar debido a una multitud de razones como trastornos mentales, deficiencias cognitivas o la capacidad de aprender a hablar.
  • Disartria: debilidad o parálisis de los músculos necesarios para hablar, incluidos los labios, los pulmones, la garganta y la lengua.
  • Tartamudeo: hablar con repetición involuntaria continua de sonidos, especialmente consonantes iniciales.

Fuente: Tipos de discapacidad

Categorías
General

Introducción a la Accesibilidad Web

La web es para muchas personas una parte esencial de su vida diaria, en el trabajo, en casa y en la calle. Accesibilidad Web significa que las personas con discapacidades puedan usar igualmente la Web, por ejemplo, alguien que no puede usar sus brazos y utiliza un palo con su boca para escribir en el teclado, o alguien que no oye bien y usa subtítulos para ver videos, o alguien que no ve bien y utiliza un Screen Reader (Lector de Pantalla) para leer en alto lo que está en la pantalla.

Hombre escribiendo con una barra de boca en una laptop
Hombre escribiendo con una barra de boca en una laptop

La Accesibilidad Web tiene muchos beneficios, por ejemplo los subtítulos en videos nos benefician a todos en un entorno ruidoso o silencioso, un buen contraste de color funciona mejor cuando hay reflejos, también se benefician las personas con problemas relacionados con la edad, como en movilidad reducida, de hecho cualquiera tiene una mejor experiencia de usuario con una estructura y diseño mejorados.

Configurando tamaño y estilo de subtítulos en pantalla
Configurando tamaño y estilo de subtítulos en pantalla

Se puede construir gran parte de la accesibilidad desde el código de aplicaciones y sitios web. Hoy en día HTML nos ofrece distintas etiquetas de apoyo para muchas características de la accesibilidad, por ejemplo características para ofrecer alternativas de texto en imágenes que son leídas en alto por los Screen Readers y también usan los motores de búsqueda. También etiquetas como las cabeceras y otras que mejoran la calidad en general.

La W3C ofrece estándares para ayudar a hacer la Web accesible, que son reconocidos por gobiernos e industrias a nivel internacional. El más conocido son las Pautas de Accesibilidad para el Contenido Web – WCAG (Web Content Accessibility Guidelines) también es el estándar ISO 40500 y se han adoptado en el estándar europeo EN 301 549. Está construida sobre cuatro principios básicos:

  1. Perceptible: Las personas pueden ver el contenido o escucharlo.
  2. Operable: Las personas pueden usar el dispositivo tecleando o por la voz.
  3. Comprensible: Las personas reciben un lenguaje claro y simple.
  4. Robusto: Las personas pueden usar diferentes tecnologías asistivas.

Además de la WCAG, la W3C también ofrece las Pautas de Accesibilidad en Herramientas de Autor – ATAG (Authoring Tool Accessibility Guidelines) que definen los requisitos para los sistemas de gestión del contenido, editores de código y otro software. Por último están las Pautas de Accesibilidad para Agentes de Usuario – UAAG (User Agent Accessibility Guidelines) estos definen los requisitos para los navegadores web y los reproductores multimedia.

En el mundo hay más de un billón de personas con discapacidades, sobre el 15-20% de la población, la Convención de la ONU sobre los Derechos de las Personas con Discapacidad define el acceso a la información, incluyendo la Web, como un derecho humano y la mayoría de los países del mundo han ratificado esta convención y muchos de ellos también han adoptado políticas asociadas, incluso aparte de cualquier ley o regulación.

La implementación de los estándares de accesibilidad es esencial para las personas con discapacidades y útil para todo el mundo.

Fuente: Fundamentos de accesibilidad