Desarrollo de Webs Accesibles PDF
Document Details
Uploaded by HandsDownRapture
IES Al-Ándalus
IES Al-Andalus
Isabel Cayuela Pérez
Tags
Summary
Este documento proporciona una introducción al desarrollo web accesible, incluyendo diferentes tipos de discapacidades, tecnología asistencial y principios clave de accesibilidad web. Los criterios de conformidad, así como las pautas de accesibilidad, se exploran a fondo en diferentes niveles. Se ofrece una visión general, con ejemplos y consideraciones prácticas.
Full Transcript
IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez Contenido 1. Concepto de accesibilidad......................................................................................................... 2 2. Tipos de discapacidad.....................................................................................
IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez Contenido 1. Concepto de accesibilidad......................................................................................................... 2 2. Tipos de discapacidad................................................................................................................ 3 Visual...................................................................................................................................... 3 Motriz..................................................................................................................................... 3 Auditiva.................................................................................................................................. 3 Cognitiva................................................................................................................................ 4 3. Tecnología asistencial................................................................................................................ 5 Dispositivos de entrada.......................................................................................................... 5 Dispositivos de salida............................................................................................................. 6 4. El consocio W3C......................................................................................................................... 6 5. Principios generales de diseño accesible y pautas de accesibilidad para el contenido en la web 7 6. Prioridades. Puntos de verificación. Niveles de adecuación...................................................... 8 7. Criterios de conformidad (WCAG 2.0)........................................................................................ 8 Criterios de conformidad de nivel A...................................................................................... 9 Criterios de conformidad de nivel AA.................................................................................. 12 Criterios de conformidad de nivel AAA................................................................................ 14 8. Criterios de conformidad WCAG 2.1........................................................................................ 17 9. HTML5 y accesibilidad.............................................................................................................. 18 ARIA...................................................................................................................................... 18 ALGUNAS REGLAS GENERALES............................................................................................. 19 Roles ARIA............................................................................................................................ 19 10. Herramientas de análisis de accesibilidad web.................................................................... 20 11. Autoría del documento........................................................................................................ 21 P á g i n a 1 | 21 IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez DESARROLLO DE WEBS ACCESIBLES El poder de la web está en su universalidad. El acceso de todos, independientemente de la discapacidad, es un aspecto esencial. 1. Concepto de accesibilidad Accesibilidad web es hablar de acceso universal. Consiste en hacer la web más accesible para todos los usuarios independientemente de las circunstancias y los dispositivos utilizados a la hora de acceder a la información. Con esta idea nació la WAI (Web Accessibility Initiative) Otra consideración importante y más orientada a instituciones y empresas, es que la accesibilidad web es un requisito establecido por leyes, lo cual lo hace de obligado cumplimiento en muchas situaciones. La Ley de Impulso de la Sociedad de la Información (LISI), fijó que las páginas existentes o de nueva creación deben cumplir el nivel de adecuación AA. Su no cumplimiento puede implicar multas (Ley 49/2007, de 26 de noviembre). “Todas las administraciones públicas y empresas de especial trascendencia económica deben ser accesibles a partir del 31/12/2008)”. Legislación: Ley 34/2002, de 11 de julio de 2002, de servicios de la sociedad de la información y comercio electrónico (LSSICE). Ley 51/2003, de 2 de diciembre de 2003, de igualdad de oportunidades, no discriminación y accesibilidad universal de las personas con discapacidad (LIONDAU). https://www.tuwebaccesible.es/accesibilidad-web/ P á g i n a 2 | 21 IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez 2. Tipos de discapacidad Entre la población podemos encontrar diferentes tipos de discapacidad: visual, motriz, auditiva, cognitiva. Visual Una persona tiene una discapacidad visual cuando tiene disminuida la función visual o bien cuando tiene una ceguera. La disminución visual, puede estar provocada por una reducción de la agudeza visual o del campo visual. Hay muchos tipos de problemas oculares y perturbaciones visuales: visión borrosa, halos, puntos ciegos,… Motriz Se dice que una persona tiene una discapacidad motriz cuando padece alguna disfunción en el aparato locomotor. Esta disfunción puede llevar asociados algunos problemas como son: Los movimientos limitados o incontrolados La falta de coordinación La falta de fuerza en las extremidades Cuando una persona, en condiciones normales, se sienta ante un ordenador tiene ante sí un conjunto de herramientas para usar, como el teclado y el ratón, que le obligan a mantener un control postural en todo momento. Las personas con discapacidad motriz tienen dificultades para enderezar la cabeza, el tronco y/o las extremidades y tienen problemas para realizar movimientos que requieran un gran control del tono muscular. Auditiva Las personas con discapacidad auditiva tienen una audición deficiente en ambos oídos. Estas personas se pueden clasificar en dos grandes grupos: Personas con hipoacusia: Son personas que mediante el uso de prótesis adecuadas son capaces de adquirir por vía auditiva el lenguaje oral. Personas con sordera: Son personas en las que la visión es su principal canal de comunicación ya que está incapacitado para adquirir el lenguaje oral por vía auditiva. La audición es la vía principal a través de la cual se desarrolla el lenguaje y el habla. Un trastorno en la percepción auditiva, en una edad temprana, conlleva un desarrollo lingüístico y comunicativo problemático, con dificultades para la comprensión lectora y la comprensión de determinadas construcciones sintácticas. P á g i n a 3 | 21 IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez Cognitiva Las habilidades cognitivas son las siguientes: Observación: Todo aquello relacionado con la atención, concentración, búsqueda e identificación de datos, elementos u objetos. Análisis: Todo aquello relacionado con las habilidades para hacer comparaciones, distinciones con la finalidad de distinguir y destacar los elementos básicos de información. Ordenación: Todo aquello relacionado con la agrupación, reunión y serialización que permite, a partir de un atributo determinado, disponer un conjunto de datos de forma sistemática. Clasificación: Todo aquello relacionado con la categorización, esquematización, jerarquización de un conjunto de datos. Representación: Todo aquello relacionado con la modelización, reproducción o simulación como medio de recreación de nuevos hechos o situaciones a partir de los existentes. Memorización: Todo aquello relacionado con la retención, conservación, evocación, almacenamiento y recuperación de datos. Interpretación: Todo aquello relacionado con la argumentación, la deducción y el razonamiento que nos permite aportar un significado personal a la información. Evaluación: Todo aquello relacionado con la estimación, la crítica y el juicio que nos permite realizar valoraciones sobre los datos. P á g i n a 4 | 21 IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez 3. Tecnología asistencial La tecnología asistencial es el conjunto de equipos, dispositivos, instrumentos o programas empleados con la finalidad de mejorar la calidad de vida de aquellas personas que tienen algún tipo de discapacidad incrementando así su autonomía. En el campo de la informática nos podemos encontrar: Dispositivos de entrada Dispositivos de salida Dispositivos de entrada Teclado virtual: es un teclado que se muestra en pantalla y que permite escribir textos eligiendo los caracteres con el ratón. Teclado braille: es un teclado adaptado para personas ciegas. Teclado alternativo: Son teclados adaptados a las distintas necesidades. Las adaptaciones realizadas pueden ser: un aumento del tamaño físico de las teclas o del espacio entre las teclas… Estos teclados pueden tener una retroalimentación auditiva, indicando mediante el sonido cuál es la tecla pulsada. Software de reconocimiento de voz: Empleado para poder introducir datos o ejecutar comandos en el ordenador a aquellas personas que no pueden hacer uso del teclado ni del ratón. Apuntadores: (también llamados licornios): Están pensados para aquellas personas que no tienen movilidad en las extremidades, pero sí en la cabeza. Es un casco que lleva incorporada una varilla larga acoplada en la frente o en la barbilla y que es empleada para realizar pulsaciones en el teclado. P á g i n a 5 | 21 IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez El que tiene mi padre Trackball gigante: Es un ratón que no necesita desplazarse. Tiene una bola de gran tamaño situada por encima del ratón que se mueve en cualquier dirección y unos botones de gran tamaño facilitando, de esta forma, su uso por las personas con discapacidad motriz. Webcams para seguimiento de ojos o cara: Estas webcams están preparadas para transformar el movimiento de los ojos o la cara en movimientos del puntero del ratón en la pantalla simulando las pulsaciones del ratón con un parpadeo o con un gesto concreto de la cara. Dispositivos de salida Lectores de pantalla: Son programas especialmente útiles para las personas con ceguera o con una discapacidad visual muy grande ya que permiten hacer una lectura de lo que se muestra por pantalla mediante un sintetizador de voz. Ampliadores de pantalla: Son programas especialmente útiles en las personas con baja visión ya que permiten ampliar el texto y las imágenes mostrados en el monitor. En este apartado tenemos como ejemplo la lupa que suministran algunos sistemas operativos. Líneas Braille: Están compuestas por una serie de celdas con 6 u 8 puntos cada una que muestran de forma táctil la misma información que leería un lector de pantalla. Son útiles para las personas ciegas y, sobre todo, para las sordo-ciegas que no se pueden beneficiar de los lectores de pantalla ni de los ampliadores de pantalla Navegadores para ciegos: Son capaces de leer las páginas web en voz alta y los usuarios podrán navegar a través de su voz haciendo uso de una serie de comandos especiales. Ej web: https://www.roquetasdemar.es/ 4. El consocio W3C Es una comunicad internacional que desarrolla estándares que aseguran el crecimiento de la web a largo plazo. Fue fundada en 1994 y su misión es desarrollar tecnologías interoperables (especificaciones, líneas maestras, software y herramientas) para guiar la Web hacia su máximo potencial. Está formado por empresas y organismos de diferentes países y sectores profesionales entre los cuales figuran algunos ayuntamientos y universidades españolas. W3C tiene presentes las siguientes líneas de actuación: Trabajar y potenciar la web para todos. Facilitar el acceso a la web independientemente del dispositivo que se utilice y la forma de interactuar. Defender la calidad y confianza en los contenidos de las webs. Contribuir a la evolución de la web (web 2.0, web 3.0 y web 4.0). P á g i n a 6 | 21 IES Al-Ándalus | DAW-DIW | Isabel Cayuela Pérez 5. Principios generales de diseño accesible y pautas de accesibilidad para el contenido en la web Principios - En el nivel más alto se sitúan los cuatro principios que proporcionan los fundamentos de la accesibilidad web: perceptible, operable, comprensible y robusto. Pautas - Por debajo de los principios están las pautas. Las doce pautas proporcionan los objetivos básicos que los autores deben lograr con el fin de crear un contenido más accesible para los usuarios con distintas discapacidades. Estas pautas no son verificables, pero proporcionan el marco y los objetivos generales que ayudan a los autores a comprender los criterios de conformidad y a implementar mejor las técnicas. 1. Principio 1: Perceptible: la información y los componentes de la interfaz de usuario deben ser mostrados a los usuarios en formas que ellos puedan entender. Pauta 1.1: Texto alternativo: Proporciona texto alternativo para el contenido que no sea textual, así podrá ser transformado en otros formatos que la gente necesite, como caracteres grandes, lenguaje braille (braile no es correcto), lenguaje oral, símbolos o lenguaje más simple. Pauta 1.2: Contenido multimedia dependiente del tiempo: Proporcione alternativas sincronizadas para contenidos multimedia sincronizados dependientes del tiempo. Pauta 1.3: Adaptable: Crear contenido que pueda ser presentado de diferentes formas sin perder ni información ni estructura. Pauta 1.4: Distinguible: Facilitar a los usuarios ver y escuchar el contenido incluyendo la distinción entre lo más y menos importante. 2. Principio 2: Operable: Los componentes de la interfaz de usuario y la navegación debe ser manejable. Pauta 2.1: Teclado accesible: Poder controlar todas las funciones desde el teclado. Pauta 2.2 Tiempo suficiente: Proporciona tiempo suficiente a los usuarios para leer y utilizar el contenido. Pauta 2.3: Ataques epilépticos: No diseñar contenido que pueda causar ataques epilépticos. Pauta 2.4: Navegación: Proporciona formas para ayudar a los usuarios a navegar, a buscar contenido y a determinar dónde están estos. o (Nuevo) Pauta 2.5: Modalidades de entrada: Facilitar a los usuarios operar la funcionalidad a través de varios métodos de entrada además del teclado. 3. Principio 3: Comprensible. La información y las operaciones de usuarios deben ser comprensibles. o Pauta 3.1: Legible. Hacer contenido de texto legible y comprensible. o Pauta 3.2 Previsible: Hacer la apariencia y la forma de utilizar las páginas web previsibles. o Pauta 3.3 Asistencia a la entrada de datos: los usuarios de ayuda evitarán y corregirán errores. P á g i n a 7 | 21 4. Principio 4: Robustez: el contenido deber ser suficientemente robusto para que pueda ser bien interpretado por una gran variedad de agentes de usuario, incluyendo tecnologías de asistencia. Pauta 4.1 Compatible: Maximiza la compatibilidad con los agentes de usuario actuales y futuros, incluyendo tecnologías de asistencia. 6. Prioridades. Puntos de verificación. Niveles de adecuación Para cada pauta se proporcionan los criterios de éxito verificables que permiten emplear las WCAG 2.1 en aquellas situaciones en las que existan requisitos y necesidad de evaluación de conformidad como: especificaciones de diseño, compras, regulación o acuerdos contractuales. Con el fin de cumplir con las necesidades de los diferentes grupos y situaciones, se definen tres niveles de conformidad: A (el más bajo), AA y AAA (el más alto). WCAG 2.1 Nivel A: Para lograr conformidad con el nivel A, la página web satisface todos los criterios de éxito del nivel A, o proporciona una versión alternativa conforme al nivel A. WCAG 2.1 Nivel AA: Para lograr conformidad con el nivel AA, la página web satisface todos los criterios de éxito de los niveles A y AA, o se proporciona una versión alternativa conforme al nivel AA. WCAG 2.1 Nivel AAA: Para lograr conformidad con el nivel AAA, la página web satisface todos los criterios de éxito de los niveles A, AA y AAA, o proporciona una versión alternativa conforme al nivel AAA. 7. Criterios de conformidad (WCAG 2.0) Dentro de cada pauta se recoge un conjunto de criterios de conformidad (en inglés, Success Criteria), redactados en forma de enunciados verificables sobre el contenido web, y que pueden usarse para comprobar la conformidad de los contenidos ya existentes con respecto a WCAG 2.0, o para desarrollar nuevos contenidos de forma accesible y conforme a las pautas. Para atender a las necesidades de los distintos grupos de usuarios y circunstancias, cada uno de los criterios de conformidad está asociado a un nivel de conformidad que define el nivel de exigencia del criterio. Los niveles de conformidad son: A (el menos exigente), AA y AAA (el más exigente). Las siguientes listas se pueden emplear a modo de lista de verificación de WCAG 2.0 (WCAG 2.0 checklist): Criterios de conformidad de nivel A (25 criterios) Criterios de conformidad de nivel AA (13 criterios) Criterios de conformidad de nivel AAA (23 criterios) P á g i n a 8 | 21 Criterios de conformidad de nivel A Son 25 criterios: 1.1.1 Contenido no textual Todo contenido no textual que se presenta al usuario tiene una alternativa textual que cumple el mismo propósito, excepto en las situaciones enumeradas a continuación. 1.2.1 Sólo audio y sólo vídeo (grabado) Para contenido sólo audio grabado y contenido sólo vídeo grabado, se cumple lo siguiente, excepto cuando el audio o el vídeo es un contenido multimedia alternativo al texto y está claramente identificado como tal: Sólo audio grabado: Se proporciona una alternativa para los medios tempodependientes que presenta información equivalente para el contenido sólo audio grabado. Sólo vídeo grabado: Se proporciona una alternativa para los medios tempodependientes o se proporciona una pista sonora que presenta información equivalente al contenido del medio de sólo vídeo grabado. 1.2.2 Subtítulos (grabados) Se proporcionan subtítulos para el contenido de audio grabado dentro de contenido multimedia sincronizado, excepto cuando la presentación es un contenido multimedia alternativo al texto y está claramente identificado como tal. 1.2.3 Audiodescripción o Medio Alternativo (grabado) Se proporciona una alternativa para los medios tempodependientes o una audiodescripción para el contenido de vídeo grabado en los multimedia sincronizados, excepto cuando ese contenido es un contenido multimedia alternativo al texto y está claramente identificado como tal. 1.3.1 Información y relaciones La información, estructura y relaciones comunicadas a través de la presentación pueden ser determinadas por software o están disponibles como texto. 1.3.2 Secuencia significativa Cuando la secuencia en que se presenta el contenido afecta a su significado, se puede determinar por software la secuencia correcta de lectura. 1.3.3 Características sensoriales Las instrucciones proporcionadas para entender y operar el contenido no dependen exclusivamente en las características sensoriales de los componentes como su forma, tamaño, ubicación visual, orientación o sonido. 1.4.1 Uso del color El color no se usa como único medio visual para transmitir la información, indicar una acción, solicitar una respuesta o distinguir un elemento visual. P á g i n a 9 | 21 1.4.2 Control del audio Si el audio de una página web suena automáticamente durante más de 3 segundos, se proporciona ya sea un mecanismo para pausar o detener el audio, o un mecanismo para controlar el volumen del sonido que es independiente del nivel de volumen global del sistema. 2.1.1 Teclado 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. 2.1.2 Sin trampas para el foco del teclado Si es posible mover el foco a un componente de la página usando una interfaz de teclado, entonces el foco se puede quitar de ese componente usando sólo la interfaz de teclado y, si se requiere algo más que las teclas de dirección o de tabulación, se informa al usuario el método apropiado para mover el foco. 2.2.1 Tiempo ajustable Para cada límite de tiempo impuesto por el contenido, se cumple al menos uno de los siguientes casos: Apagar: El usuario puede detener el límite de tiempo antes de alcanzar el límite de tiempo; o Ajustar: El usuario puede ajustar el límite de tiempo antes de alcanzar dicho límite en un rango amplio que es, al menos, diez veces mayor al tiempo fijado originalmente; o Extender: Se advierte al usuario antes de que el tiempo expire y se le conceden al menos 20 segundos para extender el límite temporal con una acción simple (por ejemplo, "presione la barra de espacio") y el usuario puede extender ese límite de tiempo al menos diez veces; o Excepción de tiempo real: El límite de tiempo es un requisito que forma parte de un evento en tiempo real (por ejemplo, una subasta) y no resulta posible ofrecer una alternativa al límite de tiempo; o Excepción por ser esencial: El límite de tiempo es esencial y, si se extendiera, invalidaría la actividad; o Excepción de 20 horas: El límite de tiempo es mayor a 20 horas. 2.2.2 Poner en pausa, detener, ocultar Para la información que tiene movimiento, parpadeo, se desplaza o se actualiza automáticamente, se cumplen todos los casos siguientes: Movimiento, parpadeo, desplazamiento: Para toda información que se mueve, parpadea o se desplaza, que (1) comienza automáticamente, (2) dura más de cinco segundos y (3) se presenta en paralelo con otro contenido, existe un mecanismo para que el usuario la pueda poner en pausa, detener u ocultar, a menos que el movimiento, parpadeo o desplazamiento sea parte esencial de una actividad; y P á g i n a 10 | 21 Actualización automática: Para toda información que se actualiza automáticamente, que (1) se inicia automáticamente y (2) se presenta en paralelo con otro contenido, existe un mecanismo para que el usuario la pueda poner en pausa, detener u ocultar, controlar la frecuencia de actualización a menos que la actualización automática sea parte esencial de una actividad. 2.3.1 Umbral de tres destellos o menos Las páginas web no contienen nada que destelle más de tres veces en un segundo, o el destello está por debajo del umbral de destello general y de destello rojo. 2.4.1 Evitar bloques Existe un mecanismo para evitar los bloques de contenido que se repiten en múltiples páginas web. 2.4.2 Titulado de páginas Las páginas web tienen títulos que describen su temática o propósito. 2.4.3 Orden del foco Si se puede navegar secuencialmente por una página web y la secuencia de navegación afecta su significado o su operación, los componentes que pueden recibir el foco lo hacen en un orden que preserva su significado y operatividad. 2.4.4 Propósito de los enlaces (en contexto) El propósito de cada enlace puede ser determinado con sólo el texto del enlace o a través del texto del enlace sumado al contexto del enlace determinado por software, excepto cuando el propósito del enlace resultara ambiguo para los usuarios en general. 3.1.1 Idioma de la página El idioma predeterminado de cada página web puede ser determinado por software. 3.2.1 Al recibir el foco Cuando cualquier componente recibe el foco, no inicia ningún cambio en el contexto. 3.2.2 Al recibir entradas El cambio de estado en cualquier componente de la interfaz de usuario no provoca automáticamente un cambio en el contexto a menos que el usuario haya sido advertido de ese comportamiento antes de usar el componente. 3.3.1 Identificación de errores Si se detecta automáticamente un error en la entrada de datos, el elemento erróneo es identificado y el error se describe al usuario mediante un texto. 3.3.2 Etiquetas o instrucciones Se proporcionan etiquetas o instrucciones cuando el contenido requiere la introducción de datos por parte del usuario. P á g i n a 11 | 21 4.1.1 Procesamiento En los contenidos implementados mediante el uso de lenguajes de marcas, los elementos tienen las etiquetas de apertura y cierre completas; los elementos están anidados de acuerdo a sus especificaciones; los elementos no contienen atributos duplicados y los ID son únicos, excepto cuando las especificaciones permitan estas características. 4.1.2 Nombre, función, valor Para todos los componentes de la interfaz de usuario (incluyendo pero no limitado a: elementos de formulario, enlaces y componentes generados por scripts), el nombre y la función pueden ser determinados por software; los estados, propiedades y valores que pueden ser asignados por el usuario pueden ser especificados por software; y los cambios en estos elementos se encuentran disponibles para su consulta por las aplicaciones de usuario, incluyendo las ayudas técnicas. Criterios de conformidad de nivel AA Son 13 criterios: 1.2.4 Subtítulos (en directo) Se proporcionan subtítulos para todo el contenido de audio en directo de los multimedia sincronizados. 1.2.5 Audiodescripción (grabado) Se proporciona una audiodescripción para todo el contenido de vídeo grabado dentro de contenido multimedia sincronizado. 1.4.3 Contraste (mínimo) La presentación visual de texto e imágenes de texto tiene una relación de contraste de, al menos, 4.5:1, excepto en los siguientes casos: Textos grandes: Los textos de gran tamaño y las imágenes de texto de gran tamaño tienen una relación de contraste de, al menos, 3:1. Incidental: Los textos o imágenes de texto que forman parte de un componente inactivo de la interfaz de usuario, que son simple decoración, que no resultan visibles para nadie o forman parte de una imagen que contiene otros elementos visuales significativos, no tienen requisitos de contraste. Logotipos: El texto que forma parte de un logo o nombre de marca no tiene requisitos de contraste mínimo. 1.4.4 Cambio de tamaño del texto A excepción de los subtítulos y las imágenes de texto, todo el texto puede ser ajustado sin ayudas técnicas hasta un 200 por ciento sin que se pierdan el contenido o la funcionalidad. 1.4.5 Imágenes de texto Si con las tecnologías que se están utilizando se puede conseguir la presentación visual deseada, se utiliza texto para transmitir la información en vez de imágenes de texto, excepto en los siguientes P á g i n a 12 | 21 casos: Configurable: La imagen de texto es visualmente configurable según los requisitos del usuario. Esencial: Una forma particular de presentación del texto resulta esencial para la información que se transmite. 2.4.5 Múltiples vías Se proporciona más de un camino para localizar una página web dentro de un conjunto de páginas web, excepto cuando la página es el resultado, o un paso intermedio, de un proceso. 2.4.6 Encabezados y etiquetas Los encabezados y etiquetas describen el tema o propósito. 2.4.7 Foco visible Cualquier interfaz de usuario operable por teclado tiene una forma de operar en la cuál el indicador del foco del teclado resulta visible. 3.1.2 Idioma de las partes El idioma de cada pasaje o frase en el contenido puede ser determinado por software, excepto los nombres propios, términos técnicos, palabras en un idioma indeterminado y palabras o frases que se hayan convertido en parte natural del texto que las rodea. 3.2.3 Navegación coherente Los mecanismos de navegación que se repiten en múltiples páginas web dentro de un conjunto de páginas web aparecen siempre en el mismo orden relativo cada vez que se repiten, a menos que el cambio sea provocado por el propio usuario. 3.2.4 Identificación coherente Los componentes que tienen la misma funcionalidad dentro de un conjunto de páginas web son identificados de manera coherente. 3.3.3 Sugerencias ante errores Si se detecta automáticamente un error en la entrada de datos y se dispone de sugerencias para hacer la corrección, entonces se presentan las sugerencias al usuario, a menos que esto ponga en riesgo la seguridad o el propósito del contenido. 3.3.4 Prevención de errores (legales, financieros, datos) Para las páginas web que representan para el usuario compromisos legales o transacciones financieras; que modifican o eliminan datos controlables por el usuario en sistemas de almacenamiento de datos; o que envían las respuestas del usuario a una prueba, se cumple al menos uno de los siguientes casos: Reversible: El envío es reversible. P á g i n a 13 | 21 Revisado: Se verifica la información para detectar errores en la entrada de datos y se proporciona al usuario una oportunidad de corregirlos. Confirmado: Se proporciona un mecanismo para revisar, confirmar y corregir la información antes de finalizar el envío de los datos. Criterios de conformidad de nivel AAA Son 23 criterios: 1.2.6 Lengua de señas (grabado) Se proporciona una interpretación en lengua de señas para todo el contenido de audio grabado dentro de contenido multimedia sincronizado. 1.2.7 Audiodescripción ampliada (grabada) Cuando las pausas en el audio de primer plano son insuficientes para permitir que la audiodescripción comunique el significado del vídeo, se proporciona una audiodescripción ampliada para todos los contenidos de vídeo grabado dentro de contenido multimedia sincronizado. 1.2.8 Medio alternativo (grabado) Se proporciona una alternativa para los medios tempodependientes, tanto para todos los contenidos multimedia sincronizados grabados como para todos los medios de sólo vídeo grabado. 1.2.9 Sólo audio (en directo) Se proporciona una alternativa para los medios tempodependientes que presenta información equivalente para el contenido de sólo audio en directo. 1.4.6 Contraste (mejorado) La presentación visual de texto e imágenes de texto tiene una relación de contraste de, al menos, 7:1, excepto en los siguientes casos: Textos grandes: Los textos de gran tamaño y las imágenes de texto de gran tamaño tienen una relación de contraste de, al menos, 4.5:1. Incidental: Los textos o imágenes de texto que forman parte de un componente de la interfaz de usuario inactivo, que son simple decoración, que no resultan visibles para nadie o forman parte de una imagen que contiene otros elementos visuales significativos, no tienen requisitos de contraste. Logotipos: El texto que forma parte de un logo o nombre de marca no tiene requisitos de contraste mínimo. 1.4.7 Sonido de fondo bajo o ausente Para el contenido de sólo audio grabado que (1) contiene habla en primer plano, (2) no es un CAPTCHA sonoro o un audiologo, y (3) que no es una vocalización cuya intención principal es servir como expresión musical (como el canto o el rap), se cumple al menos uno de los siguientes casos: Ningún sonido de fondo: El audio no contiene sonidos de fondo. Apagar: Los sonidos de fondo pueden ser apagados. P á g i n a 14 | 21 20 dB: Los sonidos de fondo son, al menos, 20 decibelios más bajos que el discurso en primer plano, con la excepción de sonidos ocasionales que duran solamente uno o dos segundos. 1.4.8 Presentación visual En la presentación visual de bloques de texto, se proporciona algún mecanismo para lograr lo siguiente: Los colores de fondo y primer plano pueden ser elegidos por el usuario. El ancho no es mayor de 80 caracteres o signos (40 si es CJK). El texto no está justificado (alineado a los márgenes izquierdo y derecho a la vez). El espacio entre líneas (interlineado) es de, al menos, un espacio y medio dentro de los párrafos y el espacio entre párrafos es, al menos, 1.5 veces mayor que el espacio entre líneas. El texto se ajusta sin ayudas técnicas hasta un 200 por ciento de modo tal que no requiere un desplazamiento horizontal para leer una línea de texto en una ventana a pantalla completa. 1.4.9 Imágenes de texto (sin excepciones) Las imágenes de texto sólo se utilizan como simple decoración o cuando una forma de presentación particular del texto resulta esencial para la información transmitida. 2.1.3 Teclado (sin excepciones) Toda la funcionalidad del contenido se puede operar a través de una interfaz de teclado sin requerir una determinada velocidad en la pulsación de las teclas. 2.2.3 Sin tiempo El tiempo no es parte esencial del evento o actividad presentada por el contenido, exceptuando los multimedia sincronizados no interactivos y los eventos en tiempo real. 2.2.4 Interrupciones El usuario puede postergar o suprimir las interrupciones, excepto cuando las interrupciones implican una emergencia. 2.2.5 Re-autentificación Cuando expira una sesión autentificada, el usuario puede continuar la actividad sin pérdida de datos tras volver a identificarse. 2.3.2 Tres destellos Las páginas web no contienen nada que destelle más de tres veces por segundo. 2.4.8 Ubicación Se proporciona información acerca de la ubicación del usuario dentro de un conjunto de páginas web. P á g i n a 15 | 21 2.4.9 Propósito de los enlaces (sólo enlaces) Se proporciona un mecanismo que permite identificar el propósito de cada enlace con sólo el texto del enlace, excepto cuando el propósito del enlace resultara ambiguo para los usuarios en general. 2.4.10 Encabezados de sección Se usan encabezados de sección para organizar el contenido. 3.1.3 Palabras inusuales Se proporciona un mecanismo para identificar las definiciones específicas de palabras o frases usadas de modo inusual o restringido, incluyendo expresiones idiomáticas y jerga. 3.1.4 Abreviaturas Se proporciona un mecanismo para identificar la forma expandida o el significado de las abreviaturas. 3.1.5 Nivel de lectura Cuando un texto requiere un nivel de lectura más avanzado que el nivel mínimo de educación secundaria una vez que se han eliminado nombres propios y títulos, se proporciona un contenido suplementario o una versión que no requiere un nivel de lectura mayor a ese nivel educativo. 3.1.6 Pronunciación Se proporciona un mecanismo para identificar la pronunciación específica de las palabras cuando el significado de esas palabras, dentro del contexto, resulta ambiguo si no se conoce su pronunciación. 3.2.5 Cambios a petición Los cambios en el contexto son iniciados únicamente a solicitud del usuario o se proporciona un mecanismo para detener tales cambios. 3.3.5 Ayuda Se proporciona ayuda dependiente del contexto. 3.3.6 Prevención de errores (todos) Para las páginas web que requieren al usuario el envío de información, se cumple al menos uno de los siguientes casos: Reversible: El envío es reversible. Revisado: Se verifica la información para detectar errores en la entrada de datos y se proporciona al usuario una oportunidad de corregirlos. Confirmado: Se proporciona un mecanismo para revisar, confirmar y corregir la información antes de finalizar el envío de los datos. P á g i n a 16 | 21 8. Criterios de conformidad WCAG 2.1 Las WCAG 2.1 introduce 17 nuevos criterios de conformidad, 12 de los cuales tienen un nivel de conformidad A o AA. Estos son: Pauta 1.3 Adaptable: 1.3.4 Orientación (AA) 1.3.5 Identificar el Propósito de la Entrada (AA) 1.3.6 Identificar el Propósito (AAA) Pauta 1.4 Distinguible: 1.4.10 Reflujo (AA) 1.4.11 Contraste sin texto (AA) 1.4.12 Espaciado de texto (AA) 1.4.13 Contenido en el cursor o foco (AA) Pauta 2.1 Teclado Accesible: 2.1.4 Atajos de teclas de caracteres (A) Pauta 2.2 Tiempo Suficiente: 2.2.6 Tiempos de espera (AAA) Pauta 2.3 Convulsiones y reacciones físicas: 2.3.3 Animación de las Interacciones (AAA) Pauta 2.5 Modalidades de entrada: 2.5.1 Gestos del puntero (A) 2.5.2 Cancelación del puntero (A) 2.5.3 Etiqueta en Nombre (A) 2.5.4 Accionamiento de movimiento (A) 2.5.5 Tamaño objetivo (AAA) 2.5.6 Mecanismos de entrada simultáneos (AAA) Pauta 4.1 Compatible: 4.1.3 Mensajes de estado (AA) Los nuevos criterios de conformidad se incluyen entre las Pautas ya existentes excepto para la pauta 2.5 “Modalidades de entrada”, la cual es una nueva pauta introducida en las WCAG 2.1. Está dedicada específicamente a facilitar la interacción a través de diferentes dispositivos de entrada más allá de la interacción mediante teclado, especialmente desde dispositivos móviles. Ver Guía rápida de aplicación WCAG 2.1 P á g i n a 17 | 21 9. HTML5 y accesibilidad Una de las problemáticas de accesibilidad en la web surgió con la llegada de Ajax, momento en el que los desarrolladores se “animaron” a usar esta tecnología motivados por sus posibilidades para la actualización dinámica de contenido y la creación de diferentes controles a medida (widgets). Imaginemos, por ejemplo, el caso de un control avanzado como un slider. Un lector de pantalla no será capaz de dar respuesta a las siguientes preguntas: Identificar el rol del elemento: ¿qué es? Conocer su estado y propiedades: ¿cómo se encuentra? Capturar su comportamiento: ¿qué hace? ARIA ARIA viene a responder a las anteriores preguntas y otras cuestiones proporcionando un marco de trabajo complementario. 1. 2. 3. 4. Estructuras más semánticas para las zonas funcionales. Mejora de la navegación mediante el teclado. Controles complejos (widgets) más accesibles. Accesibilidad para el contenido actualizado de forma dinámica. ARIA permite a los desarrolladores describir sus widgets con más detalle al agregar atributos especiales al marcado. Diseñado para llenar el vacío entre las etiquetas HTML estándar y los controles de estilo de escritorio que se encuentran en las aplicaciones web dinámicas, ARIA proporciona roles y estados que describen el comportamiento de los widgets de IU más familiares. La especificación ARIA se divide en tres tipos diferentes de atributos: roles, estados y propiedades. Los roles describen widgets que de otro modo no están disponibles en HTML, como controles deslizantes, barras de menú, pestañas y cuadros de diálogo. Las propiedades describen características de estos widgets, como si son arrastrables, tienen un elemento requerido o tienen una ventana emergente asociada a ellos. Los estados describen el estado actual de interacción de un elemento, informando a la tecnología de asistencia si está ocupada, deshabilitada, seleccionada u oculta. Roles: su misión es definir el papel que juegan los elementos dentro del documento web. Estados y propiedades: determinan las características y los valores de cada elementos. El navegador interpreta automáticamente los atributos ARIA y los traduce a las API de accesibilidad nativas del sistema operativo. Por lo tanto, un elemento con role = "slider" se controlará de la misma manera que un control deslizante nativo se controla en el sistema operativo. Esto proporciona una experiencia de usuario mucho más consistente de lo que era posible en la P á g i n a 18 | 21 generación anterior de aplicaciones web, ya que los usuarios de tecnología de asistencia pueden aplicar todo su conocimiento sobre cómo funcionan las aplicaciones de escritorio cuando usan aplicaciones basadas en la web. Por tanto, podemos intuir que ARIA no funciona como una tecnología restrictiva o exclusiva, sino que se trata de un complemento con el que podemos hacer accesibles las aplicaciones web enriquecidas. “Los atributos especiales ARIA (Accesible Rich Internet Application) son atributos que se añade a las etiquetas HTML para que éstas sean entendidas mejor por los lectores que usan aquellas personas con alguna discapacidad.” ALGUNAS REGLAS GENERALES role (alert,tab,document, navigation...) aria-owns (expresa relación jerárquica mediante el id de otro elemento) aria-hidden (oculta partes innecesarias) aria-live aria-checked aria-label aria-disabled aria-valuenow, aria-valuemax, aria-valuemin ooo Roles ARIA role=”banner” – para el elemento header role=”navigation” – para el elemento nav role=”main” – zona principal role=”application” – declara una zona como aplicación web frente a un documento web role=”article” – para el elemento article role=”complementary” – para aside role=”contentinfo” – para footer role=”form” – para formularios role=”search” – para búsquedas P á g i n a 19 | 21 https://developers.google.com/web/fundamentals/accessibility/semantics-aria?hl=es https://www.w3.org/TR/wai-aria/ https://www.w3.org/TR/wai-aria-practices/ https://w3c.github.io/using-aria/ https://developer.mozilla.org/es/docs/Web/Accessibility/ARIA https://web.ua.es/accesibilidad/accesibilidad-web/wai-aria.html 10. Herramientas de análisis de accesibilidad web https://www.tawdis.net/ https://www.powermapper.com/products/ https://wave.webaim.org/ https://squizlabs.github.io/HTML_CodeSniffer/ https://siteimprove.com/es-es/accessibility/ P á g i n a 20 | 21 11. Autoría del documento Este manual es una recopilación de documentos adaptados por la profesora Isabel Cayuela Pérez. P á g i n a 21 | 21