UF1843 Aplicación de técnicas de usabilidad y accesabilidad en el entorno cliente

UF1843

Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

Datos del autor

José Ramón Santos Dios es diplomado en Ciencias Empresariales por la Universidad de Vigo, graduado superior en TIC por la Universidad de Santiago de Compostela y máster en Software Libre por la UOC. Desde el año 2003 se ha dedicado a la docencia, impartiendo acciones formativas relacionadas con las Tecnologías de la Información y las Comunicaciones en las principales empresas de formación de la comunidad autónoma de Galicia y como Agente TIC para la red CEMIT de la Xunta de Galicia.

En la actualidad, combina su profesión de docente con la elaboración de contenidos didácticos adaptados a diferentes niveles formativos y la elaboración de manuales relacionados con certificados de profesionalidad, también el desarrollo del diseño y programación web ocupan parte de su actividad profesional.

Para ver su currículum profesional completo puede acceder a el enlace de la red Linkedin: https://www.linkedin.com/in/santosdios/

Ficha Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente.

Informática y comunicaciones.

1ª Edición.

Certia Editorial, Pontevedra, 2020 Autor: Jose Ramón Santos Dios Formato: 170 x 240 mm

Aplicación

• 84 páginas.

de técnicas de usabilidad y accesibilidad en el entorno

cliente. Informática y comunicaciones.

No está permitida la reproducción total o parcial de este libro, ni su tratamiento informático, ni la transmisión de ninguna forma o por cualquier medio, ya sea electrónico, mecánico, por fotocopia, por registro u otros métodos, sin el permiso previo y por escrito de los titulares del Copyright.

Derechos reservados 2020, respecto a la primera edición en español, por Certia Editorial.

ISBN: 978-84-17328-62-7 Editor: Cenepo Consult, SLU Depósito legal: PO 276-2020 Impreso en España - Printed in Spain Certia Editorial ha incorporado en la elaboración de este material didáctico citas y referencias de obras divulgadas y ha cumplido todos los requisitos establecidos por la Ley de Propiedad Intelectual. Por los posibles errores y omisiones, se excusa previamente y está dispuesta a introducir las correcciones pertinentes en próximas ediciones y reimpresiones.

Fuente fotografia portada: Pixabay, autoriza a copiar, distribuir, comunicar publicamente la obra y adaptar el trabajo.

510

MF0493_3: Implantación de aplicaciones web en entorno internet, intranet y extranet MP0391: Módulo de prácticas profesionales no laborales Duración horas totales certificado de profesionalidad

MF0492_3: Programación web en el entorno servidor

240

90

MF0491_3: Programación web en el entorno cliente

510

80 590

Duración horas módulos formativos

90

60

90

90

30

90

60

Horas

90

240

180

UF1841: Elaboración de documentos web mediante lenguajes de marca UF1842: Desarrollo y reutilización de componentes software y multimedia mediante lenguajes de guión UF1843: Aplicaciones técnicas de usabilidad y accesibilidad en el entorno cliente UF1844: Desarrollo de aplicaciones web en el entorno servidor.

UF1845: Acceso a datos en aplicaciones web del entorno servidor.

UF1846: Desarrollo de aplicaciones web distribuidas.

Correspondencia con el Catálogo Modular de Formación Profesional Módulos certificado H.CP Unidades formativas

180

H. Q

FICHA DE CERTIFICADO DE PROFESIONALIDAD (IFCD0210) DESARROLLO DE APLICACIONES CON TECNOLOGÍAS WEB (RD 1531/2011, de 31 de octubre modificado por el RD 628/2013, de 2 de agosto)

Área profesional: Desarrollo

Familia profesional: INFORMÁTICA Y COMUNICACIONES

Índice

INTRODUCCIÓN.................................................................................. 11

Unidad didáctica 1 1. Accesibilidad web................................................................................. 13 1.1. Definición de accesibilidad web.................................................................15 1.2. Ventajas y dificultades en la implantación de la accesibilidad web........17 1.3. Normativa y estándares sobre accesibilidad web.....................................18 1.4. Organismos regulatorios de la accesibilidad web.....................................19 1.5. Comparativa de normas y estándares........................................................20 1.6. Guías para el cumplimiento de normativas y estándares........................22 1.7. Descripción de las pautas principales (imágenes, enlaces, vídeo, etc.). ................................................................................................................23 1.8. Pautas para una navegación accesible........................................................26 1.9. Descripción del proceso de la conformidad en accesibilidad web........29 1.10. Tecnologías donde la accesibilidad es aplicable.......................................30 1.10.1. (X)HTML.........................................................................................30

9

1.10.2. CSS....................................................................................................31 1.10.3. JavaScript..........................................................................................32 1.10.4. Flash..................................................................................................32 1.10.5. PDF...................................................................................................33 1.10.6. XML/XSL........................................................................................34 1.10.7. Reproducción multimedia..............................................................34 1.10.8. Otras tecnologías.............................................................................35 1.11. Herramientas para la validación de la accesibilidad................................35 1.11.1. Basadas en navegador.....................................................................35 1.11.2. Mediante aplicaciones de escritorio.............................................40 1.11.3. Mediante servicios web externos..................................................42 1.12. Evolución de la accesibilidad. Nuevas tendencias..................................44

UNIDAD DIDÁCTICA 2 2. Usabilidad web..................................................................................... 45 2.1. Definición de usabilidad..............................................................................47 2.2. Importancia del diseño web centrado en el usuario................................47 2.3. Diferencias entre accesibilidad y usabilidad..............................................49 2.4. Ventajas y problemas en la combinación de accesibilidad y usabilidad........................................................................................................49

10

2.5. Ventajas y dificultades en la implantación de sitios web usables...........50 2.6. Métodos de usabilidad..................................................................................51 2.7. Análisis de requerimientos de usuario.......................................................52 2.8. Principios del diseño conceptual. Creación de prototipos orientados al usuario.............................................................................................................53 2.9. Pautas para la creación de sitios web usables. Evaluación de la usabilidad........................................................................................................54 resumen final................................................................................. 59 actividades....................................................................................... 61 autoEVALUACIÓN FINAL................................................................ 71 soluciones........................................................................................ 77 BIBLIOGRAFÍA .................................................................................... 79

11

Introducción El manual «UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente» forma parte del módulo formativo «MF0491_3: Programación web en el entorno cliente», del Catálogo Nacional de Cualificaciones Profesionales, y pertenece al certificado de profesionalidad «IFCD0210: Desarrollo de aplicaciones con tecnologías web».

El manual tiene por objetivo aprender los fundamentos de los principios de accesibilidad y usabilidad en la web, conocer las ventajas de utilizar un entorno accesible y usable en la construcción de sitios web, las herramientas de las que disponemos para realizar análisis y test de usabilidad y accesibilidad en dichos entornos, y conocer la aplicación de estos principios por medio de los lenguajes de marcado y hojas de estilo en el diseño de un sitio web responsive que cumpla las pautas de accesibilidad marcadas por la W3C. Finalmente encontraremos diferentes actividades y pruebas de evaluación para poner en práctica los contenidos aprendidos.

Este manual te permitirá adquirir las siguientes capacidades y criterios de evaluación: •

C1: Aplicar técnicas de usabilidad y accesibilidad en el desarrollo de interfaces de usuario. o

CE1.1 Distinguir y explicar pautas de accesibilidad al contenido en los documentos elaborados para permitir una mejor navegación y comprensión de los usuarios.

o

CE1.2 Distinguir y explicar pautas de usabilidad al contenido en los documentos elaborados para permitir una mejor calidad, efectividad y satisfacción de los usuarios.

o

CE1.3 En un supuesto práctico, en el que se pide crear y mantener componentes software y documentos aplicar normas de accesibilidad y usabilidad para mejorar su utilización.

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

13

UNIDAD

1

Accesibilidad Web

Contenido 1.1. Definición de accesibilidad web 1.2. Ventajas y dificultades en la implantación de la accesibilidad web.

1.3. Normativa y estándares sobre accesibilidad web 1.4. Organismos regulatorios de la accesibilidad web.

1.5. Comparativa de normas y estándares 1.6. Guías para el cumplimiento de normativas y estándares 1.7. Descripción de las pautas principales (imágenes, enlaces, vídeo, etc.).

1.8. Pautas para una navegación accesible 1.9. Descripción del proceso de la conformidad en accesibilidad web 1.10. Tecnologías donde la accesibilidad es aplicable 1.11. Herramientas para la validación de la accesibilidad 1.12. Evolución de la accesibilidad. Nuevas tendencias

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

15

El presente manual tiene por objeto el desarrollo de sitios web dotados de accesibilidad y usabilidad. Estos dos ejes tratan de cuestiones diferentes, pero relacionadas. Mediante la accesibilidad garantizamos que cualquier usuario con problemas de acceso a la información, como en el caso de las discapacidades físicas o cognitivas, pueda acceder a los mismos contenidos del sitio web que cualquier otro usuario. Por su parte, el concepto de usabilidad hace hincapié en proporcionar un acceso correcto mediante una interfaz amigable, eficiente y entendible, en definitiva para cualquier usuario en cualquier plataforma con la que se conecte. Por lo tanto, ambos conceptos, además de estar relacionados, forman parte de los requisitos de estándares que marca la W3C, además de requerimientos legales para la elaboración de sitios web profesionales regulados por varias normas legislativas de diferente ámbito.

Para ello, trabajaremos el concepto de diseño centrado en el usuario, y las páginas de interfaz amigables, que nos ayudará a desarrollar páginas con estas características. También trabajaremos en torno a los objetivos de cumplir los estándares de las W3C y sus recomendaciones de accesibilidad por parte de la WAI, lo que nos acercará más al proceso de accesibilidad de un entorno web.

1

.1. Definición de accesibilidad web

Los usuarios con problemas de accesibilidad son aquellos que presentan algún tipo de déficit o limitación para acceder a los contenidos de un sitio web en igualdad de condiciones al resto de los usuarios. Estos problemas de acceso pueden ser de diferente naturaleza: •

Usuario: o

Edad: tanto edad avanzada como temprana.Puede presentar dificultades en el entendimiento de los contenidos, problemas derivados del envejecimiento como la vista, coordinación, etc. En el caso de los menores, debemos tener en cuenta que tipo de contenido estamos presentando.

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

17

18

o

Incapacidades derivadas de problemas físicos: sordera, invidencia, problemas cognitivos, se trataría de personas con discapacidades físicas o mentales.

o

Incapacidades transitorias: como por ejemplo una persona que se ha roto un brazo y no puede utilizar el ratón o teclado de manera eficaz.

o

Incapacidades derivadas de diferencias culturales: como el idioma, conceptos, iconografías e imágenes relacionados con una cultura, etc.

•

Usuarios inexpertos: como en el caso de los analfabetos digitales, personas con desconocimiento de las funcionalidades del ratón o el teclado, etc.

•

Medios: o

Dificultades derivadas del entorno: mala iluminación, espacio reducido, etc.

o

Medios insuficientes: como una baja conexión a internet, equipos antiguos u obsoletos, monitores pequeños o antiguos con menos representación de colores, navegadores antiguos o sistemas desprovistos de plugins y extensiones.

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

1

.2. Ventajas y dificultades en la implantación de la accesibilidad web.

En este marco, la accesibilidad web hace referencia al conjunto de requisitos que un sitio web debe cumplir para que todos los usuarios puedan acceder a los contenidos del mismo con independencia de sus limitaciones físicas o técnicas y, que de esta manera, puedan interactuar con él de manera satisfactoria y eficiente.

Además del cumplimiento de los requisitos legales el desarrollo de sitios accesibles proporcionará las siguientes ventajas: •

Aumento del tráfico de acceso a la web.

•

Cumplimiento de los estándares, revalorización de la web.

•

Mejora de acceso a las diferentes aplicaciones a la web como en el caso de los motores de búsqueda y rastreo.

•

Mejora de la usabilidad del sitio, revalorización de la experiencia del usuario.

Las dificultades en el entorno de la accesibilidad web y su implantación vienen dadas por diferentes factores: •

Incremento de los costes del proyecto: evidentemente, la diferencia del desarrollo de un sitio web accesible repercute notablemente en la cantidad de horas de trabajo, así como en la complejidad del proyecto.

•

Adaptación constante a la legislación vigente y sus cambios: el desarrollo de la normativa relacionada con la accesibilidad se ha incrementado considerablemente y está continuamente cambiando, por lo que es necesario revisar con de manera periódica los proyectos terminados.

•

Contenidos multimedia e interactivos: este tipo de contenidos presentan dificultades en su adaptación a la accesibilidad, al obligarnos a realizar contenidos alternativos y texto explicativo de los mismos.

•

Cumplimiento más estricto en los estándares: la implantación de la accesibilidad nos obliga a ser mucho más exigentes en la codificación UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

19

de las webs que comprenden el sitio, así como la validación de todo el código.

1

.3. Normativa y estándares sobre accesibilidad web

A lo largo de los últimos años, se ha desarrollado todo un conjunto de normas de diferentes ámbitos en torno a la disciplina de la accesibilidad:

20

•

Norma UNE-EN 301549 V2.1.2:2019. Requisitos de accesibilidad de productos y servicios TIC. El objetivo de la norma es especificar los requisitos de accesibilidad que deben cumplir los productos y servicios relacionados con las TIC para su uso en la contratación pública.

•

Norma UNE 139803:2012. Requisitos de Accesibilidad para contenidos en la web. Como su nombre indica es una española que regula los requisitos de accesibilidad para los contenidos web, haciendo referencia a las Pautas de Accesibilidad para el contenido web WCAG2.0 de la Iniciativa para la Accesibilidad Web (WAI) del Consorcio de la Web (W3C) por lo tanto hay una equivalencia directa entre ellas.

•

Pautas de Accesibilidad para el Contenido Web (WCAG) 2.0, aprobadas en diciembre de 2008. Es una recomendación internacional acerca de la accesibilidad e contenidos en la web para personas con problemas de accesibilidad.

•

ISO/IEC 40500. Es un estándar internacional que recoge las putas de accesibilidad de la WCAG 2.0, publicado en 2012

•

Norma UNE 139803:2012. Consiste en una normativa de ámbito español que regula las normas de aplicación de la WCAG 2.0.

•

Directiva europea 2016/2102, sobre la accesibilidad de los sitios web y aplicaciones para dispositivos móviles de los organismos del sector público, en 26 de octubre de 2016.

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

La directiva tiene por objeto crear una normativa que regule y armonice la accesibilidad de los sitios web y aplicaciones para móviles de los organismos del sector público, haciéndose de esta manera un modelo de referencia para el resto de los agentes, empresas, organizaciones y usuarios.

Aunque la directiva entró en vigor en 2016, se estableció un calendario de aplicación de las normas por parte de los estados miembros.

Todas las páginas oficiales de las instituciones de la UE deberán seguir las mismas directrices internacionales de accesibilidad a los contenidos.

1

.4. Organismos regulatorios de la accesibilidad web

Existen diferentes organismos de accesibilidad web, unos a nivel internacional y otros propios de cada país o región.

En la actualidad, el mayor organismo en cuanto a regulación de los estándares que debe seguir la web y en concreto en el campo de la accesibilidad es el World UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

21

Wide Web Consortium (W3C). Este organismo internacional, formado por diferentes empresas e instituciones, dispone de varias áreas de trabajo entre las que se encuentra la WAI (Web Accesibility Initiative), que ha desarrollado la normativa referente a la accesibilidad a través de las pautas de accesibilidad web.

La Unión Europea también genera normativa, a través de las directivas del Parlamento Europeo, las cuales se articulan en los diferentes Estados miembros por medio de decretos, normativas y otras normas reguladoras.

En España los organismos implicados en el proceso de accesibilidad web han sido: •

El Ministerio de Hacienda y Función Pública, que ha sido el responsable de la iniciativa del Observatorio de Accesibilidad Web, un organismo cuyo objetivo es el asesoramiento en la implementación de la accesibilidad de los portales de la Administración Pública española.

•

La Secretaría de Estado de Administraciones Públicas tiene suscrito un acuerdo con AENOR (Asociación Española de Normalización y Certificación), en cuanto a la accesibilidad web para las administraciones públicas.

1

.5. Comparativa de normas y estándares

Como hemos visto, existen diferentes normativas y estándares relacionados con la accesibilidad web. En el caso de los primeros, se tratan de un conjunto de normas legislativas para dar contenido jurídico a este campo, comenzando por las directivas de la UE hasta las normas legislativas y decretos de los países miembros. A su vez, esta normativa se desarrolla o articula a través de estándares, que son documentos establecidos por consenso por un grupo de empresas,

22

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

organismos, expertos, instituciones, etc. debido al uso continuado y reglado de las normas y directrices que lo conforman.

Podemos dividir los tipos de estándares por su ámbito o por su oficialidad: •

Estándares de organismos oficiales: suelen ser de obligado cumplimiento por parte de los miembros del sector al que va dirigido, y respaldado por una determinada legislación o normativa. Se dividen a su vez en: o

o

Internacionales: –

Organización Internacional de Estandarización (ISO), responsables de las normas ISO internacionales sobre industria y comercio.

–

Comité Europeo de Normalización (CEN), responsables de estándares europeos en varios sectores de la economía.

–

Instituto Nacional Americano para estándares (ANSI).

Nacionales –

•

AENOR (Asociación Española de Nor malización y Certificación), responsable de la elaboración de normas de ámbito español.

Estándares no oficiales o privados: son los generados por una o varias corporaciones, empresas o instituciones por iniciativa propia, suelen tener una repercusión en el sector donde se articula el estándar, pero no son de obligado cumplimiento por todos.

El W3C (World Wide Web Consortium), que generan diferentes pautas algunas son reconocidas como oficiales pero otras no, por lo que muchos países no los incluyen en su legislación.

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

23

1

.6. Guías para el cumplimiento de normativas y estándares

Las principales pautas de accesibilidad de un sitio web vienen dadas por el Consorcio World Wide Web (W3C) a través de la Iniciativa de Accesibilidad Web (WAI) que ha articulado una serie de principios a través de una serie de pautas de accesibilidad. Esas pautas están estructuradas en tres clases: •

Pautas de Accesibilidad al Contenido en la Web (WCAG): grupo de pautas dirigidas a los desarrolladores web para indicar como realizar sitios web accesibles.

•

Pautas de Accesibilidad para Herramientas de Autor (ATAG): conjunto de reglas destinadas a los programadores de aplicaciones web para la realización de aplicaciones web accesibles.

•

Pautas de Accesibilidad para Agentes de Usuario (UAAG): grupo de reglas están dirigidas a los desarrolladores de navegadores y lectores de contenido web para realizar aplicaciones accesibles a todos los usuarios.

La Asociación Española de Normalización y Certificación (AENOR) es la autoridad encargada de regular, certificar y servir de guía para la aplicación de la normativa en Accesibilidad TIC en Internet, garantizando a empresas, organizaciones y usuarios los diferentes niveles de accesibilidad que marca la WAI en un sitio web.

Las características principales del organismo regulador son las siguientes:

24

•

Podemos certificar los niveles de accesibilidad A, AA y AAA por medio de sus parámetros.

•

Nos permite una auditoría técnica sobre accesibilidad para obtener su

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

certificación, incluyendo un plan de acciones para aplicar las medidas correctoras oportunas, identificando aspectos revisables del sitio web.

•

Permite la realización de verificaciones semestrales y revisiones sobre las correcciones realizadas, para aplicar los requisitos de accesibilidad certificados.

•

Permite la realización de auditorías anuales de la metodología de mantenimiento o sistema de gestión de la accesibilidad.

•

La certificación permite identificar la web accesible mediante la marca N de AENOR de Accesibilidad.

Para saber más: https://www.aenor.com/

1

.7. Descripción de las pautas principales (imágenes, enlaces, vídeo, etc.)

Las pautas de accesibilidad de la Iniciativa de Accesibilidad Web (WAI) son promovidas por el Consorcio World Wide Web (W3C), que ha dispuesto una serie de principios a través de las Pautas de Accesibilidad al Contenido de la Web 2.1 (WCAG 2.1).

Las pautas están organizadas en cuatro principios:

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente

25

Principio 1: Perceptible: la información y los componentes de la interfaz de usuario deben ser mostrados a los usuarios en formas que ellos puedan entender.

Hace referencia a todos los elementos a tener en cuenta para realizar una interfaz de usuario accesible, desde el punto de vista de la asimilación de los contenidos por parte del usuario, las pautas que engloban este principio son las siguientes: Pauta 1.1: Texto alternativo: siempre que el contenido sea visual o sonoro y no texto se deberá proporcionar texto alternativo que explique dicho contenido, por ejemplo, en el caso de la etiqueta <IMG> para insertar una imagen debemos utilizar el atributo ALT <IMG SRC=”esquema.jpg” ALT=”el siguiente esquema representa….” /> De esta manera, los navegadores accesibles como los parlantes o braille para invidentes traducirán la información disponible al medio adaptado para estos usuarios.

Pauta 1.2: Contenido multimedia dependiente del tiempo: en el caso de videos, animación u otro contenido multimedia debemos proporcionar alternativas sincronizadas para estos contenidos, como un audio descriptivo, etc.

Pauta 1.3: Adaptable: hace referencia a contenido que sea presentable de diferentes formas o formatos sin pérdida de información. En el caso de que se presenten contenidos en formatos PDF por ejemplo, debemos proporcionar una alternativa para que las personas con problemas de accesibilidad puedan acceder a dichos contenidos.

Pauta 1.4: Distinguible: hace referencia a facilitar a los usuarios el contenido, mediante una estructura jerárquica y clara que diferencie las partes más importantes.

Principio 2: Operable: los componentes de la interfaz de usuario y la navegación debe ser manejable.

El siguiente principio hace hincapié en el enfoque de la interfaz de usuario desde el punto de vista de la operatividad de los elementos del mismo Pauta 2.1: Teclado accesible: se refiere al acceso a los elementos interactivos

26

UF1843. Aplicación de técnicas de usabilidad y accesibilidad en el entorno cliente