Calidad en Sitios Web Tercera Parte: Accesibilidad Lluís Codina UPF Noviembre 2007Lluís Codina. Calidad en Sitios Web-III

Calidad en Sitios WebTercera Parte: Accesibilidad

Lluís CodinaUPF

Noviembre 2007 Lluís Codina. Calidad en Sitios Web-III


WAI: Web Accessibility Initiative (1.0)

Proyecto del W3C: Strategies, guidelines, resources to make the

Web accessible to people with disabilities Web accessibility means that people with

disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web


Limitaciones/discapacidades:

Visuales Auditivas Motoras Cognitivas / Sociales / De entorno


Modelos /Antecedentes

Arquitectura: Edificios y ciudades accesibles: eliminación de

barreras de acceso Documentación:

El libro fácil: libros con tipografía y redacción adecuados a diversos niveles cognitivos. Libros “leídos”.

Multimedia: Films y programas de televisión para personas

sordas. Films “explicados” para invidentes.


Objetivos / Motivación:

Motivación egoísta > Incorporar a personas discapacitadas a la Red > Aumentar la audiencia

Motivación de equidad > Iguales oportunidades para personas discapacitadas

Motivación de eficiencia > Los discapacitados son la audiencia


Pragmatismo

Aproximación por Niveles de Adecuación: Prioridad 1: Sin cumplir este nivel, personas

discapacitadas no podrán acceder a las páginas Prioridades 2 y 3: Sin cumplir este nivel será muy

complicado (PN 2) o bien será difícil (PN 3) que personas discapacitadas puedan acceder a las páginas


¿Dónde están las barreras?

1. Código no estándar (W3C) y/o malas prácticas en la estructuración de los documentos

2. Ausencia de metadatos y de “alternativas equivalentes” en materiales audiovisuales


Código no estándar:

Uso de elementos y atributos depreciados en HTML y/o malas prácticas en la codificación de documentos. Ejemplos:

Uso de tablas para estructurar la página Uso de etiquetas semánticas para dar formato No separar el contenido de la presentación Ausencia de mapas del sitio Uso de medidas absolutas Usar color (únicamente) para transmitir información

Errores de codificación (código no validado)


Ausencia de metadatos:

Casos típicos: Etiqueta <title> en elemento <head> Atributos en etiquetas <img> y <table> Atributo “lang”

Un problema principal: Alternativas equivalentes en componentes

multimedia (longdesc)


10 ejemplos de las WCAG 1.0 (1/2)

3.2 Cree documentos que estén validados por las gramáticas formales publicadas. [Prioridad 2]

3.4 Utilice unidades relativas en lugar de absolutas al especificar los valores en los atributos de los marcadores de lenguaje y en los valores de las propiedades de las hojas de estilo. [Prioridad 2]

4.3 Identifique el idioma principal de un documento. [Prioridad 3]

13.3 Proporcione información sobre la estructura general de un sitio (por ejemplo, mapa del sitio o tabla de contenidos).[Prioridad2]

13.4 Utilice sistemas de navegación de forma coherente. [Prioridad 2]


10 ejemplos (2/2) 13.5 Proporcione barras de navegación para destacar y dar acceso a

los sistemas de navegación. [Prioridad 3]

13.7 Si proporciona funciones de búsqueda, permita diferentes tipos de búsquedas para diversos niveles de habilidad y preferencias. [Prioridad 3]

14.1 Utilice el lenguaje apropiado más claro y simple para el contenido de un sitio. [Prioridad 1]

14.2 Complemente el texto con presentaciones gráficas o auditivas cuando ello facilite la comprensión de la página. [Prioridad 3]

14.3 Cree un estilo de presentación que sea coherente en todas las páginas. [Prioridad 3]


Otra visión: The 10 Quick Tips

1. Images & animations: Use the alt attribute to describe the function of each visual.

2. Image maps. Use the client-side map and text for hotspots.3. Multimedia. Provide captioning and transcripts of audio, and descriptions of

video.4. Hypertext links. Use text that makes sense when read out of context. For

example, avoid "click here."5. Page organization. Use headings, lists, and consistent structure. Use CSS for

layout and style where possible.6. Graphs & charts. Summarize or use the longdesc attribute.7. Scripts, applets, & plug-ins. Provide alternative content in case active features

are inaccessible or unsupported.8. Frames. Use the noframes element and meaningful titles.9. Tables. Make line-by-line reading sensible. Summarize.10. Check your work. Validate. Use tools, checklist, and guidelines at

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


Ventajas de los contenidos accesibles

Incremento de audiencia (10-20%) Páginas compatibles con los próximos

navegadores Menores costes de mantenimiento Menores costes de servidor Sitios más coherentes y fáciles de navegar Incremento de la visibilidad (SEO) Sitios que cumplen con la ley


Desventajas

Costes entre moderados y altos en nuevas páginas, en algunos casos

Costes altos para transformar páginas preexistentes, en algunos casos


¿Cómo evaluar?

Conjunto de herramientas WAI: Recomendaciones WAI para autores

Recomendaciones WAI para desarrolladores de software

Guía de evaluación articuladas: Pautas y Puntos de verificación

Herramientas de evaluación en línea


Conclusiones (1)

Puntos fuertes: Coste cercano a cero en sitios o páginas nuevas Añade audiencia > incrementa el tráfico > mayor

rendimiento de la inversión Crea sitios más fáciles de mantener > menos costes Crea sitios compatibles con los navegadores del futuro >

menos costes Crea sitios que necesitan menos ancho de banda >

menos costes La accesibilidad reduce la brecha digital > beneficios

sociales Es la ley (“Is the law”)


Conclusiones (2):

Puntos débiles: Existe poco know-how Puede presentar costes altos transformar sitios

preexistentes y en algunos sitios nuevos Es difícil aplicar algunas pautas y hay poco

conocimiento sobre cómo hacerlo en otras A algunos productores de software no parece

importarles mucho La industria editorial le presta poca atención

Práctica 1

Comparar la página principal de tres sitios web de la Administración y aplicarles un test de accesibilidad con herramientas de validación automáticas.

Herramienta de validación recomendada para esta práctica:www.tawdis.net


Práctica 2 (Optativa)

Instalar un lector de pantalla (screen reader) y realizar tests de lectura con diversos sitios web.

Lector de pantalla recomendado para esta práctica: JAWS

www.freedomscientific.com


Documents

Calidad en Sitios Web Tercera Parte: Accesibilidad Lluís Codina UPF Noviembre 2007Lluís Codina. Calidad en Sitios Web-III