Demo
Ve una introducción en video a la historia y las características del verificador,
o prueba a editar el contenido de la demo a continuación, abrir y descartar alertas,
y usar la barra de herramientas () para ver el esquema de encabezados. Esta demo incluye tanto las pruebas principales como el paquete CSA.
Esta demo usa un editor TinyMCE. Editoria11y es compatible con la mayoría de los editores de texto y tiene implementaciones listas para usar con CKEditor y Gutenberg en WordPress y Drupal.
Encabezados
Este encabezado saltó un nivel:
Oops
Este encabezado no tiene ningún texto:
Esta cita breve podría ser un encabezado:
Soy un encabezado falso
Este párrafo completamente en negrita podría ser un encabezado:
Soy un encabezado falso
Este encabezado es muy largo:
Los encabezados y subtítulos crean una tabla de contenidos navegable para los dispositivos de asistencia. Los números indican la sangría en una relación de jerarquía. Los encabezados muy largos probablemente significan que el autor está diciendo demasiado en el encabezado.
Texto alternativo para imágenes
Este encabezado está formado por una imagen de texto sin texto alternativo:
Imagen sin ningún atributo alt:

Imagen con un atributo alt inválido, p. ej., alt="'"

Imagen con un nombre de archivo como texto alternativo

Imagen con texto redundante en su texto alternativo, como "imagen de:"

Imagen enlazada con texto redundante en su texto alternativo, como "imagen de:"
Imagen con texto alternativo provisional:

Imagen enlazada con texto alternativo provisional:
Imagen con texto alternativo generado por máquina:

Imagen enlazada con texto alternativo generado por máquina:
Imagen con texto alternativo muy largo:

Imágenes en enlaces donde el texto alternativo podría estar describiendo la imagen en lugar del enlace
Este enlace tiene texto y una imagen.
Cualquier imagen enlazada (prueba desactivada por defecto)
Imagen en figura marcada como decorativa:
Imagen en figura con un texto alternativo igual al pie de foto:
Imagen en un carrusel sin texto alternativo:
Contraste
Combinación de colores ilegible:
Muy legible.
El color requiere una verificación manual:
E incalculable.
Gráfico SVG sin contraste suficiente
Gráfico SVG cuyo contraste requiere una verificación manual
Contenido incrustado y multimedia
Vídeo marcado para verificación manual de subtítulos:
El audio requiere una transcripción:
Iframe sin título que además requiere una verificación manual:
Iframe que no puede recibir el foco:
Componentes interactivos anidados
Acordeón
Acordeón
¡Sorpresa!Enlaces significativos
Enlaces sin ningún texto
Enlaces etiquetados únicamente con una URL:
https://www.youtube.com/watch?v=DLzxrzFCyOs
Enlaces etiquetados únicamente con símbolos:
Enlaces con el mismo nombre que van a lugares distintos
Enlaces etiquetados únicamente con un número DOI:
doi.org/10.1145/3493612.3520468
Enlaces con etiquetas sin significado:
Iconos enlazados sin texto alternativo:
Enlaces que abren en una ventana nueva sin icono de enlace externo ni aviso textual
Alerta para la prueba de apertura en nueva pestaña.
Enlaces a PDFs
Enlaces a otros documentos
Enlaces con atributos title redundantes
Enlaces con atributos que los excluyen del orden de tabulación:
Enlaces con atributos aria-labelledby que apuntan a elementos sin texto:
Enlaces con palabras genéricas en su etiqueta aria:
Imagen enlazada sin texto alternativo:
Imagen enlazada con texto alternativo impronunciable:
Imagen enlazada sin atributo de texto alternativo:
Imagen enlazada sin atributo de texto alternativo en un enlace con texto:
Imagen enlazada con solo un nombre de archivo como texto alternativo:
Imagen enlazada con texto alternativo sospechosamente largo:
Enlaces internos rotos
Enlaces al servidor de desarrollo
Anclas duplicadas
Tablas
Tablas sin encabezados válidos
| Una tabla sin encabezado TH no es válida | Los encabezados de esquema no cuentan | La prueba de encabezado de contenido debería desactivarse dentro de las tablas |
| Encabezados vacíos | |
|---|---|
| Encontré | 700 vídeos de tortugas |
| Cada uno | de 2 segundos de duración |
Legibilidad
VARIAS PALABRAS SEGUIDAS EN MAYÚSCULAS ACTIVARÁN UNA ADVERTENCIA DE VERIFICACIÓN MANUAL.
Texto subrayado
Un poco de cursiva está bien, pero los bloques grandes de texto enfatizado no son muy legibles. Una pequeña cantidad es aceptable, por supuesto, pero hay límites, y un párrafo entero es demasiado. Este, por ejemplo, es un párrafo entero. Es un poco difícil de leer, ¿verdad? Pero esta prueba no se activa hasta que el texto es tan largo como este, por lo que no deberías ver falsos positivos en tu contenido a menos que escribas párrafos muy largos con regularidad.
Texto justificado
Superíndice o subíndice excesivo; el subíndice debería usarse para referencias pequeñas y notas al pie, no para oraciones o párrafos enteros.
Fuentes diminutas
* Listas falsas con caracteres comunes,
* letras, números y emoji.
Formularios
Botón sin etiqueta
Campos con una etiqueta invisible, preguntando si también hay una etiqueta visible.
Campos con solo un marcador de posición como etiqueta, preguntando si también hay una etiqueta visible.
Botón con una etiqueta accesible distinta de su etiqueta visible.
Botón con un atributo aria-labelledby no válido.
Botón con etiqueta redundante.
Botón de restablecimiento.