Usabilidad y accesibilidad en el nuevo portal web del Ayuntamiento de Madrid Usabilidad
Usabilidad Usabilidad y accesibilidad y accesibilidad y accesibilidad en el nuevo portal web del en el nuevo portal web del en el nuevo portal web del
Ayuntamiento de Madrid Ayuntamiento de Madrid Ayuntamiento de Madrid
Área de Gobierno de Hacienda y Administración Pública
Usabilidad y accesibilidad en el nuevo munimadrid.es
m un im ad ri d
EL PROYECTO
UN NUEVO
MUNIMADRID.ES
El nuevo portal > situación de partida
munimadrid.es: parte de la estrategia multicanal (Línea Madrid) que aúna la atención presencial, telefónica y telemática
EL PROYECTO: UN NUEVO MUNIMADRID
Se partía de:
Base de Datos de Atención al Ciudadano Gran cantidad de información disponible Amplia experiencia en Internet
Los contras:
Falta de un plataforma adecuada Diversidad de soluciones técnicas
Dificultad de implantación de nuevos requerimientos Limitaciones un usabilidad y accesibilidad
Enfoque global:
Gestión integrada de contenidos y documentos Integración de contenidos y servicios
Incorporación de entornos de colaboración Arquitectura común para Internet e intranet Plataforma corporativa
Participación de todo el Ayuntamiento:
Desconcentración de la gestión de contenidos Portal corporativo y portales sectoriales
Nuevas funcionalidades:
Boletín electrónico, RSS, PDA, etc.
Destinado al ciudadano:
Usabilidad Accesibilidad
El nuevo portal > objetivos del proyecto
Nuevo portal intranet: Ayre
Servicios básicos de Administración electrónica
Nuevo portal web:
munimadrid.es El nuevo portal > parte de una estrategia global de Administración electrónica
Usabilidad y accesibilidad en el nuevo munimadrid.es
us ab ili da d
¡No me hagas pensar!
Primera norma sobre la usabilidad de Krug
Definiciones de la Organización Internacional para la Estandarización (ISO):
La usabilidad se refiere a la capacidad de un software de ser comprendido, aprendido, usado y ser atractivo para el usuario, en condiciones específicas de uso" (ISO/IEC 9126)
“Usabilidad es la eficiencia y satisfacción con la que un producto permite alcanzar objetivos específicos a usuarios específicos en un contexto de uso específico"
(ISO/IEC 9241)
Meta del nuevo munimadrid:
Convertirse en un sitio de referencia para un público masivo, deseoso de estar informado, conocer las actividades de su ciudad y con necesidades concretas de relacionarse con la administración municipal mediante servicios electrónicos que le proporcionen la posibilidad de realizar trámites vía electrónica con agilidad,
sencillez, rapidez y total seguridad Usabilidad > definición y meta
¡No me hagas pensar! En la medida de lo posible, cuando se mire una página web ésta ha de ser obvia, evidente, clara y fácil de entender.
No importa el numero de veces que hay que hacer clic en algo si la opción es mecánica e inequívoca
Elimine la mitad de las palabras en todas las páginas y luego deshágase de la mitad de lo que quede
Usabilidad > Normas de Krug sobre la usabilidad
¿Cómo usamos realmente la web?
No leemos las páginas; las hojeamos
No tomamos soluciones óptimas. Nos es suficiente
No averiguamos el funcionamiento de las cosas. Nos las arreglamos
Claves de diseño
Creación de una jerarquía visual en cada página Aprovechamiento y uso de la convenciones
División de las páginas en zonas claramente definidas Dejar bien claro lo que se puede hacer con un clic Minimizar el ruido
Fuente: No me hagas pensar, Steve Krug
Usabilidad > Algunas pistas
El contenido es el elemento principal de atención del usuario Diseño de la interfaz basado en el contenido
Máximo espacio de la pantalla para el contenido:
objetivo el 70%
Calidad de los contenidos y buenas prácticas de redacción
Experiencia visual óptima
Máximas facilidades de acceso
Acceso sencillo y ágil a los contenidos y servicios Diversidad de vías de acceso
Potenciación de las opciones de búsqueda: el
50% de los usuarios navegan haciendo búsquedas Rastro de posicionamiento que permita el registro de visitas habituales
Usabilidad > presentación de la información > criterios
Usabilidad > presentación de la información > la nueva página de inicio
Organización Temática Sencillez en el acceso a gran
volumen de información de acuerdo a una clasificación temática, más significativa para el ciudadano que la estructura orgánica municipal.
Acceso directos permanentes Atención al Ciudadano, Portal del Contribuyente, Información de Distritos y otras webs de la ciudad
Instalaciones y Servicios
Acceso rápido la información relativa a los equipamientos municipales y de la ciudad, de interés para el ciudadano, incluyendo su localización en el mapa.
Imagen homogénea en todo el portal y cabeceras gráficas específicas por sección Elementos de navegación comunes,
mantenimiento de rastros, etc
Usabilidad > presentación de la información > la nueva página de inicio
Buscador
Sistema de búsqueda simple y avanzada a todos los contenidos del portal
Acceso temporal a destacados
Hasta cinco espacios, contextuales a las páginas para enlazar directamente con contenidos, servicios o secciones
consideradas de interés para el ciudadano Administración Electrónica:
Información y acceso a trámites municipales y de la ciudad
Acceso permanente a las utilidades de uso habitual y secciones principales
Medios de Comunicación y Actividades de la ciudad
El carácter informativo del portal se trasmite focalizando el acceso central a los titulares de la notas de prensa y su enlace con el Portal sectorial de Medios de Comunicación.
Usabilidad > arquitectura de la información
Clasificación multidimensional de los contenidos:
Cada contenido es descrito por un número determinado de atributos o propiedades (categorías) y sus propios metadatos.
Se definieron cinco grandes “dimensiones” o categorías de clasificación:
ámbito geográfico (pertenencia a distritos) procedencia orgánica (áreas de gobierno)
temática (medio ambiente, vivienda, hacienda, etc)
tipos y subtipos de contenido (actividades, noticias, publicaciones, etc) colectivo de usuario destinatario del servicio (jóvenes, contribuyentes, etc) Permite:
Acceso a un contenido siguiendo diversos caminos de navegación o búsqueda
Se consigue:
Mayor posibilidad de acceso al contenido
Usabilidad > arquitectura de la información
procedencia orgánica
destinatario
tipología ámbito
geográfico ambito
temporal temática
Unidades de información:
Estructura:
Ejemplos:
piscina municipal de peñuelas
ámbito geográfico: arganzuela
procedencia orgánica: Coordinación Institucional (D.G. Deportes)
ámbito temporal: junio-septiembre tipología: ficha
temática: deportes, ocio destinatario: todos
convocatoria certamen jóvenes creadores
ámbito geográfico: madrid
procedencia orgánica: Empleo y Servicios a la Ciudadanía (D.G. Educación y Juventud
ámbito temporal: enero-abril 2005 tipología: ficha
temática: cultura destinatario: jóvenes
Usabilidad > importancia de las búsquedas
Diversos buscadores Simple y avanzado General y específico
Usabilidad y accesibilidad en el nuevo munimadrid.es
ac ce si bi lid ad
Accesibilidad > limitaciones y discapacidades
Muchos usuarios operan en contextos limitados:
Pueden no ser capaces de ver, escuchar, moverse o procesar algunos tipos de información
Pueden tener dificultad en la lectura o comprensión de un texto
No tienen por qué tener o ser capaces de usar un teclado o un ratón
Pueden tener una pantalla que sólo presenta texto, una pantalla pequeña o una conexión lenta a Internet
Pueden no hablar o comprender con fluidez el idioma en que esté redactado el documento
Pueden encontrarse en una situación en la que sus ojos, oídos o manos estén
ocupados u obstaculizados (Por ejemplo, conduciendo un automóvil, trabajando en un entorno ruidoso,...)
Pueden tener una versión anterior del navegador, un navegador completamente diferente, un navegador de voz o un sistema operativo distinto.
Accesibilidad > limitaciones y discapacidades
La discapacidad es algo muy normal:
En España más de 3,5 millones de personas (un 9% de la población) sufre algún tipo de discapacidad según la Encuesta sobre discapacidades, deficiencias y estado de salud de 1999[1].
Estas personas pueden navegar por Internet con técnicas de navegación asistida como display braille, lectores de pantalla por síntesis de voz o vídeo ampliadores.
[1] www.discapnet.es/solo_texto/Documentacion/Estadistica/
Las personas sin discapacidad también pueden tener limitaciones:
Quienes sufren una incapacidad transitoria (por ejemplo, un brazo roto)
Personas de edad avanzada.
Usuarios con dificultades para acceder a la Web (por ejemplo, una conexión lenta)
Accesibilidad > definición y objetivo
Definición de accesibilidad:
La accesibilidad a la web es el conjunto de elementos que permiten que personas con algún tipo de discapacidad puedan hacer uso de la Web: percibir, entender, navegar e interactuar con la Web, aportando a su vez contenidos.
Normativa legal
LEY 51/2003, de 2 de diciembre, de igualdad de oportunidades, no discriminación y accesibilidad universal de las personas con discapacidad
LEY 34/2002, de 11 de julio, de servicios de la sociedad de la información y de comercio electrónico (LSSICE)
Las Administraciones Públicas adoptarán las medidas necesarias para que la
información disponible en sus respectivas páginas de Internet pueda ser accesible a personas con discapacidad y de edad avanzada de acuerdo con los criterios de accesibilidad al contenido generalmente reconocidos antes del 31 de diciembre de 2005
Objetivo del Ayuntamiento para munimadrid
Cumplir con el nivel WAI-AA de accesibilidad en todos los contenidos
Accesibilidad > las pautas de accesibilidad a contenidos web
La Iniciativa para Accesibilidad de la WEB (WAI) del consorcio W3C publica las Pautas de Accesibilidad al Contenido en la Web (Web Content Accessibility Guidelines, WCAG) y una lista de comprobación de conformidad.
1. Proporcione alternativas para los contenidos visuales y auditivos.
2. No se base sólo en el color.
3. Utilice marcadores y hojas de estilo y hágalo apropiadamente.
4. Identifique el lenguaje natural usado.
5. Cree tablas que se transformen correctamente.
6. Asegure que las páginas que incorporen nuevas tecnologías se transformen
correctamente.
Accesibilidad > las pautas de accesibilidad a contenidos web
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 teniendo en cuenta diversos dispositivos.
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. Asegure que los documentos sean claros y simples.
Accesibilidad > las pautas > puntos de verificación y niveles de adecuación
Puntos de verificación
Se asocian a cada una de las pautas
Cada punto tiene asociado un nivel de prioridad
Prioridad 1: es un requerimiento básico para que algunos grupos pedan usar los documentos web
Prioridad 2: con su cumplimiento se eliminan importantes barreras de acceso a los documentos web
Prioridad 3: mejora la accesibilidad de los documentos web Niveles de adecuación
Referencia del grado de accesibilidad
Nivel A: se satisfacen todos los puntos de verificación de prioridad 1
Nivel doble A: se satisfacen todos los puntos de verificación de prioridad 1 y 2 Nivel triple A: se satisfacen todos los puntos de verificación de prioridad 1, 2 y 3
Accesibilidad > recomendaciones y técnicas
Definición de texto alternativo Utilización de hojas de estilo Confección adecuada de tablas Formularios accesibles
Estructuración mediante encabezados
Definición de tipo de documento
Textos adecuado para los hipervínculos JavaScript accesible
Utilización de metadatos Tecnologías y pautas W3C En el desarrollo: seguir las instrucciones
Accesibilidad > visión global de los componentes esenciales
www.w3c.org
Accesibilidad > auditoria > metodología
Realización para una muestra de páginas:
Análisis de las páginas con los distintos navegadores:
Activar y desactivar imágenes para verificar la existencia y adecuación del texto alternativo de cada una de ellas.
Desactivar las hojas de estilo (CSS), y comprobar que la página no pierde contenido.
Extraer la lista de encabezados para verificar que el contenido se estructura correctamente.
Activar y desactivar scripts y plugins. El sitio debe proporcionar la misma funcionalidad y acceso a la información.
Aumentar y disminuir tamaño de letra. El formato de la página debe ser tal que permita aumentar el
tamaño de la fuente presentada.
Análisis de hipervínculos
Validación del código empleado
Accesibilidad > auditoria > herramientas Navegadores
Al menos tres navegadores
Barras de herramientas de accesibilidad Web Accesibility Toolbar
Web Developer – Firefox Extension Ayudas técnicas
Lectores de pantalla de personas ciegas (Jaws, Window Eye, ...)
Modificadores de pantalla para personas deficientes (Magic, Zoomtext. ...) Programas de reconocimiento de voz (Dragon Naturally Speaking, ...)
Herramientas automáticas
Para validar gramáticas formales:
Hojas de estilo: jigsaw. w3c.org/css-validator/
Validación de código: validator.w3c.org
Para detectar incumplimiento de pautas de accesibilidad:
TAW, Pista Accesibilidad, Bobby, ...
Accesibilidad > auditoria > portales de capitales de provincia
Realizado por el Observatorio de Infoaccesibilidad de Discapnet (mayo 2006) Iniciativa de la Fundación ONCE y el FEDER
Metodología de Technosite (Fundación ONCE) www.discapnet.es
Análisis técnico de accesibilidad (WGAC):
Cumplimento medio: 25%
Más del 50%: Pamplona, Ceuta y Castellón Entre 25% y 50%: Barcelona, Murcia y Lugo Madrid: 24,49%
Valoración de usabilidad y accesibilidad de los usuarios Cumplimento medio: 55,77%
Accesibilidad > auditoria > el nuevo munimadrid
Auditoría de accesibilidad del nuevo munimadrid.es
Realizada por Technosite (entidad dependiente de ONCE) Verificación de las pautas de accesibilidad
Utilización de herramientas y técnicas de revisión automáticas y manuales Certificación en enero de 2007 del nivel AA de accesibilidad
Comentarios adicionales del auditor:
El Ayuntamiento de Madrid ha realizado un gran esfuerzo para incorporar los requisitos de accesibilidad a su sitio web.
Si se repitiese el Observatorio de Infoaccesibilidad de Discapnet sobre
Ayuntamientos, Munimadrid.es mejoraría notablemente su posición, pasando de un 25% a un 100% de accesibilidad.
Usabilidad y accesibilidad en el nuevo munimadrid.es
id ea s cl av e
MUNIMADRID
•Parte de una estrategia global de Administración electrónica
•Todo el Ayuntamiento aporta contenidos y servicios
•Diseñado para el ciudadano
USABILIDAD
•Presentación de la información: acceso al contenido
•Arquitectura de la información: clasificación multidimensional
•Importancia de las búsquedas
ACCESIBILIDAD
•Aplicación de las técnica adecuadas desde el principio
•Seguimiento de pautas fijadas por organismos externos