Introducción A La Accesibilidad Web PDF

CURSO VIRTUAL:
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
Dirección de Innovación y Desarrollo Tecnológico
Rafael Martinez Marcos | Hamilton Bejarano Yupanqui
.NET Developer | . Net Developer
rmartinez@vivienda.gob.pe | vbejarano@vivienda.gob.pe
CONCEPTO DE DISCAPACIDAD
“La discapacidad resulta de la interacción entre las personas con deficiencias

y las barreras debidas a las actitudes y al entorno” (Convención sobre los
derechos de las Personas con Discapacidad de Naciones Unidas).
Discapacidad = Deficiencia x Barreras(Actitudes + Entorno)

INTRODUCCIÓN
VER NOTICIAS EN EL MUNDO COMUNICACIÓN POR CHAT COMPRAS EN LÍNEA
COMUNICACIÓN POR CORREO COMUNICACIÓN POR VIDEO ESTUDIOS

OBJETIVO E IMPORTANCIA
Objetivo
• La accesibilidad web tiene como objetivo lograr que las
páginas web sean utilizables por el máximo número de
personas, independientemente de sus conocimientos o
capacidades personales e independientemente de las
características técnicas del equipo utilizado para acceder a
la Web.
Importancia
• Es muy importante que la Web sea accesible para así
proporcionar un acceso equitativo e igualdad de
oportunidades a las personas con discapacidad
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
CURSO VIRTUAL:
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
PROBLEMAS DE ACCESIBILIDAD WEB
TIPOS DE DISCAPACIDAD
• Usuario con Discapacidad Visual

• Usuario con Discapacidad Auditiva
• Usuario con Discapacidad Motora
USUARIO CON DISCAPACIDAD VISUAL
• Persona ciega.
• Persona con baja visión.
• Persona con ceguera al color o daltonismo
EJEMPLO 1
• Seleccione el rectángulo verde para agregar su información.

• Seleccione el rectángulo rojo para eliminar su información.
¿Percepción de colores de un usuario con daltonismo?
EJEMPLO 1 – PERCEPCIÓN CON DALTONISMO

SOLUCIÓN 1

Eliminar información Agregar información

USUARIO CON DISCAPACIDAD AUDITIVA
• Persona sorda.
• Persona con audición baja.
EJEMPLO Y SOLUCIÓN 2
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
CURSO VIRTUAL:
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
VISIÓN DEL CURSO
DEFINICIÓN DE ACCESIBILIDAD WEB
• “La accesibilidad web significa que personas con algún tipo de discapacidad
van a poder hacer uso de la Web. En concreto, al hablar de accesibilidad web
se está haciendo referencia a un diseño web que va a permitir que estas
personas puedan percibir, entender, navegar e interactuar con la Web,
aportando a su vez contenidos.” – WEB ACCESSIBILITY INITIATIVE.
• “La accesibilidad web se puede dividir en tres categorías principales: del
contenido, de la navegación y de la interacción.” – JIM THATCHER
ESTRUCTURA DEL CURSO
1. Bienvenida al curso: introducción al curso.

2. Qué es la accesibilidad web: definición de accesibilidad web, mitos asociados a la accesibilidad web,
beneficios que puede aportar la accesibilidad web a las personas con discapacidad.
3. Pautas y Lineamientos: pautas internacionales para mejorar la accesibilidad de las páginas web,
lineamientos de accesibilidad a páginas web y aplicaciones para telefonía móvil para instituciones
públicas del Sistema Nacional de Informática 2009 – PCM.
4. Diseño accesible: cómo lograr que la presentación de una página web sea accesible, ¿qué hacer? Y ¿qué
no hacer?
5. Análisis y evaluación de la accesibilidad: cómo realizar un análisis de accesibilidad de un sitio web,
herramientas de análisis de la accesibilidad web.
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
CURSO VIRTUAL:
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
¿Qué es Accesibilidad Web?
QUÉ ES ACCESIBILIDAD WEB
• “La accesibilidad web significa que personas con algún tipo de discapacidad
van a poder hacer uso de la Web. En concreto, al hablar de accesibilidad web
se está haciendo referencia a un diseño web que va a permitir que estas
personas puedan percibir, entender, navegar e interactuar con la Web,
aportando a su vez contenidos. La accesibilidad Web también beneficia a
otras personas, incluyendo personas de edad avanzada que han visto
mermadas sus habilidades a consecuencia de la edad. ” – Introducción a la
Accesibilidad Web - W3C.
W3C - WORLD WIDE WEB CONSORTIUM
El máximo organismo dentro de la jerarquía de Internet que se encarga de promover la
accesibilidad es el W3C, en especial su grupo de trabajo WAI (Web Accessibility Initiative).
El W3C es el World Wide Web Consortium, un organismo internacional que tiene como
objetivo "guiar la Web hacia su máximo potencial a través del desarrollo de protocolos y
pautas que aseguren el crecimiento futuro de la Web". En los objetivos del W3C en español
se puede leer:
• Web para todo el mundo.
El valor social que aporta la Web, es que ésta hace posible la comunicación humana, el
comercio y las oportunidades para compartir conocimiento. Uno de los objetivos
principales del W3C es hacer que estos beneficios estén disponibles para todo el mundo,
independientemente del hardware, software, infraestructura de red, idioma, cultura,
localización geográfica, o habilidad física o mental.
MITOS DE LA ACCESIBILIDAD WEB
Las personas con
discapacidad no
utilizan la Web:
FALSO.
La accesibilidad es
sólo para las Las páginas web
personas con con solo texto son
discapacidad: accesibles: FALSO.
FALSO.
La accesibilidad es La accesibilidad es
sólo para ciegos: cara y costosa:
FALSO. FALSO.
BENEFICIOS DE LA ACCESIBILIDAD WEB
Factores sociales.
Factores técnicos.
Factores financieros.
Factores legales y de
políticas.
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
CURSO VIRTUAL:
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
Pautas y Leyes
ESTÁNDARES Y PAUTAS DE ACCESIBILIDAD
• W3C: World Wide Web Consortium
• WAI: Web Accessibility Initiative
• Pautas WAI (Web Accessibility Initiative):
• WCAG (Web Content Accessibility Guidelines) 2.0
• UAAG (User Agent Accessibility Guidelines)
• ATAG (Authoring Tools Accessibility Guidelines)
• IBM Web Accessibility Checklist.
• Microsoft Accessibility Design Guidelines for the Web.
PAUTAS DE ACCESIBILIDAD AL CONTENIDO WEB (WEB CONTENT
ACCESSIBILITY GUIDELINES) 2.0
• 4 principios de Accesibilidad Web:
• Perceptibilidad: la información y los componentes de la interfaz de usuario deben ser mostrados a los
usuarios en formas que ellos puedan entender.
• Operabilidad: los componentes de la interfaz de usuario y la navegación debe ser sencillos de manejar.
• Comprensibilidad: la información así como las operaciones a realizar por los usuarios deben ser
comprensibles
• Robustez: el contenido deber ser suficientemente robusto para que pueda ser bien interpretado por
una gran variedad de agentes de usuario, incluyendo ayudas técnicas.
• 12 Directrices o pautas
• 61 Requisitos de conformidad
• Niveles de cumplimiento: A, AA, AAA
WCAG 2.0 MAP
INTRODUCCIÓN A LAS WCAG 2.0: PERCEPTIBLE
Perceptible: la información y los componentes de la interfaz de usuario deben ser

mostrados a los usuarios en formas que ellos puedan entender:
• Texto alternativo: Proporciona texto alternativo para el contenido que no sea textual, así
podrá ser transformado en otros formatos que la gente necesite, como caracteres grandes,
lenguaje braille (braile no es correcto), lenguaje oral, símbolos o lenguaje más simple.
• Contenido multimedia dependiente del tiempo: Proporcione alternativas sincronizadas para
contenidos multimedia sincronizados dependientes del tiempo.
• Adaptable: Crear contenido que pueda ser presentado de diferentes formas sin perder ni
información ni estructura.
• Distinguible: Facilitar a los usuarios ver y escuchar el contenido incluyendo la distinción entre
lo más y menos importante.
INTRODUCCIÓN A LAS WCAG 2.0: OPERABLE
Operable: los componentes de la interfaz de usuario y la navegación debe ser

manejable.
• Teclado accesible: Poder controlar todas las funciones desde el teclado.
• Tiempo suficiente: Proporciona tiempo suficiente a los usuarios para leer y utilizar el
contenido.
• Ataques epilépticos: No diseñar contenido que pueda causar ataques epilépticos.
• Navegación: Proporciona formas para ayudar a los usuarios a navegar, a buscar contenido y a
determinar donde están estos.
INTRODUCCIÓN A LAS WCAG 2.0: COMPRENSIBLE
Comprensible: La información y las operaciones de usuarios deben ser comprensibles.

• Legible: Hacer contenido de texto legible y comprensible.
• Previsible: Hacer la apariencia y la forma de utilizar las páginas web previsibles.
• Asistencia a la entrada de datos: los usuarios de ayuda evitarán y corregirán errores.
INTRODUCCIÓN A LAS WCAG 2.0: ROBUSTEZ
Robustez: el contenido deber ser suficientemente robusto para que pueda ser
bien interpretado por una gran variedad de agentes de usuario, incluyendo
tecnologías de asistencia.
• Compatible: Maximiza la compatibilidad con los agentes de usuario actuales y futuros,
incluyendo tecnologías de asistencia.
PAUTAS EN ACCESIBILIDAD WEB EN PERU
• Lineamientos de Accesibilidad a Páginas Web y aplicaciones para telefonía

móvil para Instituciones Públicas del Sistema Nacional de Informática
aprobado con RM 126-2009-PCM.
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
CURSO VIRTUAL:
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
DISEÑO ACCESIBLE
10 REGLAS DE ORO PARA UN DISEÑO WEB ACCESIBLE
1. Proporcionar Alternativas Textuales a elementos no texto.
2. Estructurar los contenidos.
3. Evitar depender de un único sentido.
4. Crear toda la funcionalidad accesible con teclado.
5. Dar tiempo suficiente.
6. Evitar interferencias.
7. Identificar enlaces y contenidos.
8. Crear interfaces de navegación consistentes.
9. Ayudar a los usuarios a evitar errores.
10. Asegurar Compatibilidad.
PROPORCIONAR ALTERNATIVAS DE TEXTO: ASPECTOS GENERALES
El texto:
• Permite hacer llegar la información a todos los usuarios.
• Es flexible: se puede aumentar de tamaño, cambiar de color, etc.
• Es adaptativo a cualquier tecnología o dispositivo
• Permite a motores de búsqueda indexar contenidos de páginas (y mejorar
posicionamiento en buscadores; Google busca en una página los mismos elementos un
lector de pantalla).
PROPORCIONAR ALTERNATIVAS DE TEXTO: USO DE ALT
• Usar para contenido no textual: imágenes, audio, video.
• ALT:
• <img src=”ruta_sistema.jpg” alt=”descripción de la imagen”/>
• Trasmitir función, significado o propósito de la imagen.
• Descripción clara, concisa, máximo 120 caracteres
• CAPTCHAs necesitan alternativas accesibles.
• No necesario para imágenes decorativas.
• Evitar imágenes de texto (excepto logotipos).
• Descripción larga:
• Puede ser necesaria cuando el Alt text no sea necesario, ubicar junto a la imagen
ORGANIZAR Y ESTRUCTURAR CONTENIDOS: ENCABEZADOS Y LISTAS
• Encabezados:
• Agrupan contenidos de una página web de forma jerárquica secuencial (fundamentales para navegación
con Accessibility Tools):
• Estructura semántica:
• <h1>Texto que define contenido bajo encabezado Nivel 1</h1>
• <h2>Texto que define contenido bajo encabezado Nivel 2</h2>
• Listas:
• Secuencia de N elementos con un nexo común y en concreto, en una página web, puede tener una
disposición visual vertical u horizontal
• Permite anidar contenidos
• Ordenadas <ol>: progresión, secuencia
• No ordenadas <ul>: sin secuencia
• Usar <strong> en lugar de negrita
• Usar <em> en lugar de itálicas
ORGANIZAR Y ESTRUCTURAR CONTENIDOS: TABLAS DE DATOS
• Simples: identificar encabezados de columnas y filas:
<TH>ENCABEZADO DE FILA<TH> <TH>ENCABEZADO DE FILA<TH>
<TH>ENCABEZADO DE FILA<TH> <td>Datos</td> <td>Datos</td>
<TH>ENCABEZADO DE FILA<TH> <td>Datos</td> <td>Datos</td>
• Complejas: asociar encabezados y datos se realiza por medio atributos de etiqueta. Las celdas de encabezados
<th> contienen el atributo “id” y hay que asociarlo al atributo encabezado “headers” de las celdas de datos, p.e.
• <th id=”a1”>Datos del alumno</th>
• <th id=”b1” headers=”a1”>Nombre</th>
• <td headers=”a1 b1”>Ricardo</td>
Datos del alumno de primero (id=a1)

Nombre (id=b1 headers=a1) Apellidos (id=b2 headers=a1) Nota
Ricardo (headers=a1 b1) Pérez (headers=a1 b2) 10
EVITAR DEPENDER DE UN ÚNICO SENTIDO
• Incluir Subtítulos y Audio descripción en videos
• Uso del color: criterio 1.4.1 de las WCAG 2.0 exige que la información no se base sólo en
este tipo de características debe proporcionarse alternativas para usuarios con
discapacidad visual
• P.e. para campos obligatorios en un formulario indicados en rojo.
• P.e. para gráficos estadísticos con distintos colores, proporcionar una tabla con los mismos datos o,
mejor aún, un texto explicativo.
• Contraste:
• Para texto tamaño 12pt: relación de contraste: 4,5:1.
• Para texto mayor que 18pt (o 14pt en negrita): 3,0:1
• Mismos niveles aplicables a otros elementos que transmita información al usuario: iconos, gráficos,
diagramas, bordes de tablas, etc.
• Audio de fondo: acompañar de alternativas que no requieran de oído: texto, etc.
TODA LA FUNCIONALIDAD ACCESIBLE CON TECLADO
• Criterio 2.1.1 de las WCAG 2.0
• Algunos usuarios pueden usar otros tipos de entrada: pantallas táctiles, acceso por voz,
etc., por lo que debe usarse elementos de interfaz estándar.
• Garantizar que las interfaz tengan interacción estándar (testear para prevenir
“interferencias” con productos).
• Garantizar que los Menús desplegables puedan abrirse y cerrarse desde el teclado
• Selectores con recarga de página (mueve el foco al inicio de la página sin consultarlo al
usuario). Resolverlo incluyendo un botón de confirmación de selector de recarga.
• Lightboxes, paneles y cuadros de diálogo superpuestos: asegurar que el foco del teclado
está siempre situado allí donde se está leyendo el contenido en cada momento; y que el
foco se desactiva en todos aquellos contenidos que no deben ser accedidos mientras un
cuadro o panel modal está abierto
TODA LA FUNCIONALIDAD ACCESIBLE CON TECLADO: EVITAR “TRAMPAS”
• Evitar “trampas” de teclado:

• El criterio 2.1.2 de las WCAG 2.0 las considera un problema grave de interferencia con la navegación.
• Ocurre cuando un script “captura” el foco del teclado en un determinado elemento, impidiendo al
usuario continuar navegando por el resto de la página usando el tabulador y flechas. P.e. evento
onKeyPress que al pulsar un botón abra una nueva ventana e impide al usuario “salir” del botón.
Solución: sustituir evento onKeyPress por onClick para que el manejador de evento sólo se active si
realmente se pulsa el botón.
• Evitar comportamientos inesperados
• Evitar funcionalidades de arrastrar y soltar, menús desplegables, etc.
• Controlar el Orden del foco
• Foco debe ser visible en todo momento
DAR TIEMPO SUFICIENTE
• Ajuste del tiempo en procesos:
• A usuarios con baja velocidad de lectura o dificultades para manejar la página web, puede resultarles
imposible completar un proceso.
• Incluir un aviso que indique al usuario el tiempo restante, permitiéndole extender el tiempo y continuar
hasta completar el proceso.
• Permitir al usuario desactivar el límite temporal por completo.
• Banners, carruseles en movimiento y animaciones con información y velocidad de lectura:
usuarios que leen despacio por dificultades de visión, dislexia, etc. pueden no ser capaces
de acceder a toda la información, aunque ésta se repita una y otra vez. Solución: evitar
proporcionar información relevante de esta forma, o proporcionar mecanismos para
detener las animaciones o movimientos, o para controlar la velocidad.
• Evitar redirecciones automáticas
EVITAR INTERFERENCIAS
• Destellos y epilepsia foto-sensible: evitar vídeos y animaciones que contengan escenas
donde se produzcan cambios rápidos de luminosidad (más de tres veces por segundo), o
efectos impactantes para llamar la atención del usuario.
• Evitar el inicio automático de elementos multimedia con audio, salvo que tenga una
duración de menos de 3 segundos, y sólo arranquen bajo demanda.
• Evitar parpadeos, movimiento, actualización automática, ya que puede dificultar la
atención de personas con dislexia, déficit de atención, etc. en el contenido principal del
sitio web.
• Evitar la apertura de nuevas ventanas al entrar en una página.
• Comportamientos inesperados (recargas automáticas de la página, apertura de nuevas
ventanas, etc.): generan confusión y problemas de usabilidad; ejemplo un usuario ciego
no sabrá dónde se encuentra en la página, ni qué ha ocurrido.
IDENTIFICAR ENLACES Y CONTENIDOS
• Los enlaces deben:
• Tener sentido fuera de contexto
• Describir el destino (sitio web o título de documento)
• Ser únicos para cada destino único
• Evitar:
• “Hacer clic aquí”, “Pulsar aquí”
• “Enviar email”
• Texto de URL tipo “http://www.ugallo-b59-go2376c.html”
• Encabezados de sección: imprescindibles para establecer la navegación dentro del

documento (vínculos en el índice de la Tabla de Contenidos)
• Títulos de página: usar elemento <title>
• Etiquetas de formulario:
• Todos deben disponer de una etiqueta identificativa que permita al usuario saber qué dato corresponde
a cada cuadro de texto, casilla, selector, etc.
• combinar <label for> con <input id>
CREAR INTERFACES DE NAVEGACIÓN CONSISTENTES
• Navegación consistente:
• Garantizar que los usuarios podrán esperar encontrar elementos en ubicaciones relativas similares
(mismo orden relativo) al navegar por distintas páginas, de modo que les resulte más fácil localizar
elementos como menús, cuadros de búsqueda, barras de herramientas, etc.
• Usar plantillas homogéneas para distintas secciones.
• Identificación consistente: enlaces, botones y otras funcionalidades que se repiten en
distintas páginas deben tener el mismo nombre, o similar, y actuar de forma similar.
• Mapa del sitio, búsquedas, y otros mecanismos (migas, barras de herramientas, artículos
relacionados, etc.) para localizar páginas en un sitio web.
• Estructura de la información adecuada y coherente.
AYUDAR A LOS USUARIOS A EVITAR ERRORES
• Etiquetas e instrucciones: indicar claramente en la etiqueta la información a introducir en el campo de
formulario y el formato de la misma, Ejemplo. “Fecha de nacimiento. Formato: dd/mm/aaaa; ejemplo:
08/01/1999”.
• Identificar errores (formularios): los formularios deben incluir validaciones inteligentes como para
permitir al usuario introducir los datos con distintos formatos, convirtiendo luego el dato al formato
deseado para su procesamiento.
• Sugerir valores correctos: en caso de que un usuario introduzca un dato no válido debido a una
restricción de formato o de tipo de dato, debe informarse al usuario de cuál es la restricción, sugiriendo
algún ejemplo de dato válido.
• Para formularios de información sensible con consecuencias legales, se deben proporcionar
mecanismos que aseguren que el usuario es consciente de dichas consecuencias:
• verificado (aceptación explícita mediante el marcado de una casilla)
• Confirmado: incluir paso intermedio antes de finalizar el proceso, en el que el usuario puede comprobar
todos los datos a enviará y confirmar que son correctos
• Reversible: mecanismo que permita al usuario cancelar la acción que ha realizado una vez enviados los datos.
ASEGURAR COMPATIBILIDAD DE LOS CONTENIDOS WEB CON
PRODUCTOS DE APOYO Y NAVEGADORES
• Estándares web y validación de código: usar http://validator.w3.org/ para documentos

HTML anteriores a HTML5, o http://validator.w3.org/nu para HTML5.
• Compatibilidad con la accesibilidad: definir las características que están bien
soportadas en versiones de navegadores, sistemas operativos.
• Tests con usuarios
• Tecnologías novedosas con cautela
DISEÑO WEB: QUÉ HACER Y QUÉ NO HACER:
Diseñar para usuarios con baja visión:
Sí:
• utilizar un buen contraste de color y un tamaño de
tipografía legible
• publicar toda la información en páginas web
• utilizar una combinación de color, formas y texto
• mantener una composición lineal y lógica
• ubicar botones y notificaciones en contexto
No:
• utilizar contraste de color pobre y un tamaño de tipografía
pequeño
• ocultar información en descargables
• utilizar únicamente color para asociar significados
• desparramar contenido por toda la página
• separar acciones de su contexto.
Diseñar para usuarios de lectores de pantalla
Sí:
• describir imágenes y proporcionar transcripciones para
video
• mantener una composición lineal y lógica
• estructurar contenido utilizando HTML5
• construir para el uso de teclado únicamente
• redactar vínculos y títulos descriptivos
No:
• mostrar información únicamente en una imagen o video
• desparramar contenido por toda la página
• basarse en el tamaño del texto y ubicación para la
estructura
• forzar el uso de ratón o pantalla
• redactar vínculos y títulos poco informativos
Diseñar para usuarios con capacidades motoras o físicas
diferentes
Sí:
• usar acciones y enlaces grandes
• otorgar distancia a los campos de los formularios
• diseñar para operar con el teclado o el habla únicamente
• diseñar teniendo en mente los móviles y las pantallas
táctiles
• ofrecer atajos
No:
• exigir precisión
• agrupar interacciones juntas
• realizar contenido dinámico que requiera mucho
desplazamiento del ratón
• tener períodos breves de expiración de una tarea
• requerir demasiada información y desplazamientos en
pantalla
Diseñar para usuarios con dificultades auditivas o sordos
Sí
• Escribir en términos sencillos
• utilizar subtítulos o proveer transcripciones para videos
• utilizar un diseño lógico y lineal
• dividir el contenido con subtítulos, imágenes y videos
• permitir que los usuarios soliciten su vía de comunicación
preferida al realizar citas
No
• utilizar expresiones idiomáticas o regionalismos
• poner contenido únicamente en audio o video
• realizar diseños y menús complejos
• hacer a los usuarios leer largos bloques de contenido
• hacer de la vía telefónica el único medio de contacto para
los usuarios
Diseñar para usuarios con dyslexia:
Sí
• utilizar imágenes y diagramas para dar soporte al texto
• alinear texto a la izquierda y mantener una estructura
consistente
• producir materiales en otros formatos (por ejemplo, audio o
video)
• mantener el contenido breve, claro y simple
• permitir a los usuarios modificar el contraste entre fondo y
texto
No:
• utilizar bloques extensos de denso texto
• subrayar palabras, utilizar itálicas o escribir en mayúsculas
• forzar a usuarios a recordar cosas de páginas previas - dar
recordatorios e indicaciones
• basarse en una ortografía precisa-utilizar auto corrector o dar
sugerencias
• ubicar demasiada información en un lugar
Diseño para usuarios en espectro autista:
Sí:
• Utilizar colores simples
• Escribir en términos sencillos
• Usar frases simples y viñetas
• Hacer botones descriptivos
• Construir diseños simples y consistentes
No:
• utilizar colores brillantes y contrastantes
• utilizar expresiones idiomáticas o regionalismos
• crear textos demasiado largos
• hacer botones vagos e impredecibles
• construir diseños complejos y recargados
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
CURSO VIRTUAL:
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB
EVALUACIÓN DE LA ACCESIBILIDAD
WEB
EVALUACIÓN DE LA ACCESIBILIDAD WEB - HERRAMIENTAS
• Navegadores
• Herramientas semi – automáticas

• Extensiones y plugins para navegadores

EVALUACIÓN DE LA ACCESIBILIDAD WEB – PRODUCTOS DE APOYO
• Productos de apoyo
• Opciones de accesibilidad del sistema
• Lectores de pantalla: JAWS, NVDA, VoiceOver, ChromeVox…
• Magnificadores: ZoomText, MAGic…
• Reconocimiento de voz: Dragon, VCR…
• Móviles: Talks, Zooms, Mobile Speak, etc.
EVALUACIÓN DE LA ACCESIBILIDAD WEB – TEST CON USUARIOS
• Comprobar con pruebas.

• Evaluar con herramientas semi-automáticas es suficiente.
• Necesario efectuar evaluación manual por expertos.
• Tests con usuarios para detectar otros problemas.
• La usabilidad puede ser un factor crítico.
DEMO
REFERENCIAS
• W3C WAI - Resources for Web Accessibility Presentations and

Training.
• WCAG 2.0 – W3C.
• Guía de accesibilidad para desarrolladores UOC-Technosite
• WebAIM's WCAG 2.0 Checklist for HTML documents.
• UK Government Digital Service.
• Curso Accesibilidad Web – Universidad de Alicante
INTRODUCCIÓN A LA
ACCESIBILIDAD WEB

Introducción A La Accesibilidad Web PDF

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Introducción A La Accesibilidad Web PDF

Enviado por

Direitos autorais:

Formatos disponíveis

CURSO VIRTUAL:

“La discapacidad resulta de la interacción entre las personas con deficiencias

Discapacidad = Deficiencia x Barreras(Actitudes + Entorno)

VER NOTICIAS EN EL MUNDO COMUNICACIÓN POR CHAT COMPRAS EN LÍNEA

COMUNICACIÓN POR CORREO COMUNICACIÓN POR VIDEO ESTUDIOS

• Usuario con Discapacidad Visual

• Seleccione el rectángulo verde para agregar su información.

• Seleccione el rectángulo verde para agregar su información.

• Seleccione el rectángulo verde para agregar su información.

Eliminar información Agregar información

1. Bienvenida al curso: introducción al curso.

Perceptible: la información y los componentes de la interfaz de usuario deben ser

Operable: los componentes de la interfaz de usuario y la navegación debe ser

Comprensible: La información y las operaciones de usuarios deben ser comprensibles.

• Lineamientos de Accesibilidad a Páginas Web y aplicaciones para telefonía

<TH>ENCABEZADO DE FILA<TH> <td>Datos</td> <td>Datos</td>

<TH>ENCABEZADO DE FILA<TH> <td>Datos</td> <td>Datos</td>

Datos del alumno de primero (id=a1)

• Evitar “trampas” de teclado:

• Encabezados de sección: imprescindibles para establecer la navegación dentro del

• Estándares web y validación de código: usar http://validator.w3.org/ para documentos

• Herramientas semi – automáticas

• Extensiones y plugins para navegadores

• Comprobar con pruebas.

• W3C WAI - Resources for Web Accessibility Presentations and

Você também pode gostar