WCAG 2.0: Pautas de Accesibilidad al Contenido Web

WCAG 2.0

Pautas de Accesibilidad al Contenido Web 2.0

Discapacidad motora

Ceguera Baja visión Baja audiciónSordera

Problemas cognitivos Personas mayores Todos

Nota: Los iconos utilizados tienen Licencia Creative Commons Attribution 2.0 (http://icons.anatom5.de , http://www.natko.de)

Autor: Adelaida Delgado --- URL: http://servidorti.uib.es/adelaida/accesibilidad/WCAG20.ppt

WCAG 2.0. Bibliografía*

W3C. Web Content Accessibility Guidelines (WCAG) 2.0 [HTML]. Ben Caldwell, Michael Cooper, Loretta Guarino Reid, Gregg Vanderheiden. W3C (MIT, ERCIM, Keio): W3C, 11 de diciembre de 2008, [Consulta: noviembre de 2009]. Recomendación W3C. Disponible en: <http://www.w3.org/TR/WCAG/>.

W3C. Understanding WCAG 2.0 [HTML]. Ben Caldwell, Michael Cooper, Loretta Guarino Reid, Gregg Vanderheiden. W3C (MIT, ERCIM, Keio): W3C, 11 de diciembre de 2008, [Consulta: noviembre de 2009]. Nota del Grupo de Trabajo del W3C. Disponible en: <http://www.w3.org/TR/UNDERSTANDING-WCAG20/>.

W3C. Techniques for WCAG 2.0 [HTML]. Ben Caldwell, Michael Cooper, Loretta Guarino Reid, Gregg Vanderheiden. W3C (MIT, ERCIM, Keio): W3C, 11 de diciembre de 2008, [Consulta: noviembre de 2009]. Nota del Grupo de Trabajo del W3C. Disponible en: <http://www.w3.org/TR/WCAG20-TECHS/>.

W3C. How to Meet WCAG 2.0 [HTML]. Gregg Vanderheiden, Loretta Guarino Reid, Ben Caldwell, Shawn Lawton Henry. W3C (MIT, ERCIM, Keio): W3C, 1 de diciembre de 2008, [Consulta: noviembre de 2009]. Referencia rápida de los requisitos de las Pautas de Accesibilidad para el Contenido Web (WCAG) 2.0. Disponible en: <http://www.w3.org/WAI/WCAG20/quickref/>.

Documentación del curso [W20.FC02] - Accesibilidad Web WCAG 2.0 impartido por Andrés Berdasco de la Fundación CTIC

*Estas diapositivas están elaboradas a partir de tal documentación elaborada por el W3C, la cual está sujeta a Copyright ©2008 W3C y de la elaborada por el CTIC, también sujeta a Copyright © 2010 Fundación CTIC

WCAG 2.0

Principio 1: PerceptiblePrincipio 2: OperablePrincipio 3: ComprensiblePrincipio 4: Robusto

Pauta 1.1: Alternativas textualesPauta 1.2: Medios TempodependientesPauta 1.3: AdaptablePauta 1.4: Distinguible

Principio 1: Perceptible

Pauta 1.1: Alternativas textuales

Proporcionar alternativas textuales para todo contenido no textual de modo que se pueda convertir a otros formatos que las personas

necesiten, tales como textos ampliados, braille, voz, símbolos o en un lenguaje más

simple

Pauta 1.1: Alternativas textuales Pauta 1.1: Alternativas textuales

Criterio de conformidad 1.1.1: Contenido no textual

Criterio de conformidad 1.1.1: Contenido no textual

A

Todo contenido no textual que se presenta al usuario tiene una alternativa textual que cumple el mismo propósito, excepto en las situaciones enumeradas a continuación:

Controles, Entrada de datos

Contenido multimedia tempodependiente

Pruebas

Sensorial

CAPTCHA

Decoración, Formato, Invisible

Todo contenido no textual que se presenta al usuario tiene una alternativa textual que cumple el mismo propósito, excepto en las situaciones enumeradas a continuación:

Controles, Entrada de datos

Contenido multimedia tempodependiente

Pruebas

Sensorial

CAPTCHA

Decoración, Formato, Invisible

Beneficiarios:

Objetivo: Hacer que la información transmitida mediante contenido no textual sea

accesible a través de alternativas textuales

1.1.1.Contenido no textual1.1.1.Contenido no textual

ALTERNATIVA TEXTUAL CORTA

Proporcionar una alternativa textual corta para el contenido no textual

que cumpla la misma función y presente la misma información que el

contenido textual

Usar el atributo alt en los elementos <img>

Usar una alternativa textual en una imagen perteneciente a un grupo

de imágenes de forma que describa a todo el grupo

Si una imagen funciona como enlace, describir su propósito

Combinar imágenes y enlaces contiguos al mismo recurso

A


Usar el atributo alt de las imágenes usadas como botones de envío

de formularios (<input> de tipo “image”)

Proporcionar alternativas textuales para las zonas activas de los

mapas de imagen

Proporcionar alternativas textuales para ASCII art, emoticones y

“leetspeak”

Usar el cuerpo del elemento <object>

Proporcionar alternativas textuales para los elementos <applet>

A


ALTERNATIVA TEXTUAL LARGA

Proporcionar una descripción larga para el contenido no textual que

cumpla la misma función y presente la misma información usando

alguna técnica específica para descripciones largas

Usar el atributo longdesc del elemento <img>

Usar el cuerpo del elemento <object>

Proporcionar una descripción larga cerca del contenido no textual,

incluyendo una referencia a su ubicación en la descripción corta

Proporcionar una descripción larga en otra ubicación incluyendo un

enlace a la misma junto al contenido no textual

A

CONTROLES DE FORMULARIO

Proporcionar una alternativa textual que identifique el propósito del

contenido no textual

Usar elementos <label> para asociar las etiquetas con los controles

de formulario

Usar el atributo title para identificar los controles de formulario

cuando no se pueda usar el elemento <label>

A


MULTIMEDIA, TEST O CONTENIDO SENSORIAL

Proporcionar una etiqueta descriptiva usando alguna técnica de

descripción corta vista anteriormente

Proporcionar una alternativa textual corta para el contenido no textual

con el nombre aceptado o un nombre descriptivo

Proporcionar una etiqueta descriptiva que describa el propósito del

contenido que es “sólo audio” y “sólo vídeo” en directo usando

alguna de las técnicas para alternativas textuales cortas

A


CAPTCHAs

Proporcionar una alternativa textual que describa el propósito del

CAPTCHA y asegurar que la página web contiene otro CAPTCHA con

el mismo propósito pero en una modalidad sensorial diferente

A


CONTENIDO DECORATIVO

Marcar el contenido no textual de forma que sea ignorado por los

productos de apoyo usando alguna de las siguientes técnicas:

Usar el texto alternativo vacío y no usar el atributo title de los

elementos <img> para aquellas imágenes que deban ser ignoradas

por los productos de apoyo (imágenes decorativas)

Usar CSS para incluir las imágenes decorativas

A


Pauta 1.2: Medios Tempodependientes

Proporcionar alternativas para los medios tempodependientes

Para contenido sólo audio grabado y contenido sólo vídeo grabado, se cumple lo

siguiente, excepto cuando el audio o vídeo es un contenido multimedia alternativo

al texto y está claramente identificado como tal:

Sólo audio grabado: Se proporciona una alternativa para los medios tempo-dependientes que

presenta información equivalente para el contenido sólo audio grabado

Sólo vídeo grabado: Se proporciona una alternativa para los medios tempo-dependientes o se

proporciona una pista sonora que presente información equivalente al contenido del medio de sólo

vídeo grabado

Para contenido sólo audio grabado y contenido sólo vídeo grabado, se cumple lo

siguiente, excepto cuando el audio o vídeo es un contenido multimedia alternativo

al texto y está claramente identificado como tal:

Sólo audio grabado: Se proporciona una alternativa para los medios tempo-dependientes que

presenta información equivalente para el contenido sólo audio grabado

Sólo vídeo grabado: Se proporciona una alternativa para los medios tempo-dependientes o se

proporciona una pista sonora que presente información equivalente al contenido del medio de sólo

vídeo grabado

Pauta 1.2: Medios Tempodependientes Pauta 1.2: Medios Tempodependientes

Criterio de conformidad 1.2.1: Sólo audio y sólo vídeo (grabado)

Criterio de conformidad 1.2.1: Sólo audio y sólo vídeo (grabado)

A

Objetivo: Permitir a personas con discapacidades auditivas ver la presentación

multimedia original sin perder información

Beneficiarios:

1.2.1. Sólo audio y sólo vídeo (grabado)1.2.1. Sólo audio y sólo vídeo (grabado)

TRANSCRIPCIÓN TEXTUAL

Transcripción textual para el contenido que es sólo audio

Incluir los diálogos y sonidos más significativos (risas, aplausos,

música, etc.)

Identificar a cada hablante en los diálogos

Transcripción textual para el contenido que es sólo vídeo

Incluir descripciones de todo el contenido visual importante

(acciones, personas, expresiones corporales, escenarios, texto en

pantalla, etc.

A

Se proporcionan subtítulos para el contenido de audio

grabado dentro de contenido multimedia sincronizado,

excepto cuando la presentación es un contenido multimedia

alternativo al texto y está claramente indicado como tal.

Se proporcionan subtítulos para el contenido de audio

grabado dentro de contenido multimedia sincronizado,

excepto cuando la presentación es un contenido multimedia

alternativo al texto y está claramente indicado como tal.


Criterio de conformidad 1.2.2: Subtítulos (grabados)

Criterio de conformidad 1.2.2: Subtítulos (grabados)

A

Beneficiarios:

Objetivo: Permitir a personas con discapacidades auditivas ver la presentación

multimedia original sin perder información

1.2.2. Subtítulos (grabados) 1.2.2. Subtítulos (grabados)

SUBTITULADO PARA SORDOS (CAPTIONING)

Incluyen todos los contenidos sonoros, tanto los diálogos como los

sonidos ambientales y todo sonido significativo necesario para

comprender el contenido multimediaSi el contenido multimedia tiene varias pistas de audio en diferentes idiomas

deberíamos proporcionar subtítulos para todos los idiomas usados

Tipos de subtítulosAbiertos: Son aquellos que no se pueden desactivar y están disponibles para

todo el mundo, generalmente incrustados en el propio vídeo

Cerrados: Se pueden activar y desactivar. Diferentes tecnologías (SMIL 1.0,

SMIL 2.0)

A

Se proporciona una alternativa para los medios tempo-

dependientes o una audiodescripción para el contenido de

vídeo grabado en los multimedia sincronizados, excepto

cuando ese contenido es un contenido multimedia alternativo

al texto y está claramente identificado como tal.

Se proporciona una alternativa para los medios tempo-

dependientes o una audiodescripción para el contenido de

vídeo grabado en los multimedia sincronizados, excepto

cuando ese contenido es un contenido multimedia alternativo

al texto y está claramente identificado como tal.


Criterio de conformidad 1.2.3: Audiodescripción o Medio Alternativo (grabado)

Criterio de conformidad 1.2.3: Audiodescripción o Medio Alternativo (grabado)

A

Beneficiarios:

Objetivo: Permitir a personas con discapacidades visuales acceder a la

presentación multimedia sin perder información o, al menos dispongan de una

transcripción textual completa.

1.2.3. Audiodescripción o Medio Alternativo (grabado) 1.2.3. Audiodescripción o Medio Alternativo (grabado)

AUDIODESCRIPCIÓN

Narración con información sobre los elementos visuales clave de la

presentación multimedia (acciones, escenarios, lenguaje corporal,

gráficos y texto mostrado, etc.)

Las descripciones auditivas están sincronizadas con la banda visual

No ha de interferir con el audio original (aprovechar los silencios)

Se pueden proporcionar en una segunda pista de audio

Si no se pueden utilizar tecnologías de sincronización se pueden

proporcionar dos versiones de la presentación multimedia, la

versión normal y la versión con la audiodescripción

Un caso especial son las alternativas en audio para dar alternativas

auditivas a contenido que es sólo vídeo. El enlace al archivo de audio

debe estar inmediatamente antes o después del vídeo

A

1.2.3. Audiodescripción o Medio Alternativo (grabado) 1.2.3. Audiodescripción o Medio Alternativo (grabado)

TRANSCRIPCIÓN TEXTUAL

Transcripción textual para el contenido que es multimedia

sincronizado

Incluir descripciones de todo el contenido visual y auditivo

A

Se proporcionan subtítulos para todo el contenido de

audio en directo de los multimedia sincronizados

Se proporcionan subtítulos para todo el contenido de

audio en directo de los multimedia sincronizados


Criterio de conformidad 1.2.4: Subtítulos (directo)

Criterio de conformidad 1.2.4: Subtítulos (directo)

AA

Beneficiarios:

Objetivo: Permitir a personas con discapacidades auditivas ver presentaciones en

directo sin perder información.

Se proporciona una audiodescripción para todo el

contenido de vídeo grabado dentro de contenido

multimedia sincronizado

Se proporciona una audiodescripción para todo el

contenido de vídeo grabado dentro de contenido

multimedia sincronizado


Criterio de conformidad 1.2.5: Audiodescripción (grabado)Criterio de conformidad 1.2.5: Audiodescripción (grabado)

AA

Beneficiarios:

Objetivo: Permitir a personas con discapacidades auditivas ver presentaciones en

directo sin perder información.

Se proporciona una interpretación en lengua de

señas para todo el contenido de audio grabado

dentro de contenido multimedia sincronizado

Se proporciona una interpretación en lengua de

señas para todo el contenido de audio grabado

dentro de contenido multimedia sincronizado


Criterio de conformidad 1.2.6: Lengua de señas (grabado)Criterio de conformidad 1.2.6: Lengua de señas (grabado)

AAA

Beneficiarios:

Objetivo: Permitir a las personas sordas cuya lengua principal es la lengua de

signos entender el contenido de presentaciones multimedia. El lenguaje de signos

permite transmitir entonación y emoción.

1.2.6. Lengua de señas (grabado)1.2.6. Lengua de señas (grabado)

LENGUA DE SEÑAS

Permite transmitir entonación y emoción

Deben transmitir los diálogos y los sonidos más significativos

necesarios para comprender el contenido multimedia

Se pueden incluir en la pista de vídeo de la presentación multimedia

original

Otra posibilidad es incluirlo en otra pista de vídeo sincronizada con

la presentación multimedia (en un área de visualización aparte o

superpuesta). Recomendable que se pueda redimensionar.

AAA

Cuando las pausas en el audio de primer plano son

insuficientes para permitir que la audiodescripción comunique

el significado del vídeo, se proporciona una audiodescripción

ampliada para todos los contenidos de vídeo grabado dentro

de contenido multimedia sincronizado.

Cuando las pausas en el audio de primer plano son

insuficientes para permitir que la audiodescripción comunique

el significado del vídeo, se proporciona una audiodescripción

ampliada para todos los contenidos de vídeo grabado dentro

de contenido multimedia sincronizado.


Criterio de conformidad 1.2.7: Audiodescripción ampliada (grabada)

Criterio de conformidad 1.2.7: Audiodescripción ampliada (grabada)

AAA

Beneficiarios:

Objetivo: Permitir a las personas con discapacidades visuales acceder a la

presentación multimedia sin perder información y más fielmente que con una

audiodescripción estándar.

Se proporciona una alternativa para los medios

tempodependientes, tanto para todos los contenidos

multimedia sincronizados grabados como para todos los

medios de sólo vídeo grabado.


tempodependientes, tanto para todos los contenidos

multimedia sincronizados grabados como para todos los

medios de sólo vídeo grabado.


Criterio de conformidad 1.2.8: Medio alternativo (grabado)Criterio de conformidad 1.2.8: Medio alternativo (grabado)

AAA

Beneficiarios:

Objetivo: Lograr que el contenido visual y auditivo esté disponible para usuarios

con baja visión que tienen dificultades para leer los subtítulos y, por otro lado, para

quienes tienen problemas auditivos que les dificultan oír los diálogos o las

audiodescripciones


tempodependientes que presenta información

equivalente para el contenido de sólo audio en

directo


tempodependientes que presenta información

equivalente para el contenido de sólo audio en

directo


Criterio de conformidad 1.2.9: Sólo audio (directo)

Criterio de conformidad 1.2.9: Sólo audio (directo)

AAA

Beneficiarios:

Objetivo: Hacer que la información de audio en directo, como conferencias,

charlas en directo, radio webcast, etc. Esté disponible para personas con

capacidades auditivas.

Pauta 1.3: Adaptable

Crear contenido que pueda presentarse de diferentes formas (por ejemplo, con una

disposición más simple) sin perder información o estructura

La información, estructura y relaciones comunicadas a través

de la presentación pueden ser determinadas por software o

están disponibles como texto

La información, estructura y relaciones comunicadas a través

de la presentación pueden ser determinadas por software o

están disponibles como texto

Pauta 1.3: Adaptable Pauta 1.3: Adaptable

Criterio de conformidad 1.3.1: Información y relaciones

Criterio de conformidad 1.3.1: Información y relaciones

A

Objetivo: Que los agentes de usuario, productos de apoyo y otras aplicaciones

sean capaces de reconocer la estructura y semántica del contenido para

transmitirla a los usuarios

Beneficiarios:

1.3.1. Información y relaciones 1.3.1. Información y relaciones

En (X)HTML proporcionar la información y las relaciones entre el

contenido usando las siguientes técnicas:

Usar <h1> - <h6> para identificar los encabezados

Usar <ol>, <ul>, <dl> para las listas

Usar marcado de tablas para presentar la información tabular

Asociar las celdas de encabezado y las celdas de datos en las tablas

de datos mediante el atributo scope

Asociar las celdas de encabezado y las celdas de datos en las tablas

de datos mediante los atributos id y headers

Usar el elementos <caption> para asociar las tablas de datos con su

título

A

Usar el atributo summary para dar una visión general de las tablas de datos

Usar el elemento <label> para asociar las etiquetas con los controles de

formulario

Usar el atributo title para identificar los controles de formulario cuando no se

pueda usar el elemento <label>

Proporcionar una descripción para grupos de controles de formulario

mediante los elementos <fieldset> y <legend>

Usar <optgroup> para agrupar los elementos option dentro de un <select>

Usar marcado semántico cuando se emplea el color como pista

Usar funciones DOM en caso de usar scripts para añadir contenido a la

página

A


Tecnologías diferentes de (X)HTML

Siempre que la tecnología empleada lo permita hemos de usar las

características disponibles para proporcionar la información

estructural y semántica de forma que pueda ser reconocida mediante

software

Si la tecnología NO permite el marcado estructural y semántico:

Proporcionar la información en texto

Usar convenciones para dar formato al texto plano (TXT):

Transmitir la estructura del contenido mediante

encabezados

Facilitar el reconocimiento de párrafos

Crear listas sencillas

A


Cuando la secuencia en que se presenta el contenido afecta

a su significado, se puede determinar por software una

secuencia correcta de lectura.

Cuando la secuencia en que se presenta el contenido afecta

a su significado, se puede determinar por software una

secuencia correcta de lectura.


Criterio de conformidad 1.3.2: Secuencia significativa

Criterio de conformidad 1.3.2: Secuencia significativa

A

Objetivo: Asegurarnos que el significado del contenido original se mantendrá

cuando se usen presentaciones alternativas

Beneficiarios:

1.3.2. Secuencia significativa 1.3.2. Secuencia significativa

Ordenar todo el contenido dentro de las secuencias significativas

Proporcionar el contenido basándose en el marcado estructural y

respetando el orden dentro de las secuencias significativas

Hacer que coincida el orden DOM con el orden visual

Marcar secuencias dentro del contenido como significativas

Atributo dir para indicar los cambios anidados en la dirección de

lectura del texto

Marca Unicode para indicar la dirección de lectura en los textos de

los idiomas mezclados:

Izqda a drcha: &lrm; o ‎

Drcha a izqda: &rlm; o ‏

A

Las instrucciones proporcionadas para entender y operar el

contenido no dependen exclusivamente de las características

sensoriales de los componentes como su forma, tamaño,

ubicación visual, orientación o sonido

Las instrucciones proporcionadas para entender y operar el

contenido no dependen exclusivamente de las características

sensoriales de los componentes como su forma, tamaño,

ubicación visual, orientación o sonido


Criterio de conformidad 1.3.3: Características sensorialesCriterio de conformidad 1.3.3: Características sensoriales

A

Objetivo: Asegurar que todos los usuarios pueden acceder al contenido y

comprender las instrucciones para usarlo, incluso cuando no puedan percibir la

forma, tamaño o información sobre la localización espacial u orientación

Beneficiarios:

1.3.3. Características sensoriales 1.3.3. Características sensoriales

Proporcionar una identificación textual de los elementos que de otra

manera dependerían únicamente de información sensorial para poder

comprenderlos

No hacer referencia a elementos de la página web únicamente en

función de su forma, tamaño, posición, orientación o sonido

Ej: Al hacer referencia a un botón de formulario se puede

mencionar su función o la etiqueta que lo describe en vez de dar

únicamente información sensorial como su forma o color

A

Pauta 1.4: Distinguible

Facilitar a los usuarios ver y oír el contenido, incluyendo la separación entre en primer

plano y el fondo

El color no se usa como único medio visual para transmitir la

información, indicar una acción, solicitar una respuesta o

distinguir un elemento visual

El color no se usa como único medio visual para transmitir la

información, indicar una acción, solicitar una respuesta o

distinguir un elemento visual

Pauta 1.4: Distinguible Pauta 1.4: Distinguible

Criterio de conformidad 1.4.1: Uso del color

Criterio de conformidad 1.4.1: Uso del color

A

Objetivo: Asegurar que todos los usuarios pueden acceder a la información que se

transmite por el color. No impide el uso del color para transmitir información

siempre y cuando no sea éste el único medio empleado.

Beneficiarios:

1.4.1. Uso del color 1.4.1. Uso del color

Uso del color del texto, fondos u otro contenido para proporcionar

información

Asegurar que la información transmitida por diferencias de color está

además disponible en el textoEj: En un formulario podemos indicar los campos obligatorios incluyendo

la palabra “obligatorio” en las etiquetas correspondientes. O emplear

“pistas” como asteriscos, explicando antes del formulario, que “los campos

obligatorios están marcados con un asterisco”

Asegurar que hay pistas visuales adicionales cuando se usa el color

del texto para transmitir informaciónEj: Utilizar variaciones en el estilo del texto (tamaño, negrita,, itálica,

subrayado, etc.) para destacar los enlaces dentro de bloques de texto

A

Si se emplea únicamente el color para identificar los enlaces y

controles , usar un contraste de al menos 3:1 con el texto que los

rodea y pistas visuales adicionales cuando reciben el foco

Uso del color en imágenes para proporcionar información

Usar patrones (formas, diferentes trazos de líneas, etc.) de forma

que se pueda percibir la información sin necesidad de reconocer los

colores

Asegurar que la información transmitida por diferencias de color

también está disponible en textoEj: Utilizar leyendas asociadas a cada una de las secciones de una

gráfica

A

1.4.1. Uso del color 1.4.1. Uso del color

Si el audio de una página web suena automáticamente

durante más de 3 segundos, se proporciona ya sea un

mecanismo para pausar o detener el audio, o un mecanismo

para controlar el volumen del sonido que es independiente

del nivel de volumen global del sistema.

Si el audio de una página web suena automáticamente

durante más de 3 segundos, se proporciona ya sea un

mecanismo para pausar o detener el audio, o un mecanismo

para controlar el volumen del sonido que es independiente

del nivel de volumen global del sistema.


Criterio de conformidad 1.4.2: Control del audio

Criterio de conformidad 1.4.2: Control del audio

A

Objetivo: Evitar interferencias entre el sonido de la página y la lectura por parte del

lector de pantalla.

Beneficiarios:

1.4.2. Control del audio 1.4.2. Control del audio

Apagar automáticamente el sonido al cabo de 3 seg., o

Proporcionar un control al comienzo de la página que permita apagar

los sonidos reproducidos automáticamente, o

El control debe ser operable mediante teclado y estar correctamente

etiquetado con un texto que explique claramente su función

Reproducir los sonidos sólo bajo demanda de los usuarios

El sonido debe estar inicialmente apagado

Hay que proporcionar controles para iniciar y detener el sonido.

Si se incluye un control para manejar el volumen ha de ser

independiente del volumen del sistema para no disminuir también el

volumen del lector de pantalla

A

La presentación visual de texto e imágenes de texto tiene una relación de

contraste de, al menos, 4:5:1, excepto en los siguientes casos:

Textos grandes: los textos de gran tamaño y las imágenes de texto de gran tamaño tienen una

relación de contraste de, al menos, 3:1

Incidental: Los textos o imágenes de texto que forman parte de un componente inactivo de la

interfaz de usuario, que son simple decoración, que no resultan visibles para nadie o forman parte

de una imagen que contiene otros elementos visuales significativos, no tienen requisitos de

contraste

Logotipos: El texto que forma parte de un logo o nombre de marca no tiene requisitos de contraste mínimo.


contraste de, al menos, 4:5:1, excepto en los siguientes casos:

Textos grandes: los textos de gran tamaño y las imágenes de texto de gran tamaño tienen una

relación de contraste de, al menos, 3:1

Incidental: Los textos o imágenes de texto que forman parte de un componente inactivo de la

interfaz de usuario, que son simple decoración, que no resultan visibles para nadie o forman parte

de una imagen que contiene otros elementos visuales significativos, no tienen requisitos de

contraste

Logotipos: El texto que forma parte de un logo o nombre de marca no tiene requisitos de contraste mínimo.


Criterio de conformidad 1.4.3: Contraste (mínimo)

Criterio de conformidad 1.4.3: Contraste (mínimo)

AA

Beneficiarios:

Objetivo: Proporcionar el suficiente contraste entre el primer plano y el fondo para

que las personas con baja visión puedan leer el contenido

1.4.3. Contraste (mínimo)1.4.3. Contraste (mínimo)

Excepciones:

Texto puramente decorativo

Componentes de interfaz de usuario inactivos

Imágenes con texto y otro contenido visual relevante

Logotipos

Asegurar que el contraste entre el texto (e imágenes de texto) y el

fondo detrás del texto es suficiente.

Texto normal (menor de 18pt o 14pt y negrita): contraste mínimo de

4:5:1

Texto grande (al menos 18pt o 14pt y negrita): contraste mínimo de

3:1

AA

Herramienta: Contrast Analyzer

AA

Proporcionar un control con un

contraste suficiente que

permita a los usuarios cambiar

a una presentación que tenga

un contraste suficiente

La versión alternativa se

puede crear mediante una

hoja de estilo alternativa

1.4.3. Contraste (mínimo)1.4.3. Contraste (mínimo)

A excepción de los subtítulos y las imágenes del

texto todo el texto puede ser ajustado sin ayudas

técnicas hasta un 200% sin que se pierdan el

contenido o la funcionalidad

A excepción de los subtítulos y las imágenes del

texto todo el texto puede ser ajustado sin ayudas

técnicas hasta un 200% sin que se pierdan el

contenido o la funcionalidad


Criterio de conformidad 1.4.4: Cambio de tamaño del texto Criterio de conformidad 1.4.4:

Cambio de tamaño del texto AA

Beneficiarios:

Objetivo: Asegurar que el texto renderizado visualmente, incluidos los controles

basados en texto, se pueden redimensionar de forma que puedan ser leídos por

personas con problemas de visión sin necesidad del uso de ayudas técnicas como

magnificadores de pantalla.

1.4.4. Cambio de tamaño del texto1.4.4. Cambio de tamaño del texto

Usar una tecnología que disponga de agentes de usuario de uso

común que soporten zoom, o

Navegadores: IE7, Firefox 3, Opera 9

Usar unidades de medida relativas para el contenido y asegurar que

los contenedores redimensionan con el texto, o

Para el tamaño de la fuente: %

Unidad em

Nombres para el tamaño de la fuente (xx-small, x-small, small, medium,

large, x-large, xx-large, smaller, larger)

AA

Para los contenedores:Maquetación líquida (ancho de los contenedores en % y flotado de

elementos)

Maquetación estática (ancho y/o alto de los contenedores en unidad

em)

Proporcionar controles en la página para que los usuarios puedan

aumentar el tamaño del texto hasta un 200%, o

Utilizar controles visibles e incluidos directamente en la página

AA


AA

Asegurar que no se pierde contenido o funcionalidad cuando se

redimensione el texto y los contenedores no redimensionen

No se han de producir desbordamientos o solapamientos de

contenido que dificulten su percepción al aumentar el tamaño del texto

hasta un 200%


Si con las tecnologías que se están utilizando se puede conseguir la presentación

visual deseada, se utiliza texto para transmitir la información en vez de imágenes

de texto, excepto en los siguientes casos:

Configurable: La imagen de texto es visualmente configurable según los requisitos del usuario

Esencial: Una forma particular de presentación del texto resulta esencial para la información que

se transmite

Nota: los logotipos se consideran esenciales

Si con las tecnologías que se están utilizando se puede conseguir la presentación

visual deseada, se utiliza texto para transmitir la información en vez de imágenes

de texto, excepto en los siguientes casos:

Configurable: La imagen de texto es visualmente configurable según los requisitos del usuario

Esencial: Una forma particular de presentación del texto resulta esencial para la información que

se transmite

Nota: los logotipos se consideran esenciales


Criterio de conformidad 1.4.5: Imágenes de texto

Criterio de conformidad 1.4.5: Imágenes de texto

AA

Beneficiarios:

Objetivo: Crear presentaciones para formatos específicos de texto de forma que

los usuarios que necesiten una presentación determinada del texto la puedan

ajustar a sus necesidades.

1.4.5. Imágenes de texto 1.4.5. Imágenes de texto

Excepciones:

La presentación del texto es esencial para transmitir la información (Ej.: un

logotipo, la hoja de un periódico impreso, una carta manuscrita, etc. Cuya

presentación original forma parte de su valor documental o la presentación de

diferentes tipografías de ejemplo)

Se puede configurar la imagen de texto (fuente, tamaño o color de primer

plano o fondo) por ejemplo generando dinámicamente las imágenes de texto

con scripts en el servidor y dando a los usuarios las opciones de configuración

necesarias.

AA

1.4.5. Imágenes de texto 1.4.5. Imágenes de texto

Usar CSS para controlar la presentación del texto

Propiedades: color, font-family, text-align, font-size, font-style, font-

weight, line-height, text-transform, letter-spacing, background-image

Pseudoclases: first-line, first-letter, before, after

Uso de fuentes ampliamente disponibles o proporcionar fuentes

alternativas

Si finalmente usamos imágenes de texto, usar alguna técnica de

reemplazo de texto por imágenes de texto

Incluir un control que permita a los usuarios cambiar entre los dos

tipos de presentación, texto e imágenes de texto

AA


contraste de, al menos 7:1, excepto en los siguientes casos:

Textos grandes: Los textos de gran tamaño y las imágenes de textos de gran tamaño tienen una

relación de contraste de, al menos 4:5:1

Incidental: Los textos o imágenes de texto que forman parte de un componente de la interfaz de

usuario inactivo, que son simple decoración, que no resultan visibles para nadie o forman parte de

una imagen que contiene otros elementos visuales significativos, no tienen requisitos de contraste

Logotipos: El textos que forma parte de un logo o nombre de marca no tienen requisito de

contraste mínimo.


contraste de, al menos 7:1, excepto en los siguientes casos:

Textos grandes: Los textos de gran tamaño y las imágenes de textos de gran tamaño tienen una

relación de contraste de, al menos 4:5:1

Incidental: Los textos o imágenes de texto que forman parte de un componente de la interfaz de

usuario inactivo, que son simple decoración, que no resultan visibles para nadie o forman parte de

una imagen que contiene otros elementos visuales significativos, no tienen requisitos de contraste

Logotipos: El textos que forma parte de un logo o nombre de marca no tienen requisito de

contraste mínimo.


Criterio de conformidad 1.4.6: Contraste (mejorado)

Criterio de conformidad 1.4.6: Contraste (mejorado)

AAA

Beneficiarios:

Objetivo: Proporcionar el suficiente contraste entre el primer plano y el fondo para

que las personas con baja visión puedan leer el contenido

Para el contenido de sólo audio grabado que (1) contiene habla de primer plano,

(2) no es un CAPTCHA sonoro o un audiologo , y (3) que no es una vocalización

cuyo intención principal es servir como expresión musical (como el canto o el rap),

se cumple al menos uno de los siguientes casos:

Ningún sonido de fondo: El audio no contiene sonidos de fondo

Apagar: Los sonidos de fondo pueden ser apagados

20 dB: Los sonidos de fondo son, al menos, 20 decibelios más bajos que el discurso en primer

plano, con la excepción de sonidos ocasionales que duran solamente uno o dos segundos

Para el contenido de sólo audio grabado que (1) contiene habla de primer plano,

(2) no es un CAPTCHA sonoro o un audiologo , y (3) que no es una vocalización

cuyo intención principal es servir como expresión musical (como el canto o el rap),

se cumple al menos uno de los siguientes casos:

Ningún sonido de fondo: El audio no contiene sonidos de fondo

Apagar: Los sonidos de fondo pueden ser apagados

20 dB: Los sonidos de fondo son, al menos, 20 decibelios más bajos que el discurso en primer

plano, con la excepción de sonidos ocasionales que duran solamente uno o dos segundos


Criterio de conformidad 1.4.7: Sonido de fondo bajo o ausente

Criterio de conformidad 1.4.7: Sonido de fondo bajo o ausente

AAA

Beneficiarios:

Objetivo: Asegurar que los sonidos de fondo son lo suficientemente bajos para

que las personas con problemas de audición puedan diferenciar las voces del resto

de sonidos.

1.4.7. Sonido de fondo bajo o ausente1.4.7. Sonido de fondo bajo o ausente

Mezclar los archivos de audio de forma que los sonidos sean al

menos 20 dB más bajos que las voces

Comprobarlo con algún programa de edición de audio

AAA

En la presentación visual de bloques de texto, se proporciona algún mecanismo

para lograr lo siguiente:

1. Los colores de fondo y primer plano pueden ser elegidos por el usuario

2. El ancho no es mayor de 30 caracteres o signos (40 si es CJK)

3. El texto no está justificado

4. El espaciado entre líneas (interlineado) es de, al menos, un espacio y medio dentro de los

párrafos y el espacio entre párrafos es, al menos 1’5 veces mayor que el espacio entre líneas

5. El texto se ajusta sin ayudas técnicas hasta un 200 % de modo que no requiere un

desplazamiento horizontal para leer una línea de texto en una ventana a pantalla completa

En la presentación visual de bloques de texto, se proporciona algún mecanismo

para lograr lo siguiente:

1. Los colores de fondo y primer plano pueden ser elegidos por el usuario

2. El ancho no es mayor de 30 caracteres o signos (40 si es CJK)

3. El texto no está justificado

4. El espaciado entre líneas (interlineado) es de, al menos, un espacio y medio dentro de los

párrafos y el espacio entre párrafos es, al menos 1’5 veces mayor que el espacio entre líneas

5. El texto se ajusta sin ayudas técnicas hasta un 200 % de modo que no requiere un

desplazamiento horizontal para leer una línea de texto en una ventana a pantalla completa


Criterio de conformidad 1.4.8: Presentación visual

Criterio de conformidad 1.4.8: Presentación visual

AAA

Beneficiarios:

Objetivo: Asegurar que el texto se presenta visualmente de forma que se puede

percibir sin que su disposición interfiera con la legibilidad del mismo

1.4.8. Presentación visual1.4.8. Presentación visual

Asegurar que los usuarios pueden seleccionar el color de primer

plano y el color de fondo

AAA

Proporcionar en la página una

herramienta de selección de los

colores de primer plano y de fondo,

o

Usar una tecnología que

disponga de agentes de usuario de

uso común que permitan cambiar

el color de primer plano y del fondo

de los bloques de texto (si usamos

(X)HTML los navegadores ya

permiten esta funcionalidad)


Asegurar que el ancho no es mayor de 80 caracteres

No interferir en la reubicación del texto cuando se disminuye el

tamaño de la ventana (hasta ¼ parte del ancho de la pantalla).

Se trata de conseguir un ancho de línea ideal sin que se

produzca un desplazamiento horizontal para leer una línea de texto

Usar unidades de medida relativas para definir el ancho de los

contenedores principales del contenido textual de la página

Ej: Uso de % para la propiedad width en las CSS y unidades em

para la propiedad max-width en las CSS

Se pueden usar maquetaciones mixtas en las que se combinen

unidades absolutas para menús, columnas de anuncios, etc.

AAA


Asegurar que el texto no está justificado

Text-align: left; o tetx-align: right;

Asegurar que el espacio entre líneas es al menos de 1’5 dentro del

párrafo, y el espacio entre párrafos es al menos 1’5 veces mayor que

el espacio entre líneas

Especificar el espaciado entre líneas en la CSS (line-height entre 1’5

y 2 espacios)

Especificar el espaciado entre párrafos con sus márgenes en la CSS

(margin, margin-top, margin-bottom)

Ej: p {line-height: 150%; margin-bottom: 2em;}

AAA


Asegurar que se pueda redimensionar el texto sin ayudas técnicas

hasta un 200% de forma que no haya desplazamiento horizontal para

leer una línea de texto en una ventana a pantalla completa

Usar %, em o nombres para especificar el tamaño del texto

Usar % para el tamaño de los contenedores

AAA

Las imágenes de texto sólo se utilizan como simple

decoración o cuando una forma de presentación particular del

texto resulta esencial para la información transmitida.

Nota: Los logotipos se consideran esenciales

Las imágenes de texto sólo se utilizan como simple

decoración o cuando una forma de presentación particular del

texto resulta esencial para la información transmitida.

Nota: Los logotipos se consideran esenciales


Criterio de conformidad 1.4.9: Imágenes de texto (sin excepciones)

Criterio de conformidad 1.4.9: Imágenes de texto (sin excepciones)

AAA

Beneficiarios:

Objetivo: Crear presentaciones para formatos específicos de texto de forma que

los usuarios que necesiten una presentación determinada del texto la puedan

ajustar a sus necesidades

1.4.9. Imágenes de texto (sin excepciones)1.4.9. Imágenes de texto (sin excepciones)

Las mismas técnicas que para el criterio 1.2.4. pero sin contemplar el

uso de imágenes de texto para lograr presentaciones del texto no

reproducibles mediante CSS

AAA

Pauta 2.1: Accesible por tecladoPauta 2.2: Tiempo suficientePauta 2.3: ConvulsionesPauta 2.4: Navegable

Principio 2: Operable

Pauta 2.1: Accesible por teclado

Proporcionar acceso a toda la funcionalidad mediante el teclado

Toda la funcionalidad del contenido es operable a través de una interfaz

de teclado sin que se requiera una determinada velocidad para cada

pulsación individual de las teclas, excepto cuando la función interna

requiere de una entrada que depende del trayecto de los movimientos del

usuario y no sólo de los puntos inicial y final

Toda la funcionalidad del contenido es operable a través de una interfaz

de teclado sin que se requiera una determinada velocidad para cada

pulsación individual de las teclas, excepto cuando la función interna

requiere de una entrada que depende del trayecto de los movimientos del

usuario y no sólo de los puntos inicial y final

Pauta 2.1: Accesible por teclado Pauta 2.1: Accesible por teclado

Criterio de conformidad 2.1.1: Teclado

Criterio de conformidad 2.1.1: Teclado

A

Objetivo: Asegurar que, siempre que sea posible, se pueda operar el contenido a

través de teclado o de un interfaz de teclado (de forma que los usuarios puedan

usar un teclado alternativo)

Beneficiarios:

2.1.1. Teclado2.1.1. TecladoA

Al poder operarse mediante una interfaz de teclado los usuarios

podrán usar un teclado alternativo que se adapte a sus necesidades

aunque el dispositivo no disponga de teclado de forma nativa (teclado

acoplado, teclado en pantalla, etc.)

Para tener acceso al teclado en pantalla de Windows, ir a Inicio, hacer click en Ejecutar y escribir osk


Excepciones:

Dibujar a mano alzada (requiere una entrada dependiente del trazo)

Dibujar con acuarela (depende de una ruta y de la presión y/o velocidad

del trazo)

Pilotar un simulador de vuelo


Asegurar el control con el teclado usando enlaces y controles de

formulario estándar de (X)HTML

En los scripts y elementos de programación usar manejadores de

evento que puedan lanzarse mediante teclado

Usando funciones para el teclado además de para otros dispositivos

onkeydown equivale a onmousedown

onkeyup equivale a onmouseup

onfocus equivale a onmouseover

onblur equivale a onmouseout

dbclick y mousemove son específicos de ratón y deben evitarse

Usando el evento onclick de enlaces y botones para hacer las

acciones accesibles mediante teclado

Si es posible mover el foco a un componente de la página usando una

interfaz de teclado, entonces el foco se puede quitar de ese componente

usando sólo la interfaz de teclado y, si se requiere algo más que las teclas

de dirección o de tabulación, se informa al usuario el método apropiado

para mover el foco.

Si es posible mover el foco a un componente de la página usando una

interfaz de teclado, entonces el foco se puede quitar de ese componente

usando sólo la interfaz de teclado y, si se requiere algo más que las teclas

de dirección o de tabulación, se informa al usuario el método apropiado

para mover el foco.

Criterio de conformidad 2.1.2: Sin trampas para el foco de teclado

Criterio de conformidad 2.1.2: Sin trampas para el foco de teclado

A

Objetivo: Asegurar que la navegación mediante el tabulador no queda atrapada en

parte del contenido de la página

Beneficiarios:


2.1.2. Sin trampas para el foco de teclado2.1.2. Sin trampas para el foco de tecladoA

Asegurar que los usuarios no son atrapados en el contenido

Asegurar que la forma usada para avanzar el foco (generalmente la

tecla de tabulación) sale de la sección de contenido una vez que llega

al final de su navegación interna y sigue recorriendo normalmente el

resto de la página

Proporcionar una función de teclado para sacar el foco de la sección

de contenido. Se debe informar claramente, dentro de la sección de

contenido, sobre cuál es la forma de sacar el foco (tecla o combinación

de teclas)

Si la tecnología usada para incluir el contenido proporciona de forma

nativa un mecanismo de teclado para devolver el foco al elemento

padre (por ejemplo, la tecla ESC) entonces debemos documentarlo

para que los usuarios sepan cómo salir de la sección de contenido

Toda la funcionalidad del contenido se puede operar

a través de una interfaz de teclado sin requerir una

determinada velocidad en la pulsación de las teclas

Toda la funcionalidad del contenido se puede operar

a través de una interfaz de teclado sin requerir una

determinada velocidad en la pulsación de las teclas

Criterio de conformidad 2.1.3: Teclado (sin excepciones)Criterio de conformidad 2.1.3: Teclado (sin excepciones)

Objetivo: Asegurar que todo el contenido se puede manejar con un teclado o

interfaz de teclado

Beneficiarios:

AAA


2.1.3. Teclado (sin excepciones) 2.1.3. Teclado (sin excepciones) AAA

Seguir las técnicas indicadas en el criterio de conformidad 2.1.1.

Pauta 2.2: Tiempo suficiente

Proporcionar a los usuarios el tiempo suficiente para leer y usar el contenido

Para cada límite de tiempo impuesto por el contenido, se cumple al menos uno de los

siguientes casos:

Apagar: El usuario puede detener el límite de tiempo antes de alcanzar el límite de tiempo; o

Ajustar: El usuario puede ajustar el límite de tiempo antes de alcanzar dicho límite en un rango amplio que es, al

menos, diez veces mayor al tiempo fijado originalmente; o

Extender: Se advierte al usuario antes de que el tiempo expire y se le conceden al menos 20 seg para extender el

límite temporal con una acción simple y el usuario puede extender ese límite de tiempo al monos 10 veces; o

Excepción de tiempo real: El límite de tiempo es un requisito que forma parte de un evento de tiempo real y no

resulta posible ofrecer una alternativa al límite de tiempo; o

Excepción por ser esencial: El límite de tiempo es esencial, y si se extendiera invalidaría la actividad; o

Excepción de 20 horas: El límite de tiempo es mayor a 20h

Para cada límite de tiempo impuesto por el contenido, se cumple al menos uno de los

siguientes casos:

Apagar: El usuario puede detener el límite de tiempo antes de alcanzar el límite de tiempo; o

Ajustar: El usuario puede ajustar el límite de tiempo antes de alcanzar dicho límite en un rango amplio que es, al

menos, diez veces mayor al tiempo fijado originalmente; o

Extender: Se advierte al usuario antes de que el tiempo expire y se le conceden al menos 20 seg para extender el

límite temporal con una acción simple y el usuario puede extender ese límite de tiempo al monos 10 veces; o

Excepción de tiempo real: El límite de tiempo es un requisito que forma parte de un evento de tiempo real y no

resulta posible ofrecer una alternativa al límite de tiempo; o

Excepción por ser esencial: El límite de tiempo es esencial, y si se extendiera invalidaría la actividad; o

Excepción de 20 horas: El límite de tiempo es mayor a 20h

Pauta 2.2: Tiempo suficiente Pauta 2.2: Tiempo suficiente

Criterio de conformidad 2.2.1: Tiempo ajustable

Criterio de conformidad 2.2.1: Tiempo ajustable

A

Objetivo: Dar a los usuarios con discapacidad el tiempo suficiente para interactuar con la página web

Beneficiarios:

2.2.1. Tiempo ajustable2.2.1. Tiempo ajustableA

Excepciones:

Si el límite forma parte de un evento en tiempo real y no es posible

una alternativa. Ej: una subasta

Si el límite de tiempo se considera esencial y su modificación

invalidaría la actividad

Si el límite de tiempo es superior a 20h

Si existen límites de tiempo de sesiones

Proporcionar una casilla de verificación en la 1ª página de los

formularios de varios pasos que permita a los usuarios solicitar una

ampliación o desactivación del límite de tiempo


Si el límite de tiempo está controlado por un script:

Proporcionar un medio que permita configurar el límite de tiempo

hasta al menos 10 veces más que el límite de tiempo por defecto

Proporcionar un script que avise de que el límite de tiempo está a

punto de terminar y además permitir al usuario ampliar el límite

establecido por defecto.

El mensaje de aviso debe mostrarse al menos 20 seg. antes

Si existe un límite de tiempo de lectura

Proporcionar un mecanismo para que los usuarios puedan pausarlo y

reanudarlo desde donde se detuvo


Fallos comunes:

Usar redirecciones junto con un límite de tiempo

Usar actualizaciones periódicas de la página completa

Para la información que tiene movimiento, parpadeo, se desplaza o se actualiza

automáticamente, se cumplen todos los casos siguientes:

Movimiento, parpadeo, desplazamiento: Para toda información que se mueve, parpadea o se

desplaza, que (1) comienza automáticamente, (2) dura más de 5 seg. Y (3) se presenta en paralelo

con otro contenido, existe un mecanismo para que el usuario la pueda poner en pausa, detener y

ocultar, a menos que el movimiento, parpadeo o desplazamiento sea parte esencial de una

actividad, y

Actualización automática: Para toda información que se actualiza automáticamente, que (1) se

inicia automáticamente y (2) se presenta en paralelo con otro contenido, existe un mecanismo para

que el usuario la pueda poner en pausa, detener u ocultar, o controlar la frecuencia de actualización

a menos que la actualización automática sea parte esencial de una actividad

Para la información que tiene movimiento, parpadeo, se desplaza o se actualiza

automáticamente, se cumplen todos los casos siguientes:

Movimiento, parpadeo, desplazamiento: Para toda información que se mueve, parpadea o se

desplaza, que (1) comienza automáticamente, (2) dura más de 5 seg. Y (3) se presenta en paralelo

con otro contenido, existe un mecanismo para que el usuario la pueda poner en pausa, detener y

ocultar, a menos que el movimiento, parpadeo o desplazamiento sea parte esencial de una

actividad, y

Actualización automática: Para toda información que se actualiza automáticamente, que (1) se

inicia automáticamente y (2) se presenta en paralelo con otro contenido, existe un mecanismo para

que el usuario la pueda poner en pausa, detener u ocultar, o controlar la frecuencia de actualización

a menos que la actualización automática sea parte esencial de una actividad

Criterio de conformidad 2.2.2: Poner en pausa, detener, ocultar

Criterio de conformidad 2.2.2: Poner en pausa, detener, ocultar

A

Objetivo: Evitar que se distraigan los usuarios mientras interactúan con la página

Beneficiarios:


2.2.2. Poner en pausa, detener, ocultar2.2.2. Poner en pausa, detener, ocultarA

ExcepciónCasos donde el movimiento, parpadeo desplazamiento o actualización es

parte esencial para una actividad. Ej.: una animación de precarga de un

contenido

Permitir pausar y reanudar el contenido desde donde se detuvoPueden ser botones interactivos o atajos de teclado siempre que estén

debidamente documentados


Emplear un control en la página que permita parar el movimiento,

parpadeo o actualización automática del contenidoSe puede usar un único control para detener todo el contenido (situado al

principio de la página) o bien usar un control para cada parte del contenido con

movimiento, parpadeo o actualización (situado junto a él)

Proporcionar un enlace, botón u otro mecanismo para recargar la

página sin el contenido parpadeanteLa página sin el contenido parpadeante debe contener toda la información y

funcionalidad de la página original


Crear el contenido que parpadea de forma que dure menos de 5 seg. o

bien que lo puedan detener los usuariosConfigurar los GIF animados para que se detengan después de n ciclos

(antes de 5 segundos)

Utilizar scripts para controlar el parpadeo y detenerlo en 5 segundos o menos

setTimeout()

Utilizar una tecnología para incluir contenido parpadeante de forma que se

pueda detener usando el agente de usuario

Algunos navegadores permiten detener las imágenes PNG animadas

con la tecla ESC

Fallos comunes:Usar el elemento <blink>

Usar text-decoration:blink en las CSS

El tiempo no es parte esencial del evento o actividad

presentada por el contenido, exceptuando las

presentaciones multimedia no interactivas y los

eventos en tiempo real

El tiempo no es parte esencial del evento o actividad

presentada por el contenido, exceptuando las

presentaciones multimedia no interactivas y los

eventos en tiempo real

Criterio de conformidad 2.2.3: Sin tiempo

Criterio de conformidad 2.2.3: Sin tiempo

Objetivo: Reducir los contenidos que requieren interacciones con límites de tiempo

Beneficiarios:

AAA


2.2.3. Sin tiempo2.2.3. Sin tiempoAAA

Permitir a los usuarios completar una actividad sin límites de tiempo

El usuario puede postergar o suprimir interrupciones,

excepto cuando las interrupciones implican una

emergencia

El usuario puede postergar o suprimir interrupciones,

excepto cuando las interrupciones implican una

emergencia

Criterio de conformidad 2.2.4: Interrupciones

Criterio de conformidad 2.2.4: Interrupciones

Objetivo: Permitir a los usuarios detener las actualizaciones (de cliente o servidor)

excepto en el caso de emergencias

Beneficiarios:

AAA


2.2.4. Interrupciones2.2.4. InterrupcionesAAA

Proporcionar un mecanismo para posponer una actualización de

contenido

A través de una configuración de las preferencias de la página

Avisando a los usuarios de que se va a producir una actualización y

permitir que la puedan desactivar

Proporcionar un mecanismo para solicitar la actualización de los

contenidos en lugar de actualizar automáticamente

Incluir por ejemplo un enlace a la misma página (“Actualizar esta

página”)

No usar actualizaciones ni redirecciones con un límite de tiempo

2.2.4. Interrupciones2.2.4. InterrupcionesAAA

Si se usan alertas mediante scripts, permitir que las alertas no

esenciales sean opcionales

Botón, casilla de verificación o similar que active y desactive la

visualización de alertas no relacionadas con emergencias

(desactivadas por defecto)

Cuando expira una sesión autentificada, el usuario

puede continuar la actividad sin pérdida de datos

tras volver a identificarse

Cuando expira una sesión autentificada, el usuario

puede continuar la actividad sin pérdida de datos

tras volver a identificarse

Criterio de conformidad 2.2.5: Re-autentificación

Criterio de conformidad 2.2.5: Re-autentificación

Objetivo: Permitir completar transacciones autentificadas que tengan un límite de

inactividad u otra circunstancia que pueda causar la desconexión a mitad de la

transacción

Beneficiarios:

AAA


2.2.5. Re-autentificación 2.2.5. Re-autentificación AAA

Guardar la información de modo que pueda ser utilizada después de

que el usuario haya vuelto a autentificarse

Almacenar los datos temporalmente en el servidor

Cuando el usuario se haya reautentificado, recuperar los datos de la

caché y procesar el formulario como si no se hubiese terminado la

sesión

Codificar los datos del usuario como ocultos o encriptados en una

página de reautentificación

Si almacenar la información del usuario en un servidor supone un

riesgo legal o de seguridad o no hay capacidad técnica para el

almacenamiento de datos:Pasar la información como datos ocultos a la página de reautentificación

Pauta 2.3: Convulsiones

No diseñar contenido de un modo que se sepa podría provocar ataques, espasmos o

convulsiones

Las páginas web no contienen nada que destelle

más de tres veces en un segundo, o el destello está

por debajo del umbral de destello general y de

destello rojo


más de tres veces en un segundo, o el destello está

por debajo del umbral de destello general y de

destello rojo

Pauta 2.3: Convulsiones Pauta 2.3: Convulsiones

Criterio de conformidad 2.3.1: Umbral de 3 destellos o menos

Criterio de conformidad 2.3.1: Umbral de 3 destellos o menos

A

Objetivo: Permitir que los usuarios accedan a todo el contenido sin que

éste les cause ataques fotosensitivos

Beneficiarios: Personas con trastornos fotosensitivos

2.3.1. Umbral de 3 destellos o menos 2.3.1. Umbral de 3 destellos o menos A

Asegurar que ningún contenido tiene destellos con una frecuencia

superior a 3 destellos por segundo

Para calcular el nº de destellos se cuentan los cambios de luz a

oscuridad y viceversa y se dividen entre dos.

Mantener el área con destellos lo suficientemente pequeña

El área segura se corresponde con un 25% de un campo de visión de

10º a una distancia habitual de visionado

Para una resolución estándar de 1024x768 píseles y a una

distancia de visión entre 11 y 26 pulgadas se corresponde a un

cuadrado de 148 píxeles de lado


más de tres veces en un segundo


más de tres veces en un segundo

Criterio de conformidad 2.3.2: Tres destellos

Criterio de conformidad 2.3.2: Tres destellos

Objetivo: Reducir al máximo las posibilidades de producir ataques

Beneficiarios: Personas con trastornos fotosensitivos

AAA

Pauta 2.3: Convulsiones Pauta 2.3: Convulsiones

Pauta 2.4: Navegable

Proporcionar medios para ayudar a los usuarios a navegar, encontrar contenido y

determinar dónde se encuentran

Existe un mecanismo para evitar los bloques

de contenido que se repiten en múltiples

páginas web

Existe un mecanismo para evitar los bloques

de contenido que se repiten en múltiples

páginas web

Pauta 2.4: Navegable Pauta 2.4: Navegable

Criterio de conformidad 2.4.1: Evitar bloques

Criterio de conformidad 2.4.1: Evitar bloques

A

Objetivo: Permitir a quienes naveguen de forma secuencial acceder de

forma directa al contenido principal

Beneficiarios:

2.4.1. Evitar bloques2.4.1. Evitar bloquesA

Agrupar los bloques de material repetido de forma que se puedan

saltar

Proporcionar elementos de encabezado al comienzo de cada sección

del contenido

Los lectores de pantalla permiten obtener un mapa del

documento en base a los encabezados y navegar usando ese

mapa. Y también permiten saltar entre los encabezados

Agrupar enlaces mediante elementos estructurales

Utilizar listas <ul> u <ol>, o el elemento <map> para identificar

los listados de enlaces como menús de navegación (luego se

pueden utilizar estilos para obtener el aspecto visual deseado)


Cuando empleemos marcos para agrupar bloques de material

repetido, usar el atributo title de los elementos <frame> e <iframe>

para identificar su contenido

No se recomienda el uso de marcos para estructurar o presentar

las páginas

Usar un menú desplegable para saltar bloques de contenido repetido

Cuando el menú esté desplegado, su contenido debe poder

determinarse por software y estar situado en un orden de lectura

correcto

Cuando el menú esté colapsado, su contenido no debe ser

visible para los agentes de usuario y productos de apoyo


Podemos usar DOM scripting para generar el contenido y para

eliminarlo

También la propiedad display de CSS (con los valores block y

none)

O implementar el menú desplegable mediante scripts de servidor y

recargar una versión modificada de la página, u otra página, cuando

despleguemos o colapsemos el menú

Crear enlaces para saltar bloques de material repetido

Enlace al comienzo que vaya al área del contenido principal

Debe ser el primer elemento en recibir el foco

Debe ser siempre visible o, al menos, ser visible cuando recibe el

foco


Enlaces de salto al comienzo de bloques de contenido repetido para

ir al final del bloque

Han de estar situados justo antes de los bloques de contenido

repetido

Deben ser siempre visibles o, al menos, ser visibles cuando

reciben el foco

Enlaces al comienzo de la página que vayan a cada área de

contenido

Han de ser los primeros controles del documento, a modo de

tabla de contenidos

Deben ser siempre visibles o, al menos, ser visibles cuando

reciben el foco

Las páginas web tienen títulos que describen

su temática o propósito

Las páginas web tienen títulos que describen

su temática o propósito

Criterio de conformidad 2.4.2: Titulado de páginas

Criterio de conformidad 2.4.2: Titulado de páginas

A

Objetivo: Ayudar a los usuarios a encontrar el contenido y orientarse

asegurándonos que cada página tiene un título descriptivo

Beneficiarios:


2.4.2. Titulado de páginas2.4.2. Titulado de páginasA

Proporcionar títulos descriptivos para las páginas web mediante el

elemento <title>

El título ha de identificar el contenido de la página web

Ha de tener sentido fuera de contexto

Ha de ser corto

Se recomienda que identifique el sitio web al que pertenece la página

Si se puede navegar secuencialmente por una página web y

la secuencia de navegación afecta su significado o su

operación, los componentes que pueden recibir el foco lo

hacen en un orden que preserva su significado y operatividad

Si se puede navegar secuencialmente por una página web y

la secuencia de navegación afecta su significado o su

operación, los componentes que pueden recibir el foco lo

hacen en un orden que preserva su significado y operatividad

Criterio de conformidad 2.4.3: Orden del foco

Criterio de conformidad 2.4.3: Orden del foco

A

Objetivo: Asegurar que los usuarios pueden interactuar mediante el

teclado, navegar secuencialmente por el contenido y encontrar la

información en el orden correctoBeneficiarios:


2.4.3. Orden del foco2.4.3. Orden del focoA

Ubicar los elementos de interacción en un orden que siga las

secuencias y las relaciones del contenido

Organizar el contenido en el código (X)HTML de forma que el orden

por defecto sea el correcto

Si cambiamos el orden del foco por defecto, crear un orden lógico que

siga las secuencias y relaciones del contenido

En (X)HTML usaremos el atributo tabindex en aquellos elementos

de interacción para los que queramos modificar su ordenValor entre 0 y 32767

1º se tabulan los elementos con un valor de tabindex>0, siguiendo el

orden de sus valores

2º, los elementos sin tabindex o =0, siguiendo el orden en el código

2.4.3. Orden del foco2.4.3. Orden del focoA

Si cambiamos una página dinámicamente, hacerlo de forma que el

orden del foco siga teniendo sentido

Debemos insertar el contenido dinámico en el DOM justo a

continuación del elemento que lo lanza (enlace o botón).

El evento que lo lanza debe ser onclick

Al cerrar un contenido dinámico (menú o diálogo) hay que devolver el

foco al siguiente elemento

El propósito de cada enlace puede ser determinado con sólo

el texto del enlace o a través del texto del enlace sumado al

contexto del enlace determinado por software, excepto

cuando el propósito del enlace resultara ambiguo para los

usuarios en general

El propósito de cada enlace puede ser determinado con sólo

el texto del enlace o a través del texto del enlace sumado al

contexto del enlace determinado por software, excepto

cuando el propósito del enlace resultara ambiguo para los

usuarios en general

Criterio de conformidad 2.4.4: Propósito de los enlaces (en contexto)

Criterio de conformidad 2.4.4: Propósito de los enlaces (en contexto)

A

Objetivo: Ayudar a los usuarios a comprender el propósito de cada enlace

de forma que puedan decidir seguir el enlace o no

Beneficiarios:


2.4.4. Propósito de los enlaces (en contexto)2.4.4. Propósito de los enlaces (en contexto)

A

Usar el propio texto del enlace para describir su propósito

Usar un texto descriptivo para los elementos <a>

Usar alternativas textuales (atributo alt) descriptivas para los

elementos <area> de los mapas de imagen

Proporcionar una descripción adicional al texto del enlace

Usar CSS para ocultar parte del texto del enlace (posicionar de forma

absoluta el elemento fuera de la pantalla), pero visible para los lectores

de pantalla

Complementar el texto del enlace con el atributo title

Avisar de la apertura de nuevas ventanas

Informar sobre el formato del documento de destino


A

Identificar el propósito del enlace usando su texto combinado con el

texto de la frase que lo contiene

La información de contexto debe estar situada antes de los enlaces

Identificar el propósito del enlace usando el texto del enlace

combinado con el contexto determinado por software

Elemento de lista (<li>) que contiene el enlace

En listas anidadas, elemento de la lista padre (<li>) que contiene la

lista en la que se encuentra el enlace

Párrafo (<p>) que contiene el enlace

Celda (<td>) de la tabla que contiene al enlace y sus encabezados

asociados (<th>)

Elemento de encabezado anterior (<h1> - <h6>)


A

Permitir a los usuarios escoger entre enlaces largos o cortos

Ofrecer dos versiones de la página, una en la que los textos de los

enlaces sean cortos y otra con textos descriptivos

Utilizar un control al comienzo de la página que permita cambiar el

texto de los enlaces:

Usando CSS alternativas

Usando scripts para cambiar el texto de los enlaces

Se recomienda guardar las preferencias del usuario

Se proporciona más de un camino para localizar una

página web dentro de un conjunto de páginas web,

excepto cuando la pátina es el resultado, o un paso

intermedio, de un proceso

Se proporciona más de un camino para localizar una

página web dentro de un conjunto de páginas web,

excepto cuando la pátina es el resultado, o un paso

intermedio, de un proceso

Criterio de conformidad 2.4.5: Múltiples vías

Criterio de conformidad 2.4.5: Múltiples vías

Objetivo: Asegurar que los usuarios puedan localizar el contenido de la

forma que mejor satisfaga sus necesidades

Beneficiarios:

AA


2.4.5. Múltiples vías2.4.5. Múltiples víasAA

(cumplir 2 ó más técnicas)

Proporcionar enlaces a páginas relacionadas

Proporcionar una tabla de contenidos de los documentos

Menú de enlaces a secciones y subsecciones en el mismo

documento

Proporcionar un mapa del sitio

Ha de incluir enlaces a las diferentes secciones del sitio web

Debe estar enlazado, al menos, desde cada una de las páginas que

se listan en el mapa web

Todas las páginas del sitio web debe ser accesibles, directa o

indirectamente, desde el mapa web

2.4.5. Múltiples vías2.4.5. Múltiples víasAA

Proporcionar funciones de búsqueda

Campo de búsqueda presente en todas las páginas del sitio o página

propia para el buscador y sus opciones

Si es posible, proporcionar una búsqueda avanzada

Por diferentes secciones del sitio web

Por tipologías de contenido

Con corrección ortográfica

Por sinónimos, terminaciones de palabras similares, similitud

entre palabras

Proporcionar una lista de enlaces al resto de páginas web

Enlazar a todas las páginas del sitio desde la página de inicio

Los encabezados y etiquetas describen

el tema o propósito

Los encabezados y etiquetas describen

el tema o propósito

Criterio de conformidad 2.4.6: Encabezados y etiquetas

Criterio de conformidad 2.4.6: Encabezados y etiquetas

Objetivo: Ayudar a los usuarios a comprender qué información está

contenida en la página web y cómo se organiza dicha información

Beneficiarios:

AA


2.4.6. Encabezados y etiquetas2.4.6. Encabezados y etiquetasAA

Proporcionar encabezados significativos

Han de identificar la sección de contenido que encabezan

Han de ser claros y breves

Proporcionar etiquetas significativas para los elementos de

interacción de la página

Cualquier interfaz de usuario operable por

teclado tiene una forma de operar en la cual el

indicador del foco del teclado resulta visible

Cualquier interfaz de usuario operable por

teclado tiene una forma de operar en la cual el

indicador del foco del teclado resulta visible

Criterio de conformidad 2.4.7: Foco visible

Criterio de conformidad 2.4.7: Foco visible

Objetivo: Asegurar que el indicador del foco del teclado se puede localizar

visualmente

Beneficiarios:

AA


2.4.7. Foco visible2.4.7. Foco visibleAA

Usar componentes de interfaz de usuario que son resaltados por el

agente de usuario al recibir el foco

Usar el indicador de foco por defecto de la plataforma

Crear un indicador de foco altamente visible

Usando CSS para modificar la presentación de un componente de

interfaz de usuario cuando recibe el foco

Modificando el color de fondo o los bordes mediante las

pseudoclases :over, :active, :focus

Usando scripts para cambiar el color de fondo o bordes de los

elementos con foco

Se proporciona información acerca de la

ubicación del usuario dentro de un conjunto

de páginas web

Se proporciona información acerca de la

ubicación del usuario dentro de un conjunto

de páginas web

Criterio de conformidad 2.4.8: Ubicación

Criterio de conformidad 2.4.8: Ubicación

Objetivo: Proporcionar un mecanismo para que el usuario sea capaz de

orientarse respecto a un conjunto de páginas, un sitio web o una

aplicación web y sea capaz de encontrar información relacionadaBeneficiarios:

AAA


2.4.8. Ubicación2.4.8. UbicaciónAAA

Migas de pan

Permiten indicar la ubicación actual de una página pudiendo navegar

jerárquicamente por la estructura que la contiene

Están formadas por enlaces y han de estar situadas en el mismo

lugar en todas las páginasSe pueden usar separadores visuales

Se pueden estructurar mediante listas usando la propiedad de CSS

display:inline para mostrarlas en una línea

Mapa del sitio

Indicar la situación actual dentro de las barras de navegación

Usar iconos, textos o cambios de forma o estado del elemento actual

en menús, pestañas, pasos de un proceso, etc.

2.4.8. Ubicación2.4.8. UbicaciónAAA

En una colección de páginas relacionadas, indicar la relación con la

página actual

En X(HTML) el elemento <link> sirve para enlazar entre sí una

colección de documentos relacionados, y con el atributo rel podemos

indicar el tipo de vínculo existente: start, next, prev, contents, index,

glossary, chapter, section, subsection, appendix, help

En vez de link se puede usar el título de la página <title> para indicar

su relación con el resto (puede incluir el nombre de cada sección)

Se proporciona un mecanismo que permite

identificar el propósito de cada enlace con sólo el

texto del enlace, excepto cuando el propósito del

enlace resultara ambiguo para los usuario en

general

Se proporciona un mecanismo que permite

identificar el propósito de cada enlace con sólo el

texto del enlace, excepto cuando el propósito del

enlace resultara ambiguo para los usuario en

general

Criterio de conformidad 2.4.9: Propósito de los enlaces (sólo enlaces)

Criterio de conformidad 2.4.9: Propósito de los enlaces (sólo enlaces)

Objetivo: Ayudar a los usuarios a comprender el propósito de cada enlace

del contenido, sin depender del contexto

Beneficiarios:

AAA


2.4.9. Propósito de los enlaces (sólo enlaces)2.4.9. Propósito de los enlaces (sólo enlaces)

AAA

Usar el propio texto del enlace para describir su propósito

Proporcionar una descripción adicional al texto del enlace

Permitir a los usuarios escoger entre enlaces largos o cortos

Se usan encabezados de sección

para organizar el contenido

Se usan encabezados de sección

para organizar el contenido

Criterio de conformidad 2.4.10: Encabezados de sección

Criterio de conformidad 2.4.10: Encabezados de sección

Objetivo: Proporcionar encabezados para las secciones de una página

web, cuando ésta se organiza en secciones

Beneficiarios:

AAA


2.4.10. Encabezados de sección2.4.10. Encabezados de secciónAAA

Organizar una página usando encabezados

Pauta 3.1: LegiblePauta 3.2: PredeciblePauta 3.3: Entrada de datos asistida

Principio 3: Comprensible

Pauta 3.1: Legible

Hacer que los contenidos textuales resulten legibles y comprensibles

El idioma predeterminado de cada

página web puede ser determinado por

software

El idioma predeterminado de cada

página web puede ser determinado por

software

Pauta 3.1: Legible Pauta 3.1: Legible

Criterio de conformidad 3.1.1: Idioma de la página

Criterio de conformidad 3.1.1: Idioma de la página

A

Objetivo: Proporcionar la información necesaria para que los agentes de

usuarios puedan presentar el texto y otro contenido lingüístico de forma

correctaBeneficiarios:

3.1.1. Idioma de la página3.1.1. Idioma de la páginaAAA

Identificar el idioma del documento mediante el uso de los atributos

lang y/o xml:lang

En HTML usar el atributo lang y un código de idioma

En XHTML 1.0 servido como text/html usar xml:lang junto con lang

En XHTML 1.0 y 1.1 servido como XML usar sólo xml:lang

El idioma de cada pasaje o frase en el contenido puede ser

determinado por software, excepto los nombres propios,

términos técnicos, palabras en un idioma indeterminado y

palabras o frases que se hayan convertido en parte natural

del texto que las rodea

El idioma de cada pasaje o frase en el contenido puede ser

determinado por software, excepto los nombres propios,

términos técnicos, palabras en un idioma indeterminado y

palabras o frases que se hayan convertido en parte natural

del texto que las rodea


Criterio de conformidad 3.1.2: Idioma de las partes

Criterio de conformidad 3.1.2: Idioma de las partes

Objetivo: Asegurar que los agentes de usuario y productos de apoyo

presentan correctamente el contenido en múltiples idiomas

Beneficiarios:

AA

3.1.2. Idioma de las partes3.1.2. Idioma de las partesAAA

Identificar los cambios de idioma respecto al principal mediante el

uso de los atributos lang y/o xml:lang

Excepciones: los nombres propios, términos técnicos y títulos o

términos de uso común (adoptados en el idioma) con pronunciación

similar en el idioma principal del documento

Se proporciona un mecanismo para identificar las

definiciones específicas de palabras o frases usadas

de modo inusual o restringido, incluyendo

expresiones idiomáticas y jerga

Se proporciona un mecanismo para identificar las

definiciones específicas de palabras o frases usadas

de modo inusual o restringido, incluyendo

expresiones idiomáticas y jerga

Criterio de conformidad 3.1.3: Palabras inusuales

Criterio de conformidad 3.1.3: Palabras inusuales

Objetivo: Favorecer la comprensión del documento a personas con

dificultad para entender el uso de palabras de forma no literal, usos o

palabras especializadas, el lenguaje figurado y otros usos especializadosBeneficiarios:

AAA


3.1.3. Palabras inusuales3.1.3. Palabras inusualesAAA

Si la palabra o frase tiene un significado único en la página web,

proporcionar la definición la 1ª vez que aparezca

Usar un enlace a la definición

Crear definiciones usando listas de definición: <dt> (término) y

<dd> (definición)

Utilizar el elemento <link> con el atributo rel=“glossary” para

enlazar con el glosario

Proporcionar definiciones en línea, en el propio texto de la página

Podemos indicar que un término tiene una definición asociada si

lo marcamos con el elemento <dfn>

Glosario

Función de búsqueda en un diccionario online

3.1.3. Palabras inusuales3.1.3. Palabras inusualesAAA

Si la palabra o frase tiene varios significados en la página web,

proporcionar la definición cada vez que aparezca



No se puede usar un Glosario

No se puede usar una función de búsqueda en un diccionario online

Se proporciona un mecanismo para identificar

la forma expandida o el significado de las

abreviaturas

Se proporciona un mecanismo para identificar

la forma expandida o el significado de las

abreviaturas

Criterio de conformidad 3.1.4: Abreviaturas

Criterio de conformidad 3.1.4: Abreviaturas

Objetivo: Asegurarnos que los usuarios pueden conocer la expansión de

las formas abreviadas

Beneficiarios:

AAA


3.1.4. Abreviaturas3.1.4. AbreviaturasAAA

Si la abreviatura tiene un significado único en la página web,

proporcionar la expansión o explicación la 1ª vez que aparezca

En el texto, antes de la forma abreviada


Mediante los elementos <abbr> y <acronym>

La expansión se proporciona en el atributo title de dichos

elementos

Glosario

Función de búsqueda en un diccionario online

3.1.4. Abreviaturas3.1.4. AbreviaturasAAA

Si la abreviatura tiene varios significados en la página web,

proporcionar la expansión o explicación cada vez que aparezca



No se puede usar un Glosario

No se puede usar una función de búsqueda en un diccionario online

Cuando un texto requiere un nivel de lectura más avanzado

que el nivel mínimo de educación secundaria una vez que se

han eliminado nombres propios y títulos, se proporciona un

contenido suplementario o una versión que no requiere un

nivel de lectura mayor a ese nivel educativo

Cuando un texto requiere un nivel de lectura más avanzado

que el nivel mínimo de educación secundaria una vez que se

han eliminado nombres propios y títulos, se proporciona un

contenido suplementario o una versión que no requiere un

nivel de lectura mayor a ese nivel educativo

Criterio de conformidad 3.1.5: Nivel de lectura

Criterio de conformidad 3.1.5: Nivel de lectura

Objetivo: Asegurar que existe contenido adicional para comprender textos

complejos y difíciles y establecer una medida testeable para saber cuándo

es necesario ese contenido adicionalBeneficiarios:

AAA


3.1.5. Nivel de lectura3.1.5. Nivel de lecturaAAA

Ilustraciones o imágenes que ayuden a explicar ideas, procesos, etc

Resumen del texto de forma que requiera un nivel de lectura menor

Proporcionar un resumen breve con la información e ideas más

importantes

Hacer el texto más fácil de leer

Limitar los párrafos a una única idea principal

Utilizar oraciones cortas y con una estructura sencilla

Dividir las frases largas en dos

Evitar frases con más de dos conjunciones y subordinadas

Emplear palabras sencillas y relativas al lenguaje cotidiano


Evitar el uso de jergas

No emplear palabras en otro idioma

Eliminar palabras redundantes que no afectan al significado

Usar verbos precisos para describir acciones

Usar preferiblemente la voz activa a la pasiva

No emplear el subjuntivo

Versión hablada de textoContenido estático: proporcionar una lectura en voz del texto o bien una

sintetización automática (indicar el formato en el enlace del archivo)

Contenido dinámico: Proporcionar un método de servidor para ofrecer la

versión hablada


Versiones en lengua de señas de la información, ideas y procesos

que deban ser entendidos para usar el contenido

Se proporciona un mecanismo para identificar la

pronunciación específica de las palabras cuando el

significado de esas palabras, dentro del contexto, resulta

ambiguo si no se conoce su pronunciación

Se proporciona un mecanismo para identificar la

pronunciación específica de las palabras cuando el

significado de esas palabras, dentro del contexto, resulta

ambiguo si no se conoce su pronunciación

Criterio de conformidad 3.1.6: Pronunciación

Criterio de conformidad 3.1.6: Pronunciación

Objetivo: Ayudar a personas ciegas, con baja visión o con dificultades de

lectura a comprender el contenido cuando su significado depende de la

pronunciaciónBeneficiarios:

AAA


3.1.6. Pronunciación3.1.6. PronunciaciónAAA

Indicar la pronunciación tras la palabraEntre paréntesis

Enlazar a las pronunciaciones

Glosario

Indicar la pronunciación usando una técnica específica de las

siguientes:

Elemento <ruby> de XHTML 1.1<rb> indica el texto original, <rt> indica la pronunciación y <rp> indica entre

paréntesis la pronunciación para aquellos agentes de usuario que no soporten

el elemento <ruby>

Marcas diacríticas

Pauta 3.2: Predecible

Hacer que las páginas web aparezcan y operen de manera predecible

Cuando cualquier componente recibe el

foco, no inicia ningún cambio en el

contexto

Cuando cualquier componente recibe el

foco, no inicia ningún cambio en el

contexto

Pauta 3.2: Predecible Pauta 3.2: Predecible

Criterio de conformidad 3.2.1: Al recibir el foco

Criterio de conformidad 3.2.1: Al recibir el foco

A

Objetivo: Asegurar que la funcionalidad es predecible cuando se navega

por los documentos

Beneficiarios:

3.2.1. Al recibir el foco3.2.1. Al recibir el focoA

Usar una acción en vez del foco para cambios de contexto

Por ejemplo hacer click en un enlace o presionar un botón de envío

El cambio de estado en cualquier componente de la

interfaz de usuario no provoca automáticamente un

cambio en el contexto a menos que el usuario haya

sido advertido de ese comportamiento antes de usar

el componente

El cambio de estado en cualquier componente de la

interfaz de usuario no provoca automáticamente un

cambio en el contexto a menos que el usuario haya

sido advertido de ese comportamiento antes de usar

el componente

Criterio de conformidad 3.2.2: Al recibir entradas

Criterio de conformidad 3.2.2: Al recibir entradas

A

Objetivo: Asegurar que introducir datos o seleccionar un control tiene

efectos predecibles

Beneficiarios:


3.2.2. Al recibir entradas3.2.2. Al recibir entradasA

Usar un botón de envío para iniciar un cambio de contexto

Botón de envío en HTML para enviar formularios

<input> tipo “submit” o “image”, <button> tipo “submit”

Botón junto a <select> para realizar una acción

Evitar los eventos onfocus y onchange porque provocan un cambio

de contexto no esperado y se disparan al navegar entre las opciones

mediante teclado

Describir previamente lo que ocurrirá

Si no incluimos botón de envío, debemos incluir una descripción de lo

que ocurrirá antes de que el control de formulario provoque el cambio

de contexto

Los mecanismos de navegación que se repiten en

múltiples páginas web dentro de un conjunto de

páginas web aparecen siempre en el mismo orden

relativo cada vez que se repiten, a menos que el

cambio sea provocado por el propio usuario

Los mecanismos de navegación que se repiten en

múltiples páginas web dentro de un conjunto de

páginas web aparecen siempre en el mismo orden

relativo cada vez que se repiten, a menos que el

cambio sea provocado por el propio usuario

Criterio de conformidad 3.2.3: Navegación coherente

Criterio de conformidad 3.2.3: Navegación coherente

Objetivo: Asegurar que la presentación y la maquetación son consistentes

a lo largo de todo el sitio web

Beneficiarios:

AA


3.2.3. Navegación coherente3.2.3. Navegación coherenteAA

Mantener el mismo orden relativo para los elementos que se repitan a

lo largo del sitio

Los componentes que tienen la misma funcionalidad

dentro de un conjunto de páginas web son

identificados de manera coherente

Los componentes que tienen la misma funcionalidad

dentro de un conjunto de páginas web son

identificados de manera coherente

Criterio de conformidad 3.2.4: Identificación coherente

Criterio de conformidad 3.2.4: Identificación coherente

Objetivo: Identificar de forma consistente los componentes funcionales que

se repiten en un conjunto de páginas web. Si la misma función tiene

diferentes etiquetas a lo largo del sitio, el sitio es mucho más difícil de usarBeneficiarios:

AA


3.2.4. Identificación coherente3.2.4. Identificación coherenteAA

Etiquetas, nombres y alternativas textuales consistentes para

contenido con la misma funcionalidad

Usar las mismas etiquetas para los mismos controles de formulario

En los enlaces usar el mismo texto para el mismo destino

Usar textos consistentes para destinos similares

Los cambios en el contexto son iniciados

únicamente a solicitud del usuario o se proporciona

un mecanismo para detener tales cambios

Los cambios en el contexto son iniciados

únicamente a solicitud del usuario o se proporciona

un mecanismo para detener tales cambios

Criterio de conformidad 3.2.5: Cambios a petición

Criterio de conformidad 3.2.5: Cambios a petición

Objetivo: Evitar la confusión que producen los cambios de contexto

inesperados dando a los usuarios un control total sobre los mismos

Beneficiarios:

AAA


3.2.5. Cambios a petición3.2.5. Cambios a peticiónAAA

Mecanismo para solicitar actualizaciones de página

Redirecciones de página transparentes a los usuarios

Redirecciones automáticas de servidor (preferibles)

Redirecciones en el cliente instantáneas

Avisar de la apertura de ventanas emergentes

Usar el atributo target y avisar en el texto del enlace

La apertura de nuevas ventanas del navegador siempre bajo

petición de los usuarios

Scripts como mejora progresiva

El código del script lo enlazaremos desde la cabecera y lo

cargaremos junto con el documento mediante el evento onload

3.2.5. Cambios a petición3.2.5. Cambios a peticiónAAA

Evento onchange en un elemento <select> sin provocar un cambio de

contexto

Pauta 3.3: Entrada de datos asistida

Ayudar a los usuarios a evitar y corregir los errores

Si se detecta automáticamente un error en la

entrada de datos, el elemento erróneo es

identificado y el error se describe al usuario

mediante un texto


entrada de datos, el elemento erróneo es

identificado y el error se describe al usuario

mediante un texto

Pauta 3.3: Entrada de datos asistida Pauta 3.3: Entrada de datos asistida

Criterio de conformidad 3.3.1: Identificación de errores

Criterio de conformidad 3.3.1: Identificación de errores

A

Objetivo: Asegurar que los usuarios se percatan de que se ha producido

un error y dónde

Beneficiarios:

3.3.1. Identificación de errores3.3.1. Identificación de erroresA

Proporcionar descripciones textuales que identifiquen los campos no

completados

Validar en el lado del cliente y mostrar un mensaje en texto o una

ventana de alerta con la información necesaria

Validar en el lado del servidor y mostrar de nuevo el formulario

informando al inicio cuáles son los campos que faltan por completar.En el formulario se deben incluir todos los datos que ya se han

introducido correctamente

Proporcionar un texto descriptivo que indique al usuario que ha

introducido un dato que no está en la lista de valores permitidos

Validar (cliente y/o servidor) e informar mediante texto de los errores

existentes, al comienzo del formulario


Describir la naturaleza del problema y proporcionar un medio para

localizar rápidamente los campos con error

Si es posible, indicar los valores posibles o sugerir un valor de entre

los permitidos que se asemeje al introducido

Proporcionar un texto descriptivo que indique al usuario que ha

introducido un dato que no cumple el formato requerido

Describir el error, cómo es el formato requerido y dar instrucciones

para introducir el dato de forma correcta

Si es posible, dar ejemplos de datos correctos y sugerir algunos

posibles similares al introducido


Ventana de alerta avisando del error cuando se usa validación de

cliente

Avisar de los errores mediante el uso del DOM cuando se usa

validación de cliente

Se proporcionan etiquetas o instrucciones

cuando el contenido requiere la introducción

de datos por parte del usuario

Se proporcionan etiquetas o instrucciones

cuando el contenido requiere la introducción

de datos por parte del usuario


Criterio de conformidad 3.3.2: Etiquetas o instrucciones

Criterio de conformidad 3.3.2: Etiquetas o instrucciones

A

Objetivo: Evitar que se produzcan errores al introducir datos

Beneficiarios:

3.3.2. Etiquetas o instrucciones3.3.2. Etiquetas o instruccionesA

Proporcionar etiquetas descriptivas

Indicar el formato de los datos y un ejemplo

Proporcionar instrucciones textuales al comienzo del formulario o

grupo de controles describiendo las restricciones de los campos

Situar las etiquetas de forma que las relaciones sean obviasPara los botones de radio y casillas de verificación, inmediatamente a

continuación

Para el resto, antes del campo

Proporcionar descripciones textuales que identifiquen los campos no

completados


Usar elementos <label> para asociar las etiquetas con los controles

de formulario mediante el atributo for

Se usa para los elementos <textarea>, <select> e <input> de tipo

“text”, “checkbox”, “radio”, “file” y “password”

El elemento <label> se sitúaAntes del control para elementos <input> de tipo “text”, “file”, “password”

y para <textarea> y <select>

Después del control para elementos <input> de tipo “checkbox” y “radio”

Usar el atributo title para identificar los controles de formulario

cuando no se pueda usar el elemento <label>


Proporcionar una descripción de los grupos de controles de

formulario usando los elementos <fieldset> y <legend>

El elemento <fieldset> muestra por defecto una línea que rodea a los

controles para que se puedan reconocer visualmente. Su presentación

se puede modificar con CSS

Usar un botón adyacente para identificar el propósito del campo

Por ejemplo el botón del buscador puede servir como etiqueta


entrada de datos y se dispone de sugerencias para

hacer la corrección, entonces se presentan las

sugerencias al usuario, a menos que esto ponga en

riesgo la seguridad o el propósito del contenido


entrada de datos y se dispone de sugerencias para

hacer la corrección, entonces se presentan las

sugerencias al usuario, a menos que esto ponga en

riesgo la seguridad o el propósito del contenido


Criterio de conformidad 3.3.3: Sugerencias ante errores

Criterio de conformidad 3.3.3: Sugerencias ante errores

Objetivo: Asegurar, siempre que sea posible que los usuarios reciben

sugerencias adecuadas para corregir errores al introducir datosBeneficiarios:

AA

3.3.3. Sugerencias ante errores3.3.3. Sugerencias ante erroresAA

Sugerir un texto con la corrección

Correcciones ortográficas

Valor similar dentro de un conjunto de valores posibles

Preguntas adicionales para refinar datos ambiguos

Alternativas similares para evitar repetición de valores

Para las páginas web que representan para el usuario compromisos legales o

transacciones financieras; que modifican o eliminan datos controlables por el

usuario en sistemas de almacenamiento de datos; o que envían las respuestas del

usuario a una prueba, se cumple al menos uno de los siguientes casos:

Reversible : El envío es reversible

Revisado: Se verifica la información para detectar errores en la entrada de datos y se

proporciona al usuario una oportunidad de corregirlos

Confirmado: Se proporciona un mecanismo para revisar, confirmar y corregir la información antes

de finalizar el envío de los datos

Para las páginas web que representan para el usuario compromisos legales o

transacciones financieras; que modifican o eliminan datos controlables por el

usuario en sistemas de almacenamiento de datos; o que envían las respuestas del

usuario a una prueba, se cumple al menos uno de los siguientes casos:


Revisado: Se verifica la información para detectar errores en la entrada de datos y se

proporciona al usuario una oportunidad de corregirlos

Confirmado: Se proporciona un mecanismo para revisar, confirmar y corregir la información antes

de finalizar el envío de los datos


Criterio de conformidad 3.3.4: Prevención de errores (legales, financieros, datos)

Criterio de conformidad 3.3.4: Prevención de errores (legales, financieros, datos)

Objetivo: Evitar graves consecuencias como resultado de un error al

realizar una acción que no se puede deshacerBeneficiarios:

AA

3.3.4. Prevención de errores (legales, financieros, datos)


AA

En transacciones de carácter legal o económico

Ofrecer un período de tiempo tras el envío durante el cual se pueda

modificar o cancelar por el usuario

Informar del tiempo disponible para realizar las modificaciones

Describir el proceso necesario para modificar o cancelar el

pedido

La cancelación o modificación no tiene porqué ser en línea

Permitir a los usuarios revisar y corregir los datos antes del envío

Si los formularios son de varios pasos:



AA

Almacenar los datos en cada paso y permitir a los usuarios

retroceder a un paso anterior para ver y/o modificar los datos

introducidos

Al terminar el último paso, proporcionar un resumen con

todos los datos antes de realizar la transacción, sugerir al

usuario que los revise y permitirle corregir los errores si es

necesario

Proporcionar, además del botón de envío, una casilla de verificación

para confirmar

El texto usado para la casilla de verificación puede ser algo así

“He revisado los datos y confirmo que son correctos”



AA

Si la acción implica el borrado de datos

Ofrecer la posibilidad de recuperar la información borrada

Retrasar el borrado efectivo (papelera de reciclaje)

Guardar los datos eliminados manteniendo un control de cambios

Solicitar una confirmación para continuar con la acción

“Confirmar” o “Cancelar”

Proporcionar, además del botón de envío, una casilla de verificación

para confirmar

Se ha de marcar la casilla de verificación para indicar que han

revisado los datos. Inicialmente deseleccionada.



AA

Si se trata de una aplicación de evaluación

Permitir a los usuarios revisar y corregir los datos antes del envío

Solicitar una confirmación para continuar con la acción

Se proporciona ayuda dependiente

del contexto

Se proporciona ayuda dependiente

del contexto


Criterio de conformidad 3.3.5: Ayuda

Criterio de conformidad 3.3.5: Ayuda

Objetivo: Proporcionar ayuda a los usuarios para evitar que cometan

errores

Beneficiarios:

AAA

3.3.5. Ayuda3.3.5. AyudaAAA

Enlace de ayuda en cada página

Proporcionar al menos un enlace a la información de ayuda sobre

cómo completar el formulario

Proporcionar un enlace antes o después de cada campo de

formulario con información específica sobre dicho campo

Al seguir los enlaces a la ayuda no se deben perder los datos ya

introducidos

Proporcionar ayuda mediante un asistente

Corrector ortográfico que ofrezca sugerencias

Para las páginas web que requieren al usuario el envío de información, se

cumple al menos uno de los siguientes casos:


Controlado: Se verifica la información para detectar errores en la entrada de datos y

se proporciona al usuario una oportunidad de corregirlos

Confirmado: Se proporciona un mecanismo para revisar, confirmar y corregir la

información antes de finalizar el envío de los datos

Para las páginas web que requieren al usuario el envío de información, se

cumple al menos uno de los siguientes casos:


Controlado: Se verifica la información para detectar errores en la entrada de datos y

se proporciona al usuario una oportunidad de corregirlos

Confirmado: Se proporciona un mecanismo para revisar, confirmar y corregir la

información antes de finalizar el envío de los datos


Criterio de conformidad 3.3.6: Prevención de errores (todos)

Criterio de conformidad 3.3.6: Prevención de errores (todos)

Objetivo: Evitar las consecuencias de cometer un error al enviar los datos

de un formulario

Beneficiarios:

AAA

3.3.6. Prevención de errores (todos)3.3.6. Prevención de errores (todos)AAA

Mismas técnicas indicadas en el criterio de conformidad 3.3.4., salvo

que ahora se aplican siempre que los usuarios envíen información de

cualquier tipo

Pauta 4.1: Compatible

Principio 4: Robusto

Pauta 4.1: Compatible

Maximizar la compatibilidad con las aplicaciones de usuario actuales y futuras,

incluyendo las ayudas técnicas

En los contenidos implementados mediante el uso de

lenguajes de marcas, los elementos tienen las etiquetas de

apertura y cierre completas; los elementos están anidados de

acuerdo a sus especificaciones; los elementos no contienen

atributos duplicados y los ID son únicos, excepto cuando las

especificaciones permitan estas características

En los contenidos implementados mediante el uso de

lenguajes de marcas, los elementos tienen las etiquetas de

apertura y cierre completas; los elementos están anidados de

acuerdo a sus especificaciones; los elementos no contienen

atributos duplicados y los ID son únicos, excepto cuando las

especificaciones permitan estas características

Pauta 4.1: Compatible Pauta 4.1: Compatible

Criterio de conformidad 4.1.1: Procesamiento

Criterio de conformidad 4.1.1: Procesamiento

A

Objetivo: Asegurar que los agentes de usuario y productos de apoyo

puedan interpretar correctamente y procesar (parsear) el contenido

4.1.1. Procesamiento4.1.1. ProcesamientoA

Asegurar que las páginas web puedan ser procesadas

En HTML, asegurar que la apertura y cierre de etiquetas sigue la

especificación

En XHTML, asegurar que las páginas web están bien formadas

Validar las páginas web

Se eliminan las ambigüedades que se pueden producir por el uso de

código incorrecto

Gramáticas formales para HTML 4.0:

HTML “strict”

HTML “Transitional”

HTML “Frameset”


Gramáticas formales para XHTML 1.0:

XHTML “strict”

XHTML “Transitional”

XHTML “Frameset”


Validador HTML

Validador CSS


Usar el lenguaje de acuerdo a la especificación

Usar únicamente características definidas en la especificación

Asegurar que el contenido se pueda procesar (parsear)

Usar las características según se indica en la especificación

Para todos los componentes de la interfaz de usuario (incluyendo, pero

no limitado a: elementos de formulario, enlaces y componentes

generados por scripts), el nombre y la función pueden ser determinados

por software; los estados, propiedades y valores que pueden ser

asignados por el usuario pueden ser especificados por software; y los

cambios de estos elementos se encuentran disponibles para su consulta

por las aplicaciones de usuario, incluyendo las ayudas técnicas

Para todos los componentes de la interfaz de usuario (incluyendo, pero

no limitado a: elementos de formulario, enlaces y componentes

generados por scripts), el nombre y la función pueden ser determinados

por software; los estados, propiedades y valores que pueden ser

asignados por el usuario pueden ser especificados por software; y los

cambios de estos elementos se encuentran disponibles para su consulta

por las aplicaciones de usuario, incluyendo las ayudas técnicas

Criterio de conformidad 4.1.2: Nombre, función, valor

Criterio de conformidad 4.1.2: Nombre, función, valor

A

Objetivo: Asegurar que los productos de apoyo puedan obtener información,

interactuar y estar al corriente del estado de los controles de interfaz de usuario

Pauta 4.1: Compatible Pauta 4.1: Compatible

4.1.2. Nombre, función, valor4.1.2. Nombre, función, valorA

Si usamos componentes de interacción estándar

Usar enlaces y controles de formulario HTML

Usar el elemento <label> para asociar etiquetas a los controles de

formulario o, en su defecto, el atributo title

Usar el atributo title en marcos y marcos en línea

Usar HTML de acuerdo a la especificación

Usar funciones DOM para añadir contenidos a la página

Si usamos scripts para modificar un componente de interacción

estándar

Usar funciones DOM para añadir contenidos a la página

4.1.2. Nombre, función, valor4.1.2. Nombre, función, valorA

Si usamos componentes de interacción en una tecnología de

programación

Usar sus componentes de interacción estándar y las características

de accesibilidad de la API de dichas tecnologías

La accesibilidad en los objetos Flash está soportada a través de

Microsoft Active Accessibility (MSAA)

Para JAVA debemos emplear la API de Accesibilidad de Java,

JAAPI

Si creamos componentes de interacción propios con un lenguaje de

programación

Aplicaciones Ricas de Internet Accesible

Especificaciones WAI-ARIA

WCAG 2.0: Pautas de Accesibilidad al Contenido Web

Technology

Transcript of WCAG 2.0: Pautas de Accesibilidad al Contenido Web