Realizar escaneos automáticos de accesibilidad es rápido y fácil con axe DevTools. Hay 2 tipos de escaneos de accesibilidad disponibles:
Escaneo de Página Completa
Desde la pantalla de inicio de la extensión, al hacer clic en „Escaneo de Página Completa“ se ejecutará un axe-core escaneo automático de toda la página. Una vez que el escaneo se complete, podrá revisar los resultados del escaneo.
Escaneo de Página Parcial
Desde la pantalla de inicio de la extensión, al hacer clic en „Escaneo de Página Parcial“ podrá seleccionar un componente específico o área de la página para realizar su escaneo. Esto significa que se ejecutará un escaneo completamente aislado solo dentro del elemento seleccionado (todo el contenido fuera del componente seleccionado se ignorará efectivamente). Para realizar una selección de elementos, puede usar su mouse para señalar y hacer clic en cualquier elemento de la página o utilizar el „Selector de Elementos“, amigable con la tecnología asistiva, para hacer una selección de elementos con un teclado (no se requiere mouse). Una vez hecha la selección del elemento, puede hacer clic en escanear, lo que le llevará a los resultados del escaneo.
Resultados
La "Visión General" de los resultados muestra los problemas de accesibilidad encontrados durante un escaneo. La URL en la cual se realizó el escaneo se muestra junto con un control para "Re-ejecutar" el escaneo. Debajo de eso, para los escaneos de página parcial, se mostrará el elemento seleccionado con un control "Destacar" para resaltar el elemento/componente seleccionado en la página. A continuación, encontrará los resúmenes de los problemas que contienen el número total de problemas encontrados junto con desgloses que actúan como "filtros" para ver tipos o categorías de problemas específicos:
- "PROBLEMAS AUTOMÁTICOS": Problemas encontrados durante un escaneo automatizado
- "PROBLEMAS GUIADOS": Problemas encontrados durante Pruebas Guiadas Inteligentes
- "Necesita Revisión": Problemas potenciales en los que axe-core no pudo determinar con absoluta certeza que fueran problemas reales. Esto puede ocurrir a menudo con los cálculos de contraste de color para texto sobre imágenes de fondo o gradientes complejos.
- Mejor Práctica: Problemas que no necesariamente cumplen con los criterios de éxito de WCAG pero son prácticas aceptadas por la industria que mejoran la experiencia del usuario
- Impacto (Crítico, Grave, Moderado y Menor): Categorías de impacto de los problemas
Los problemas se agrupan por su "regla". Para cada regla infringida, estará disponible un botón expandible con la descripción de la regla para profundizar en los problemas encontrados.
Para cada problema, está disponible lo siguiente:
- Descripción del problema
- "Destacar" (alternar que resalta el elemento en la página)
- "Compartir Problema" (genera una página compartible dedicada al problema específico encontrado que contiene todos los datos del problema junto con una captura de pantalla)
- Enlace a la página de ayuda dedicada para la regla dada ("más información")
- "Ubicación del elemento" (el selector CSS generado para el elemento con el problema de accesibilidad)
- "Inspeccionar Elemento" (le permite inspeccionar el elemento en el panel de elementos de las herramientas de desarrollo)
- Código fuente del elemento
- Guía de remediación (información sobre cómo solucionar el problema)
Guardar Resultados
Los usuarios con una suscripción „Pro“ podrán guardar sus resultados usando el botón „Guardar Prueba". Una vez pulsado, se le pedirá que asigne un nombre a su registro de prueba. Después de eso, Pruebas Guiadas Inteligentes (IGTs) estarán disponibles para llevar su prueba al siguiente nivel. Los registros de prueba guardados son registros persistentes donde se almacenarán todos sus datos de prueba. Siempre puede encontrar sus pruebas guardadas haciendo clic en el elemento del menú "ver pruebas guardadas" en la barra de menú superior.
Guardar sus resultados de un escaneo de página parcial le permitirá ejecutar IGTs dentro del componente seleccionado.
