introducción a la accesibilidad web

ACCESIBILIDAD

Breve resumen de los principales elementos de accesibilidad web.

ACCESIBILIDAD_

Posibilidad de que un sitio o servicio Web pueda ser visitado y utilizado de forma satisfactoria por el mayor número posible de personas, independientemente de las limitaciones personales que tengan o de aquellas limitaciones que sean derivadas de su entorno.

BENEFICIARIOS DE LA

ACCESIBILIDAD_Personas que presentan algún grado

discapacidad (físicas, sensoriales, cognitivas, etc.)

BENEFICIARIOS DE LA

ACCESIBILIDAD_• Usuarios de edad avanzada con dificultades

producidas por el envejecimiento. • Usuarios afectados por circunstancias

derivadas del entorno como baja iluminación, ambientes ruidosos, espacio reducido, etc.

• Usuarios con insuficiencia de medios que acceden a los servicios de Internet mediante equipos y conexiones con capacidades limitadas.

• Usuarios que no dominen el idioma, como aquellos de habla extranjera o con menor nivel cultural.

• Usuarios inexpertos o que presentan inseguridad frente a la utilización de diversos dispositivos electrónicos.

VENTAJAS DE LA

ACCESIBILIDAD_• Simplifica el desarrollo: separación de

contenido y presentación, uso de estándares, reutilización de los recursos, disminución de la carga de los servidores.

• Ahorra costes• Mejora la indexación en los buscadores• Facilita la independencia del dispositivo• Aumenta la Usabilidad• Mejora el acceso en general• Aumenta el público objetivo

REFERENCIA TÉCNICA_

"Pautas de Accesibilidad al Contenido en la Web" (WCAG)

http://www.discapnet.es/web_accesible/wcag10/WAI-WEBCONTENT-19990505_es.html

WCAG1_

http://www.w3.org/TR/WCAG10/

WCAG1_

• 5-Mayo-1999• tres niveles de prioridad:

– Prioridad 1: Todos los puntos de verificación que el desarrollador tiene que satisfacer; si no, algunos grupos de personas serán incapaces de acceder a la información de un sitio;

– Prioridad 2: El desarrollador debe satisfacerla; sin ello alguien encontrará muchas dificultades para acceder a la información;

– Prioridad 3: El desarrollador puede satisfacerla; de lo contrario, algunas personas hallarán dificultades para acceder a la información.

WCAG1_

• tres niveles de adecuación:

–A incluye los puntos de verificación de prioridad 1;

–AA incluye las prioridades 1 y 2;

–AAA incluye las prioridades 1, 2 y 3.

CARENCIAS DEL WCAG1_

• Demasiado interpretables: diferentes personas las pueden interpretar a su manera de formas muy distintas

• Limitadas a tecnologías W3C: WCAG 1.0 se basa en el supuesto de que HTML es la única tecnología con soporte para la accesibilidad

• No incluyen nuevos usos de tecnologías W3C existentes: por ejemplo, los nuevos usos de HTML+JavaScript en AJAX no se tratan.

• Rígidas: no se actualizaron con el paso del tiempo.

WCAG2_

http://www.w3.org/TR/WCAG20/

WCAG2_

• 11-Diciembre-2008• Cuatro principios:

– Perceptible

– Operable

– Comprensible

– Robusto

UNE 139803:2004_

http://www.inteco.es/Accesibilidad/difusion/Normativa/Descarga/DescargaUNE_139803

CONSTRUCCIÓN DE UN SITIO WEB ACCESIBLE_

Pasos: • Contenido y estructuración. Escribir y dotar

de estructura y sentido lógico a la información.

• Presentación y maquetación. Proporcionar estilo, apariencia y colocación a los elementos incluidos.

• Revisión. Comprobar la accesibilidad de cada página Web.

LAS 14 PAUTAS DEL WCAG1_

1. Proporcione alternativas equivalentes para el contenido visual y auditivo. 2. No se base sólo en el color. 3. Utilice marcadores y hojas de estilo y hágalo apropiadamente. 4. Identifique el idioma usado. 5. Cree tablas que se transformen correctamente. 6. Asegúrese de que las páginas que incorporen nuevas tecnologías se

transformen correctamente. 7. Asegure al usuario el control sobre los cambios de los contenidos tempo-

dependientes. 8. Asegure la accesibilidad directa de las interfaces incrustadas. 9. Diseñe para la independencia del dispositivo. 10.Utilice soluciones provisionales. 11.Utilice las tecnologías y pautas W3C. 12.Proporcione información de contexto y orientación. 13.Proporcione mecanismos claros de navegación. 14.Asegúrese de que los documentos sean claros y simples.

PAUTA 1 WCAG1_

Definición: Proporcione alternativas equivalentes para el contenido sonoro y visual.

• Los textos alternativos al contenido visual o auditivo benefician a personas ciegas y/o sordas y a aquellos usuarios que deciden anular la descarga de imágenes y/o sonidos (velocidad de acceso a Internet limitada).

• Los equivalentes no textuales, como pueden ser dibujos o vídeos, benefician a personas analfabetas o con dificultades en la lectura.

PAUTA 2 WCAG1_

Definición: No se base sólo en el color. • Los textos y gráficos deben comprenderse sin

necesidad de ver los colores. El cumplimiento de esta pauta beneficia a personas con dificultades para ver los colores y a usuarios que utilizan pantallas monocromáticas.

PAUTA 3 WCAG1_

Definición: Utilice marcadores y hojas de estilo y hágalo de forma apropiada.

• El control de la presentación de los contenidos se debe realizar con hojas de estilo en vez de con elementos y atributos de presentación. Con el uso de marcadores de presentación los usuarios que utilizan software especializado tendrán dificultades para entender la estructura de la página.

PAUTA 4 WCAG1_

Definición: Identifique el idioma utilizado.• Esta pauta implica usar marcadores que

faciliten la pronunciación o interpretación de texto abreviado o extranjero. Se debe indicar el idioma predominante en cada página y marcar aquellas expresiones que se encuentren en otra lengua.  De esta forma, los sintetizadores de voz son capaces de cambiar su pronunciación en función del idioma siempre y cuando se usen los marcadores apropiados.

PAUTA 5 WCAG1_

Definición: Crear tablas que se transformen correctamente.

• Las tablas sólo se utilizan para marcar información tabular (tablas de datos). El uso de tablas con otros fines crea dificultades para los usuarios que usan lectores de pantalla. De igual forma, las tablas mal estructuradas (por ejemplo, sin encabezados <th>) dificultan la lectura a usuarios que no pueden visualizar la información de forma global: ciegos con lectores de pantalla y/o dispositivos braille, deficientes visuales que utilizan magnificadores de pantalla o usuarios con dispositivos de pantalla pequeña.

PAUTA 6 WCAG1_

Definición: Asegúrese de que las páginas que incorporan nuevas tecnologías se transformen correctamente.

• Una página basada en tecnologías modernas tiene que ser accesible al desconectarla o al visualizarla con navegadores antiguos. El usuario puede desconectar las tecnologías más modernas para ganar en rapidez de descarga. Sin embargo, los contenidos deben permanecer accesibles.

PAUTA 7 WCAG1_

Definición: Asegure al usuario el control sobre los cambios de contenidos tempo-sensibles.

• El movimiento de los objetos o páginas, su parpadeo o actualización automática deben ser controlados por el usuario. Las personas con discapacidades cognitivas o visuales no pueden leer textos en movimiento. De forma similar, algunos discapacitados físicos no pueden interactuar con objetos móviles (limitaciones motrices).

PAUTA 8 WCAG1_

Definición: Asegure la accesibilidad directa de las interfaces de usuario incrustadas.

• Cuando un objeto incrustado (flash, applet)  tiene su "propia interfaz", ésta (al igual que la interfaz de su navegador) debe ser accesible. Si la interfaz del objeto incrustado no puede hacerse accesible, debe proporcionarse una solución alternativa accesible.

PAUTA 9 WCAG1_

Definición: Diseñe con independencia del dispositivo.

• Esta pauta significa que el usuario puede interactuar con la aplicación de usuario o el documento con un dispositivo de entrada (o salida) preferido - ratón, teclado, voz, puntero de cabeza (licornio) u otro. Si, por ejemplo, un control de formulario sólo puede ser activado con un ratón u otro dispositivo de apuntamiento, alguien que use la página sin verla, con entrada de voz, con teclado o quien utilice otro dispositivo de entrada que no sea de apuntamiento, no será capaz de utilizar el formulario.

PAUTA 10 WCAG1_

Definición: Utilice soluciones provisionales.• Las alternativas accesibles sólo son

imprescindibles hasta que los antiguos navegadores y las ayudas técnicas operen correctamente.

PAUTA 11 WCAG1_

Definición: Utilice las tecnologías y pautas del W3C.

• Cuando no se pueda usar una tecnología W3C o al usarla se obtengan materiales que no se transformen correctamente, se debe proporcionar una versión alternativa. Se recomiendan las tecnologías W3C por incluir características accesibles incorporadas, estar desarrolladas en un proceso abierto consensuado y porque se utilizan como base para crear  contenidos accesibles. 

PAUTA 12 WCAG1_

Definición: Proporcione información de contexto y orientación.

• Esta información ayuda al usuario a comprender páginas o elementos complejos. Se deben agrupar los elementos y ofrecer información contextual sobre la relación entre elementos. Esta acción es fundamental para discapacitados cognitivos y visuales.

PAUTA 13 WCAG1_

Definición: Proporcione mecanismos claros de navegación.

• Estos mecanismos facilitan a todos los usuarios la búsqueda de aquella información que necesitan (fundamental para discapacitados cognitivos y visuales). Ejemplos: mapa web, ayuda, barras de navegación, etc.

PAUTA 14 WCAG1_

Definición: Asegúrese de que los documentos sean claros y sencillos.

• La utilización de lenguaje claro y simple facilita la comunicación de información. El acceso a la información escrita puede ser difícil para discapacitados cognitivos o con dificultad de aprendizaje y para personas sordas o que hablan en una lengua extranjera. La comprensión de un documento también depende de la maquetación de la página y de los gráficos (que deben llevar un texto alternativo).

BUENAS PRÁCTICAS EN WEB MÓVIL_

Diseña para una Web única. Si diseñas el contenido teniendo en cuenta los diferentes dispositivos, reducirás costes, tu página será más flexible y satisfarás las necesidades de más personas.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Confía en los estándares Web. En un mercado tan fragmentado como el de dispositivos y navegadores, los estándares son la mejor garantía de Interoperabilidad.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Evita los riesgos conocidos. Un diseño bien planificación ayuda a reducir los problemas de usabilidad causados por pantallas y teclados pequeños, u otras funciones de los dispositivos móviles.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Sé prudente con las limitaciones de los dispositivos. Cuando elijas una tecnología Web concreta, ten en cuenta que los dispositivos móviles tienen funciones muy diversas.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Optimiza la navegación. La simplificación de la navegación y del uso del teclado son factores esenciales cuando se utilizan pantallas y teclados pequeños, y se tiene un ancho de banda limitado.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Comprueba gráficos y colores. Las imágenes, los colores y el estilo destacan el contenido, pero hay dispositivos con pantallas de bajo contraste o problemas de compatibilidad con algunos formatos.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Hazlo pequeño. Un sitio Web de tamaño reducido supondrá un ahorro de tiempo y dinero para los usuarios.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Economiza el uso de la red. Las funciones de los protocolos Web pueden mejorar la experiencia del usuario al reducir los retrasos y los tiempos de espera en la red.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Facilita la entrada de datos. En los dispositivos móviles, los teclados y demás métodos de introducción de datos pueden ser tediosos para el usuario. Un diseño eficaz minimiza su uso.

BUENAS PRÁCTICAS EN WEB MÓVIL_

Piensa en los usuarios de la Web móvil. Los usuarios de la Web móvil necesitan información sintetizada al disponer de poco tiempo y existir distracciones externas.

MUCHAS GRACIAS_

Luisangel Mendaña del Río

@lugarzen

lugarzen

es.linkedin.es/in/luisangelmendana