PDF de programación - Diseño y creación de páginas web: Tema 7. Compatibilidad y accesibilidad de las páginas web

DISEÑO Y CREACIÓN DE PÁGINAS WEB

Tema 7. Compatibilidad y accesibilidad de las páginas web

Departamento de Sistemas Informáticos!

ETSI ICAI!

Rafael Palacios!
Cristina Puente!

•  Compatibilidad significa que la página puede

cargarse en cualquier navegador.
–  Internet Explorer, Firefox, Opera, Safari, PDA, movil…
–  Windows, Linux (unix), MacOS, Symbian, PalmOS, …

•  Accesibilidad está ligado con la posibilidad de ver

la página con facilidad y especialmente la
posibilidad de adaptarse a las condiciones del
usuario
–  Cerca del 10% de los hombres son daltónicos
–  Hay personas que necesitan utilizar letra muy grande en la

pantalla

–  Los ciegos utilizan sintetizadores de voz o lectores braille
–  Hay páginas que no se pueden leer en dispositivos de baja

resolución o de pocos colores

•  Es el aspecto más importante en programación

HTML, ya que HTML es un lenguaje pensado para
poder adaptarse al dispositivo y a las preferencias
del usuario

•  Garantizando accesibilidad normalmente

garantizamos compatibilidad

•  El principio básico es “respetar las preferencias del
usuario”. Sobre todo en cuanto a tamaño de letra y
resolución de pantalla

•  La Ley de Servicios de la Sociedad de la

Información y Comercio Electrónico, obliga a los
sitios web de las Administraciones Publicas a
garantizar la accesibilidad de sus contenidos a
todos los ciudadanos

•  WAI (Web Accessibility Initiative) de W3C:

http://www.w3.org/WAI/
ver WCAG 2.0 (Web Content Accessibility Guidelines)

•  Web and Software Accessibility Policies and

Guidelines (MIT):
http://web.mit.edu/atic/www/sw/

•  Comprobar el comportamiento dinámico

–  Cambiar el tamaño de la ventana.
–  Cambiar el tamaño de la letra del navegador.
–  Probar con distintos navegadores, móviles, etc…

•  Tamaños de texto y de objetos

–  Utilizar definiciones de tamaños relativos de texto del tipo “small”

o “0.7em”.

–  Definir los tamaños de los objetos relativo al tamaño de la

ventana. Ej. width="50%“.

•  Utilizaciones de colores

–  No mezclar colores de fondo y texto que tengan poco contraste.
–  Cuidado con los colores que los daltónicos diferencias mal.
–  Utilizar colores estándares (web-safe colors).
–  Probar a imprimir las páginas, o definir estilos distintos de

impresión.

•  Verificar que las páginas pasan los tests

•  Verificar la compatibilidad de las páginas HTML:

http://www.w3.org/

–  CSS Validator: http://jigsaw.w3.org/css-validator/
–  HTML Validator: http://validator.w3.org/

•  TAW (Test de Accesibilidad Web), Ministerio de

trabajo y asuntos sociales

http://www.tawdis.net/

•  Test de accesibilidad HERA, desarrollado por la

Fundación Sidar.

http://www.sidar.org/hera/