Guía de usuario de Accessibility Checker

1. Primeros pasos

Accessibility Checker se organiza en torno a tres herramientas, que se seleccionan con el control segmentado de la barra de navegación:

• Audit (Auditoría) — ejecuta un análisis automatizado con axe-core de una página web y revisa cada problema WCAG detectado.
• Contrast (Contraste) — mide el contraste de color entre dos puntos cualesquiera de una página, una imagen o la vista de la cámara en directo.
• Focus Order (Orden del foco) — superpone el orden del foco del teclado (tabulación) sobre una página y detecta problemas de forma visual. (En iPhone, el segmento se llama Focus.)

Primero, dale a la app algo que probar. En el primer inicio se te pedirá que elijas una fuente; después, toca el botón Cambiar fuente (el icono de app con un signo más, arriba a la derecha) y elige:

• URL web — introduce cualquier dirección para cargar un sitio web real. También puedes escribir directamente en la barra de direcciones («Introduce la URL que auditar»).
• Cámara — haz una foto para comprobarla.
• Galería — carga una captura de pantalla o una imagen desde tu fototeca.
• En directo — una señal de cámara en vivo para comprobar pantallas y materiales del mundo real en tiempo real.

Las tres herramientas funcionan con páginas web. Las imágenes, las fotos y la cámara en directo se comprueban con la herramienta Contrast. El icono de engranaje (arriba a la izquierda) abre los Ajustes, y el menú ••• situado junto a la barra de direcciones incluye Atrás, Adelante, Recargar y Crear informe.

2. Ejecuta una auditoría WCAG automatizada

La herramienta Audit ejecuta axe-core — el mismo motor estándar del sector que utilizan los equipos profesionales de accesibilidad — sobre la página que has cargado.

1. Carga una página (introduce una URL y deja que termine de cargarse).
2. Selecciona el segmento Audit. Verás «Preparando la auditoría…» y luego «Realizando la auditoría…» mientras el motor trabaja.
3. Los resultados se abren automáticamente, con el título mostrando el total: Resultados (N).

Interpretar los resultados

Los problemas se agrupan por gravedad — crítico, grave, moderado y menor — con los más graves primero. Toca una gravedad para ver sus categorías de problemas y, después, toca una categoría para recorrer cada elemento afectado. Cada problema muestra el selector de destino, el HTML implicado, un resumen en lenguaje claro y un enlace Más información que explica la regla y resalta el elemento en la página. Una página sin problemas indica «¡Enhorabuena! No se han encontrado problemas.»

Compartir los resultados de la auditoría

Toca el botón Compartir en la pantalla de resultados para exportar:

• Informe de auditoría (PDF) — abre el flujo del informe automatizado (consulta la sección 5).
• Resumen (texto) — un resumen conciso con el recuento por gravedad y los problemas principales.
• Todos los hallazgos (texto) — el listado completo problema por problema.
• Hoja de cálculo (CSV) — una exportación legible por máquina para clasificar en Excel, Numbers o un script.

3. Traza el orden del foco del teclado Nuevo

Quienes usan teclado — y muchas personas que usan lector de pantalla — recorren una página con la tecla Tab. Si la secuencia del foco salta de forma ilógica, la página incumple el criterio WCAG 2.4.3 (orden del foco), y hasta ahora esto resultaba incómodo de probar sin un ordenador de escritorio y herramientas especializadas. La nueva herramienta Focus Order dibuja toda la secuencia sobre la página.

1. Carga una página web.
2. Selecciona el segmento Focus Order. La página se atenúa mientras la app la analiza («Calculando el orden del foco»).
3. Aparece la superposición: unos puntos numerados marcan cada elemento enfocable con el teclado, empezando por el 1, y unas líneas de conexión trazan el recorrido exacto que sigue quien usa teclado. El panel indica el total, por ejemplo «14 paradas de tabulación».
4. Toca cualquier punto numerado para abrir una tarjeta de detalle de ese elemento: su rol, su nombre accesible, su etiqueta ARIA, su índice de tabulación, su selector CSS y el HTML subyacente — todo lo que necesitas para reportar un error preciso.

En qué fijarse

• Saltos que contradicen la disposición visual — por ejemplo, que el foco salte de la navegación al pie de página y vuelva al contenido principal.
• Cero resultados en una página interactiva — la app te avisa: «Si esta página tiene botones o enlaces visibles, eso ya podría ser un fallo de accesibilidad (WCAG 2.1.1).»
• Avisos heurísticos — el panel señala el desplazamiento infinito (puede que falten paradas más abajo) y los elementos fijos (los marcadores pueden desplazarse al hacer scroll).

Exportar el mapa

Toca el botón de exportar del panel Focus Order y elige Imagen de la página completa o PDF de la página completa. La exportación captura la página entera — no solo la parte visible en pantalla — con la superposición numerada intacta, lista para incorporarla a un ticket, una revisión de diseño o un informe de auditoría. Usa el botón de repetir para volver a analizar cuando la página cambie.

4. Comprueba el contraste de color

La herramienta Contrast mide el contraste entre dos colores cualesquiera de la pantalla — en un sitio web, una captura de pantalla, una foto o la cámara en directo.

1. Carga una fuente (página web, imagen o cámara en directo).
2. Selecciona el segmento Contrast.
3. Arrastra los dos selectores hasta los colores que quieras comparar — normalmente el texto y su fondo. Desplázate y pellizca para ampliar y colocarlos con precisión de píxel.
4. Los resultados se actualizan en directo: la relación de contraste (por ejemplo, Contraste: 4.6:1) con Apto/No apto para WCAG 2.1 AA y AAA, tanto para texto normal como grande.

Corregir una combinación que no pasa

Toca el botón Sugerencias para ver alternativas calculadas que sí pasarían, agrupadas como Conforme con AAA (7:1), Conforme con AA (4.5:1) y AA para texto grande (3:1). Toca una sugerencia para aplicarla al selector y verla en su contexto.

Copiar colores

Toca una muestra de color para copiarla en el formato que necesites:

• Hex de HTML — por ejemplo, #1A56DB
• UIColor (RGBA) — listo para pegar en Swift
• UIColor (HSB) — en formato tono/saturación/brillo

También puedes editar un valor hex directamente para probar un color concreto que no hayas seleccionado en la pantalla.

Compartir y guardar mediciones

El menú de compartir del panel Contrast ofrece:

• Añadir al informe — guarda esta medición para el informe automatizado (consulta la sección 5).
• Compartir como texto o Compartir captura de pantalla — envía los resultados por Mail, Mensajes, Notas y más.
• Abrir en el navegador — consulta el mismo resultado en accessibleresources.com para compartirlo como enlace.

Cámara en directo

Elige Cambiar fuente → En directo para comprobar el contraste a través de la cámara en tiempo real — útil para quioscos, señalización, materiales impresos y otras interfaces físicas. Toca el botón de congelar para fijar un fotograma mientras colocas los selectores, y toca de nuevo para reanudar.

Comprobar desde Safari y Photos

No necesitas salir del navegador: en Safari, toca Compartir y elige Accessibility Checker para cargar la página actual directamente en la herramienta Contrast. Lo mismo funciona desde Photos con cualquier captura de pantalla o imagen.

5. Crea informes y declaraciones de accesibilidad

Probar es solo la mitad del trabajo — normalmente hay que demostrarlo. Accessibility Checker reúne todo lo que has capturado en un único informe de accesibilidad automatizado y puede generar una declaración de accesibilidad lista para publicar.

Crear un informe

1. Ejecuta las herramientas de las que quieras obtener evidencias: una auditoría, comprobaciones de contraste (usa Añadir al informe para guardar las mediciones) y un análisis con Focus Order.
2. Elige Crear informe — desde el menú ••• situado junto a la barra de direcciones o desde el botón de informe en iPad y Mac.
3. En el Generador de informes, define el asunto (lo que cubre el informe) y activa las herramientas que quieras incluir: Auditoría (AxeCore), Contraste de color y Orden del foco. El generador muestra un recuento en tiempo real de lo incluido, y puedes seleccionar individualmente las mediciones de contraste guardadas.
4. Toca Previsualizar y exportar, añade el nombre de tu organización y el correo o la página de contacto, y exporta el PDF.

Qué contiene el informe

Un PDF de varias páginas planteado como una autoevaluación automatizada frente a WCAG 2.1 AA / EN 301 549 — el estándar armonizado al que hace referencia la Ley Europea de Accesibilidad (EAA). Incluye una portada con un veredicto general y el desglose por gravedad, todos los hallazgos con sus selectores y referencias, un anexo de contraste de color con recortes de evidencia y el mapa del orden del foco.

Y lo más importante: incluye también una sección honesta, «Qué cubre este análisis y qué no», que detalla cuáles de los 50 criterios de éxito WCAG 2.1 A/AA se comprobaron automáticamente, cuáles requieren revisión humana (a modo de lista de comprobación manual ya preparada) y cuáles quedan fuera del alcance de cualquier análisis automatizado de la página. Las pruebas automatizadas te dan una base rápida — no son una certificación de conformidad, y el informe lo dice con claridad.

Publicar una declaración de accesibilidad

En la vista previa del informe, elige Abrir declaración de accesibilidad. La app genera una declaración autoevaluada a partir de tus resultados — estado de conformidad, limitaciones conocidas, contacto para comentarios y método de evaluación — en el idioma que elijas entre 17, con independencia del idioma de la app. Puedes copiarla como texto, descargarla como HTML para tu propio sitio, imprimirla o compartirla como enlace alojado. Mira un ejemplo real de declaración.

6. iPad y Mac: tarjeta flotante y atajos Nuevo

Esta actualización rediseña la app para pantallas grandes. En iPad y Mac, la página que estás probando ocupa toda la pantalla y los resultados viven en una tarjeta flotante en lugar de un panel fijo en la parte inferior.

• Muévela a cualquier sitio: arrastra la tarjeta por su cabecera hasta cualquier esquina — allí donde no tape la parte de la página que estás inspeccionando. Con VoiceOver, usa las acciones personalizadas de la tarjeta (Mover arriba a la izquierda, arriba a la derecha, abajo a la izquierda, abajo a la derecha).
• Contráela: toca el chevrón de la cabecera de la tarjeta para reducirla a una barra de título mientras navegas, y toca de nuevo para recuperar los resultados.
• Sigue desplazándote: el contenido de la página siempre se desplaza sin quedar bajo la tarjeta, así que nada queda oculto de forma permanente.

Atajos de teclado

Con un teclado físico en iPad (mantén pulsada ⌘ para ver el HUD de atajos) o desde la barra de menús en Mac:

Emulación de dispositivos

En iPad y Mac puedes previsualizar cómo responde una página a distintos tamaños: Emular dispositivo → Móvil, Tableta o Escritorio (en la barra de menús de Mac o con los atajos de arriba) renderiza la página con el ancho de ese dispositivo y la presenta con el user agent de Safari correspondiente — de modo que puedes auditar la experiencia móvil de un sitio desde el Mac, o la experiencia de escritorio desde el iPad.

7. Ajustes

Abre los Ajustes con el icono de engranaje (o con ⌘,). Lo más destacado:

• Cambiar página de inicio — define la página con la que se abre la app.
• Idioma de la app — la app está disponible en 18 idiomas; esta opción abre el ajuste de idioma por app de iOS.
• Icono de la app — elige entre los estilos de icono Alto contraste, Liquid Glass y Accesibilidad.
• Mostrar APCA™ Lc (WCAG 3.0) — añade los valores APCA a los resultados de contraste (consulta la sección 4).
• Versión de axe-core y Hallazgos de la auditoría — controlan el motor de auditoría y si se incluyen los elementos que «requieren revisión».
• Focus Order — opciones de apariencia, interacción y alcance de la superposición (consulta la sección 3).
• Tarjetas WCAG — una referencia rápida integrada a las pautas.
• Ayuda y Repetir el tour de bienvenida — vuelve a ver la introducción de la app cuando quieras.
• Restaurar compras — recupera una suscripción en un dispositivo nuevo.
• Cuenta — si quieres, usa Sign in with Apple para sincronizar los datos de tus informes (nombre de la organización y contacto) entre dispositivos. Iniciar sesión nunca es obligatorio, nada de lo que auditas se vincula a tu cuenta y puedes eliminar la cuenta — y sus datos — desde esa misma pantalla.

8. Funciones gratuitas y planes de pago

Accessibility Checker es gratis de descargar, y navegar por páginas y revisar tus resultados existentes es siempre gratis. Dos niveles de suscripción desbloquean el flujo de trabajo completo, y cada suscripción empieza con una prueba gratuita de 7 días:

• Checker — auditorías, comprobaciones de contraste y análisis del foco ilimitados; comprobaciones AAA y APCA junto a AA; vistas previas de informes con marca de agua.
• Checker Pro — todo lo de Checker, además de informes WCAG completos sin marca de agua, declaraciones de accesibilidad listas para publicar y exportaciones limpias sin sellos de atribución.
• Checker Pro Lifetime — una compra única en lugar de una suscripción, con todo lo de Checker Pro.

Los precios actuales se muestran en la app. Las suscripciones se pueden cancelar en cualquier momento en los Ajustes, y Restaurar compras traslada un plan existente a un dispositivo nuevo.

9. Preguntas frecuentes

¿Mis datos son privados?

Sí. Las auditorías, las comprobaciones de contraste y los análisis del foco se ejecutan en tu dispositivo — los sitios, las imágenes y los colores que compruebas nunca se suben a ningún sitio. Incluso el enlace para compartir la declaración de accesibilidad lleva su contenido en el propio enlace, no en un servidor. Consulta la política de privacidad para más detalles.

¿Una auditoría automatizada sin problemas me hace cumplir la EAA?

No — y desconfía de cualquier herramienta que diga lo contrario. Las comprobaciones automatizadas te dan una base rápida y repetible de preparación para la EAA frente a los criterios WCAG en los que se basa la norma EN 301 549, pero la conformidad plena siempre requiere pruebas manuales. El informe de la app te indica exactamente qué criterios se comprobaron automáticamente y cuáles siguen necesitando revisión humana.

¿Qué motor de auditoría usa la app?

El motor axe-core, estándar del sector, incluido en la app para que funcione sin ninguna configuración. Puedes elegir la versión de axe-core en los Ajustes si necesitas que coincida con la versión que tu equipo usa en otros sitios.

¿Por qué mi mapa del foco exportado solo muestra parte de la página?

Algunas páginas impiden la captura de la página completa; la app te avisa cuando solo ha exportado el área visible. Las páginas con desplazamiento infinito también pueden añadir paradas a medida que te desplazas — el panel te avisa cuando lo detecta. Desplázate más y repite el análisis para capturar más.

¿Dónde consigo ayuda o sugiero una función?

Usa Enviar comentarios en los Ajustes o escribe a info@accessibleresources.com — lo leemos todo.