ADAPTAEMPLEO INFORME ACCESIBILIDAD. octubre Versión 1.0

Transcripción

1 ADAPTAEMPLEO INFORME ACCESIBILIDAD octubre 2013 Versión 1.0

2 1.0 Primera versión del documento. CONTROL DE CAMBIOS

3 Índice de Contenido 1. ACCESIBILIDAD WEB PUNTOS DE VERIFICACIÓN IMÁGENES Y MULTIMEDIA OBJETOS PROGRAMADOS TABLAS DE CONTENIDOS FORMULARIOS ATAJOS DE TECLADO ESTÁNDARES ESTRUCTURA Y PRESENTACIÓN HERRAMIENTAS DE EVALUACIÓN CONCLUSIONES de 11

4 1. ACCESIBILIDAD WEB La accesibilidad es la 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 sus propias limitaciones o de las derivadas de su entorno. Del mismo modo que existen barreras arquitectónicas, también existen barreras en la Web que impiden el acceso a la misma a las personas con discapacidad. La accesibilidad surge como una iniciativa dentro del World Wide Web Consorcium (W3C). El W3C, a través de su iniciativa WAI (Web Accessibility Iniciative), busca que los Sitios Web sean accesibles para todos. Grupo Iniciativas ha desarrollado la Plataforma Adaptaempleo siguiendo el nivel de adecuación AA. Ratón adaptado 4 de 11

5 2. PUNTOS DE VERIFICACIÓN A continuación detallaremos los principales puntos que pueden ser susceptibles de hacer de un sitio web no accesible a determinados usuarios y que han sido revisados en detalle por Grupo Iniciativas para la plataforma Adaptaempleo IMÁGENES Y MULTIMEDIA Todas las imágenes deben disponer de un equivalente textual que proporcione la misma información que dicha imagen. Adaptaempleo utiliza una colección de iconos expresamente desarrollados para simbolizar discapacidades y puestos de trabajo tipo, así como otros elementos gráficos utilizados en las distintas herramientas de las que dispone. Se han proporcionado descripciones a través del atributo ALT para cada una de las imágenes explicando claramente su función. Imagen con el contenido de su atributo alt Imágenes como botones de formularios o enlaces Este tipo de imágenes contienen también un texto alternativo que indica claramente su funcionalidad dentro de cada formulario formulario o enlace OBJETOS PROGRAMADOS Como contenido visual adicional, Adaptaempleo ofrece un vídeo informativo sobre la plataforma y su finalidad. Para su inserción en la plataforma se ha utilizado la etiqueta IFRAME, proporcionando un equivalente textual que describe su contenido en el interior de dicha etiqueta, de esta forma, solo será mostrado por los navegadores en el caso en el que el vídeo no pueda ser reproducido. 5 de 11

6 2.3. TABLAS DE CONTENIDOS El uso de tablas puede crear algunas dificultades para usuarios de lectores de pantalla, sin embargo cierta información proporcionada por la plataforma está organizada en tablas para facilitar así su comprensión y estructura. Todas las tablas presentadas cuentan con las pautas necesarias para asegurar su correcta comprensión por parte de todos los visitantes. A continuación detallamos las medidas tomadas para conseguir una mejor interpretación de las tablas de contenidos por parte de los lectores de pantalla: Identificación de encabezados de filas y columnas mediante el elemento TH. Si no identificamos los encabezamientos ni relacionamos los datos, los lectores de pantalla leen la tabla de forma lineal, haciendo muy difícil su interpretación. Identificación de los grupos de encabezamiento mediante el elemento THEAD. Identificación de grupos de filas de datos mediante el elemento TBODY. Asignación de título a la tabla mediante el atributo title. Estará disponible para todos los lectores de pantalla pero no se mostrará en los navegadores visuales. Estructura interna tabla de contenidos 6 de 11

7 2.4. FORMULARIOS El principal inconveniente en cuanto a la accesibilidad de los formularios web suele estar en su validación. Es aconsejable que esta se realice del lado del cliente para así minimizar el tráfico hacia el servidor, sin embargo estas validaciones son realizadas mediante código Javascript, no soportado por algunos navegadores. Los formularios desarrollados por Grupo Iniciativas para Adaptaempleo funcionan correctamente en caso de que el visitante tenga desactivado el código Javascript proporcionando una alternativa de validación del lado del servidor. Formulario con validación y atajos de teclado 2.5. ATAJOS DE TECLADO Uno de los principios básicos de la accesibilidad es el diseño independiente del dispositivo, permitiendo por ejemplo la navegación por teclado y no sólo con el ratón. El acceso por el teclado es el principal medio de interacción de las páginas accesibles, gran parte de las ayudas de usuario se basan en el uso del teclado. Con el fin de facilitar el acceso a los principales enlaces y controles de formulario, Adaptaempleo ofrece atajos de teclado. Se proporcionan mediante el atributo accesskey y constará de un único carácter con el que se asociará el control de formulario o en enlace en cada caso. La combinación de teclas para acceder a ellos depende del navegador y el dispositivo. En Adaptaempleo se informa de la existencia de los atajos de teclado mediante el subrayado de la letra correspondiente ESTÁNDARES Los estándares web son tecnologías establecidas por el W3C para crear una base común para el desarrollo web. El principal objetivo de estos estándares es el de 7 de 11

8 asegurar la máxima compatibilidad futura de los documentos así como su correcto funcionamiento para la mayoría de los usuarios, independientemente del navegador o dispositivo usado. Grupo Iniciativas ha utilizado para el desarrollo de la plataforma HTML5, DojoToolkit, CSS3, Zend Framework ESTRUCTURA Y PRESENTACIÓN Hojas de estilo Las hojas de estilo aumentan la accesibilidad de los documentos al separar la estructura de la presentación, reducen los tiempos de carga de las páginas, ayudan a conseguir un código fuente más compacto, proporcionan mayor facilidad para modificar los estilos de un sitio web y proporcionan una mayor compatibilidad con los diferentes dispositivos. Adaptaempleo está organizado de forma que si el usuario desactiva las hojas de estilo asociadas puede ser leído sin problemas. Menú de navegación sin css Se utilizan además unidades relativas para especificar las propiedades de las hojas de estilo, de esta forma se desarrolla un diseño de sitio web independientemente de 8 de 11

9 la resolución usada por los usuarios. El sitio web se muestra correctamente en todos los dispositivos, es lo que se denomina un diseño fluido o líquido. Para minimizar la carga del sitio web, se han utilizado en algunos casos fuentes embebidas, para adaptaciones de textos al diseño sin necesidad de utilizar imágenes. Color y contraste Adaptaempleo no transmite información solo por el color ya que puede haber usuarios que no puedan diferenciarlos. La combinación entre el color de fondo y el primer plano deben tener el suficiente contraste para que sean percibidas por personas con dificultades de percepción de color. Establecer un buen contraste entre el color de fondo y primer plano constituye una buena práctica del diseño web. Informe contraste de color menú de navegación Encabezamientos En Adaptaempleo se utilizan elementos de encabezado (H1 - H6) para marcar las diferentes secciones que componen la estructura de un documento y se organizan de forma correcta. Grupo Iniciativas ha tratado de conseguir una navegación coherente en toda la plataforma, siguiendo los mismos esquemas estructurales en todas sus páginas. Utilizando una maquetación, estructura de contenido, un estilo de fuentes y colores similar en todas las páginas se facilita la usabilidad del sitio web. 9 de 11

10 3. HERRAMIENTAS DE EVALUACIÓN Mediante una revisión general podemos identificar rápidamente el alcance de los problemas de accesibilidad que pueda tener un sitio web. Este punto requiere del uso combinado de técnicas manuales sobre las páginas como el uso de herramientas semi-automatizadas de chequeo de accesibilidad. Los métodos de validación que se han utilizado son: Validación automática de la accesibiliadad, se han usado TAW version Se ha validado la sintaxis del documento (HTML5) mediante el Markup Validation Service v. 1.3 del W3C. Se han validado las hojas de estilo (CSS 3) mediante el JIGSAW del W3C. Para la validación del contrate de color se ha utilizado la herramienta de Colour Contrast Check de Snook.ca. Para el desarrollo de la plataforma se han utilizado dos navegadores principalmente, Google Chrome y Firefox utilizando su el complemento Web Developer con las siguientes opciones: Modo sólo texto. Cambios en el tamaño de letra. Desactivación de Marcos, scripts, hojas de estilo y applets. Comprobación de que todos los enlaces indican claramente cuál es su destino. Se han realizado pruebas básicas de navegación sobre distintas plataformas y con versiones antiguas. Se ha comprobado su correcta visualización para distintas resoluciones de pantalla y dispositivos. Revisión de los textos del sitio en cuanto a su claridad y simplicidad. 10 de 11

11 4. CONCLUSIONES El resultado de este estudio avala los contenidos del sitio web en el momento de publicación inicial. Mantener los niveles de conformidad requerirá una revisión constante o al menos periódica. 11 de 11