Utilice Axe Expert con tecnología de asistencia

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard
Not for use with personal data
warning

La extensión axe Expert está oficialmente retirada. Lea más sobre esto en la página Reemplazo de axe Expert Estas páginas se eliminarán en julio de 2024. Envíe un correo electrónico a helpdesk@deque.com con cualquier pregunta o inquietud.

Deque Systems, Inc. considera a NVDA/Windows la plataforma principal para los usuarios de lectores de pantalla de la axe Expert Extension. Recomendamos utilizar NVDA o JAWS en Windows y VoiceOver en Mac.

Antes de comenzar:

Consulte axe Expert Extension for Chrome VPAT.pdf para revisar el informe de conformidad de accesibilidad del producto voluntario de Deque para axe Expert Extension.

Utilice la extensión axe Expert para Google Chrome con NVDA

Referencia de atajos de teclado de Chrome DevTools:

Antes de comenzar: Google ha actualizado recientemente la Guía del usuario de DevTools del navegador Chrome y los materiales de referencia web. Para conocer los atajos de teclado que se aplican generalmente al usar la extensión axe Expert en Google Chrome, consulte Referencia de atajos de teclado - Google Developers Chrome DevTools.

Las siguientes instrucciones explican en general cómo utilizar la extensión axe Expert en Google Chrome con lectores de pantalla basados en Windows, incluido NVDA. Se proporcionan instrucciones para instalar, iniciar, navegar por la interfaz de usuario, ajustar la configuración, realizar un análisis de accesibilidad y exportar resultados. Esta documentación no incluye instrucciones para trabajar con la extensión axe Expert SimulAT ni con la funcionalidad de scripts en NVDA, ni tampoco contienen el nivel de detalle involucrado en el resto de esta guía del usuario. La documentación incluida aquí sirve únicamente como guía de inicio rápido para los usuarios del software lector de pantalla NVDA.

En este tema:

Instalar la extensión axe Expert

La instalación de la extensión axe Expert en DevTools de Google Chrome es ligeramente diferente a la instalación de la extensión axe Expert de Deque para Mozilla Firefox, que tiene un proceso de instalación diferente para los usuarios de axe Monitor (que usan un enlace de instalación de la aplicación) que para los usuarios de la extensión axe Expert (que primero descargan un archivo .xpi de un repositorio).

Importante

Las siguientes instrucciones se proporcionan sólo como ejemplo para darle una idea del proceso de instalación. Los pasos del proceso específico pueden variar según sus requisitos únicos de seguridad y del tipo/versión del navegador. Por ejemplo, dependiendo de su organización, es posible que se le solicite cargar una extensión descomprimida con el modo de desarrollador habilitado. Consulte con su gerencia para obtener instrucciones de instalación específicas. La mejor práctica recomendada por Deque es que todos los clientes trabajen con su Gerente de participación de Deque o con la Mesa de ayuda de Deque para obtener la versión adecuada y los archivos de instalación con la licencia adecuada.

Desde la página de extensiones de Chrome Web Store

La forma más sencilla de instalar la Extensión axe Expert es a través de un enlace directo a la página de extensiones de Google Chrome en Chrome Web Store. Si alguna vez ha instalado una extensión del navegador Google Chrome, el proceso es el mismo. Sin embargo, la Extensión Axe Expert generalmente no se puede buscar en Chrome Web Store, por lo que se requiere un enlace directo:

Enlace a axe Expert en Chrome Web Store.

Para obtener instrucciones de instalación completas utilizando el enlace proporcionado, consulte el tema Descargar e Instalar en la sección Primeros pasos de esta guía.

Desde un enlace de instalación

Se puede acceder al archivo de instalación comprimido .crx directamente desde un enlace en el menú de la barra lateral derecha de axe Monitor, lo que le permite iniciar el proceso de instalación desde el navegador Google Chrome.

Para instalar axe Expert Extension desde un enlace de instalación (axe Monitor):

  1. Navegue a la sección Enlaces rápidos de la pantalla de inicio en axe Monitor usando el navegador Chrome.
  2. Seleccione Descargar axe Expert Extension 3.5.

Cuando selecciona el enlace de instalación de la extensión axe Expert, aparece un mensaje que le pregunta si desea instalar la extensión axe Expert.

  1. Vaya a y seleccione el botón Cargar Extensión Desempaquetada... (o presione Alt_I).

Desde un archivo CRX

La extensión empaquetada de Google Chrome se ofrece como un archivo comprimido con la .crx extensión de archivo y ofrece una clave privada para que nunca tenga que preocuparse por actualizar manualmente la extensión, ya que esto se maneja automáticamente.

Para instalar axe Expert Extension desde un .crx archivo (axe Expert Extension):

  1. Comuníquese con su gerente de participación de Deque o con la mesa de ayuda de Deque para obtener el instalador de archivos CRX requerido.
  2. Navegue hasta el archivo .crx descargado en su computadora.
  3. Presione Enter.

Verificar la instalación

La instalación sólo debería tomar unos segundos. Cuando se complete la instalación, se reproducirá un mensaje indicando que la extensión axe Expert se instaló correctamente. Siempre puedes verificar el éxito de la instalación intentando abrir la extensión axe Expert en Google Chrome DevTools. Para obtener más información, consulte Open axe Expert Extension. Los siguientes pasos lo guiarán a través de la verificación de la instalación mediante la navegación a la entrada de axe Expert Extension en la página de extensiones de Google Chrome.

  1. En el campo Dirección (Ubicación) de Google Chrome, escriba chrome://extensions/ y presione Intro.

  2. Activa TAB tres veces para acceder a la lista de extensiones de Google Chrome instaladas.

  3. Presione la tecla Down Arrow para localizar el elemento de la lista de la extensión axe Expert.

    Las extensiones de Google Chrome se muestran en orden ascendente y según las últimas instalaciones, por lo que debería ser el primer elemento de la lista.

  4. Escuche las opciones "deshabilitar, eliminar". Cuando escuche estas opciones anunciadas después de axe Expert, la extensión se instaló correctamente.

Abra la extensión axe Expert en Google Chrome

La extensión axe Expert está instalada en la barra de pestañas DevTools de Chrome.

  1. Mantenga presionado Ctrl+Shift+I para iniciar Chrome DevTools.
  2. Mantén presionado Ctrl\_\] hasta que escuches "axe Expert".

Cuando se instala por primera vez y no existen otras extensiones que se integren con las herramientas de desarrollo de Google Chrome, la pestaña axe Expert estará en el extremo derecho de la barra de pestañas de la caja de herramientas.

  1. Presione Enter para habilitar la pestaña axe Expert en la ventana DevTools.

La Extensión axe Expert ahora está activa en la ventana DevTools de Google Chrome y lista para usar.

Comprender y navegar por la interfaz de usuario de la extensión axe Expert

Selección del panel del menú principal

En el panel izquierdo de la Extensión axe Expert, independientemente del panel que esté seleccionado actualmente, tiene un menú desplegable principal que proporciona enlaces a cada uno de los cinco paneles principales dentro de la Extensión axe Expert.

  1. Verifique la activación de la pestaña axe Expert presionando la tecla Tab para mover el foco al Menú principal, que se lee como "Navegación global".

    El marco se anuncia como marco "data/index".

    Pestaña predeterminada: El panel Analizar está activo de forma predeterminada cuando se inicia axe Expert Extension. Utilice la pestaña Analizar para realizar un análisis de accesibilidad; es probable que sea la pestaña que utilice el 99,5 % del tiempo. Utilice el menú de axe Expert Extension Options para seleccionar Settings y Sign in to axe Monitor.

  2. Mueva el foco al menú principal de navegación global de axe Expert Extension y presione Enter.

    Se abre el menú principal de Axe Expert Extension y muestra cinco opciones de panel:

  3. Presione las teclas down arrow y up arrow para navegar por los elementos del menú principal de Axe Expert Extension. Presione Enter para seleccionar un elemento del menú.

El menú se cierra y el lector de pantalla anuncia "botón contraído", seguido del nombre del elemento de menú seleccionado.

Panel-Specific Context Menu (Analyze menu)

Acceda a controles adicionales específicos del panel y a enlaces a paneles asociados y funcionalidades relacionadas en otros paneles para el panel seleccionado a través del menú desplegable del botón de puntos suspensivos verticales en la barra superior del panel de contenido a la derecha en el panel Analizar. A este menú desplegable a veces se lo denomina informalmente "menú de tres puntos".

Utilice el menú contextual del panel Analizar:
  • Tab Utilice el botón Analyze en el panel Analyze para mover el foco a un menú contextual que se anuncia como main landmark Analyze google menu button collapsed.
  • Presione Enter para mostrar los elementos del menú contextual Analizar.
  • Arrow down o hacia arriba para resaltar un elemento del menú y pulsa Enter para seleccionar el elemento del menú resaltado actualmente.

Cada panel dentro de axe Expert Extension se compone de dos o tres subpaneles de información. Los subpaneles también contienen secciones de información identificadas con encabezados.

Cambiar de un panel a otro

  • En el modo de exploración, presione la flecha arriba o la flecha abajo para seleccionar el panel que desea habilitar y presione Intro.
  • En el modo de formularios, presione la tecla Tab para ir al panel activo y luego use las teclas de flecha (flecha derecha o flecha izquierda) para cambiar a otros paneles (no es necesario presionar Intro).

Para obligar a NVDA a volver al modo de exploración, presione la tecla NVDA y la barra espaciadora después de trabajar en el modo de formularios.

Disposición del teclado y modo Formularios

Disposición del teclado de NVDA: Presione la tecla Esc o la tecla NVDA y la barra espaciadora para salir del modo de formularios en NVDA. La tecla NVDA es la tecla insert , a menos que la cambies a Caps Lock, lo que puedes hacer en el menú de configuración de NVDA.

Seleccionar un conjunto de reglas

Es posible que desees ajustar la opción del conjunto de reglas en el panel Reglas. El panel Reglas contiene casillas de verificación con la leyenda Conjunto de reglas, en las que se pueden encontrar tres conjuntos de reglas. Las reglas WCAG 2.0 AA están activas de forma predeterminada. El uso de un conjunto de reglas distinto del predeterminado WCAG 2.0 AA implica realizar ajustes opcionales en la pestaña Reglas.

Puede realizar análisis sin conexión utilizando uno de los conjuntos de reglas estándar de axe Expert Extension sin conectarse a un servidor de axe Monitor, o puede utilizar su propio conjunto de reglas personalizado.

Estándar predeterminado: si utiliza la extensión axe Expert sin ninguna modificación, realizará un análisis WCAG 2.1 AA utilizando el conjunto de reglas WCAG 2.1 AA predeterminado.

Seleccionar un conjunto de reglas:

  1. Presione R en NVDA.

La casilla de verificación WCAG 2.1 nivel AA está marcada de forma predeterminada. Este es un conjunto de reglas estándar que viene con la extensión axe Expert. El conjunto de reglas predeterminado se utiliza hasta que le indique a la extensión axe Expert que use uno diferente. No puedes eliminar los conjuntos de reglas que vienen como parte de la extensión axe Expert.

  1. Seleccione un conjunto de reglas a través de la casilla de verificación asociada.

No es necesaria ninguna confirmación adicional.

Configuración: Conexión al servidor, selección de proyecto y alcance

Lo primero que notará en el panel de Configuración es un conjunto de campos de formulario que le permiten conectar la axe Expert Extension a un servidor axe Monitor. Después de iniciar sesión en axe Monitor, se muestra un menú de selección de proyecto con un botón. Cuando seleccionas un proyecto, aparecen dos secciones nuevas: Incidencias de descarga y Alcance.

Puede que quieras conectarte a tu servidor axe Monitor y seleccionar un proyecto para habilitar la descarga y carga de resultados de análisis. Si la extensión axe Expert no está conectada a un servidor axe Monitor, el menú desplegable se anuncia como "fuera de línea sin proyecto" o "clickeable fuera de línea sin proyecto clickeable", y la funcionalidad de selección de proyectos se anuncia como "no disponible". Para obtener detalles completos, consulte Sign in to axe Monitor y Select an axe Monitor Project respectivamente.

Antes de usar el panel Análisis para analizar una página web, puede que quieras ajustar las opciones en la sección Alcance del panel Configuración para refinar qué se tendrá en cuenta o qué se ignorará. Para obtener detalles completos, consulte Definiciones del alcance.

Opciones de grabación de eventos

El panel Opciones de grabación de scripts, al que se accede a través del enlace Opciones en el panel de la pestaña Scripts, tiene una sección llamada Eventos a capturar, que contiene casillas de verificación donde puede configurar qué eventos grabar o ignorar al grabar scripts. Para obtener más información, consulte Seleccionar eventos para capturar.

Analizar una página para detectar infracciones de las reglas de accesibilidad

  1. Abra la página que desea probar en Chrome.

  2. Abra Chrome DevTools (Ctrl_Shift_I) y seleccione la pestaña axe Expert.

    Consulte Open axe Expert Extension para obtener más información.

  3. Localice el botón ANALIZAR o el enlace Ejecutar de nuevo si está volviendo a analizar una página en el panel Analizar de la extensión axe Expert (no importa cuál seleccione, ambos realizan la misma función).

  4. El botón Analizar.

La etiqueta del botón Analizar cambia para mostrar que se está analizando durante un escaneo.

Sabrá que el análisis ha finalizado cuando pueda usar las teclas de dirección o tabulación para moverse desde el botón Analizar.

Cuando no se encuentran violaciones de accesibilidad

Si no se encuentran violaciones de accesibilidad, la línea después del botón de carga dirá: ¡Felicitaciones! No se encontraron violaciones de accesibilidad. Ahora debes realizar pruebas manuales utilizando tecnologías de asistencia como NVDA, VoiceOver y JAWS.

Trabajar con resultados de análisis

Botón de exportación y recuento de violaciones: Si se descubrieron uno o más errores, utilice la quinta opción de enlace Export, en el menú del panel Analyze para exportar los resultados a un archivo CSV.

Download y Upload enlaces: El menú Analyze del panel también incluye elementos de... descarga y... carga. Estos elementos se anuncian como "deshabilitados" cuando no están conectados a un servidor de axe Monitor. Para obtener más información, consulte Cargar resultados de análisis y Descargar un script.

Analice los resultados de la Extensión axe Expert de una de dos maneras:

  • Exportar los resultados a un programa de hoja de cálculo para su posterior análisis.
  • Revise los resultados dentro del panel de Análisis.

Exportar resultados

Si necesita trabajar con resultados de análisis en un programa de hoja de cálculo como Microsoft Excel, que permita ordenar y manipular otros datos, seleccione Export del menú de la Extensión de Expertos de axe Analyze para descargar un archivo de valores separados por comas (CSV). Trabajar con resultados exportados es particularmente útil para los usuarios de lectores de pantalla para facilitar la navegación entre violaciones cuando los resultados incluyen múltiples violaciones de múltiples reglas.

Exportar resultados a un archivo CSV:

  1. Seleccione Export en el menú desplegable Analyze específico del panel.

Se muestra un cuadro de diálogo Guardar archivo típico.

  1. Seleccione una carpeta conveniente, proporcione un nombre descriptivo para el archivo y seleccione Save.

    Asegúrese de que la carpeta deseada esté seleccionada shift+tabbing en el árbol de carpetas la primera vez que abra el cuadro de diálogo Guardar archivo usando el enlace Exportar. axe Expert Extension guarda los resultados exportados en la ubicación de descarga predeterminada configurada en la configuración de su navegador Chrome. Una vez que se selecciona una carpeta, axe Expert Extension recuerda su selección para futuras exportaciones.

Revisión de los resultados del análisis en la extensión axe Expert

Todos los resultados del análisis de la extensión axe Expert se muestran bajo el encabezado Violaciones encontradas. Este suele ser el único encabezado en el Analyze panel, por lo que usar h debería llevarlo allí directamente.

Revisión de violaciones de las reglas:

  • Presione la flecha hacia arriba dos veces para ver la línea donde se reporta el número de violaciones encontradas.

    La extensión axe Expert muestra una lista ordenada de pruebas que identificaron violaciones, junto con la cantidad de violaciones para cada regla. Los nombres de las reglas en la lista son enlaces que, cuando se muestran, muestran una lista de todas las violaciones de esa regla.

    Una lista típica de violaciones podría verse así:

Lista de x elementos

  1. Enlace: Los elementos deben tener suficiente contraste de color x infracciones (donde x es el número de infracciones).
  2. Enlace: El valor del atributo ID debe ser único infracciones...

Examine en detalle las infracciones individuales:

  • Seleccione el enlace de la regla en la lista.

Cuando se selecciona un enlace de regla, verá un panel que muestra la primera violación de la regla.

Descripción general del panel de violaciones de los resultados del análisis

Esta sección describe la información secuencial que se muestra a medida que se desplaza hacia abajo dentro de una violación de regla individual.

  • Visualización de una infracción individual: Comience con la lista de reglas que produjeron infracciones (consulte la sección anterior para obtener una descripción y un ejemplo de cómo se ve la lista).

  • Navegación y impacto de violaciones múltiples

  • Botón anterior: Al final de la lista verás un botón llamado anterior. El botón anterior se deshabilita cuando visualiza la primera violación de la regla.

  • # de violaciones totales: Desplácese hacia abajo desde el botón Anterior para ver una línea que dice: "violación 1 de X", donde X es el número total de violaciones específicas de la regla activa.

  • Impacto: Al desplazarse hacia abajo desde la línea # de violaciones totales, se visualiza la información de impacto relacionada con la violación. La línea de impacto contiene la clasificación del impacto: menor, moderado, grave o crítico.

  • Next Botón: Se muestra un botón siguiente después de la información del impacto. El siguiente botón se anuncia como deshabilitado si está revisando la última violación de una regla específica.

  • Description: Al presionar la flecha hacia abajo desde el siguiente botón, se muestra una descripción de una línea de la regla violada junto con un enlace Más información. Por ejemplo, esta línea leerá "Garantiza que el contraste entre los colores de primer plano y de fondo cumpla con los umbrales de relación de contraste WCAG 2 AA" cuando se registre una violación de la regla de contraste de color.

  • More info enlace: Seleccione Más información para revisar el contenido de la Deque University que proporciona más contexto e información de fondo sobre la regla violada, además de información detallada sobre cómo solucionarlo.

  • Applicable Ruleset (Standard) and Success Criteria: Una lista de dos elementos sigue al enlace Más información. El primer elemento de la lista enumera el conjunto de reglas activas utilizadas durante el análisis de la axe Expert Extension. WCAG 2.0 AA es el conjunto de reglas de axe Expert Extension, conocido como "wcag2aa". El segundo elemento de la lista especifica el criterio de éxito para la regla activa (por ejemplo, wcag143 para el criterio de éxito 1.4.3 de WCAG 2.0: contraste de color).

  • Inspect and Highlight links: El enlace Inspeccionar resalta el elemento que infringe en DevTools. El segundo enlace, Resaltar, resalta visualmente el elemento de la página web en la ventana principal del navegador Chrome.

  • Section Navigation: Varios encabezados h2 adicionales representan secciones del panel de contenido dentro de una violación:

  • Target: El objetivo identifica una ruta de selector CSS al elemento HTML que infringe.

  • HTML: muestra un fragmento de marcado HTML que incluye el elemento que infringe.

  • Summary: El resumen contiene una sección que corrige cualquiera de las siguientes subsecciones seguida de una lista de correcciones sugeridas. El diseño preciso y la redacción de la solución sugerida dependen de la infracción específica. La lista de correcciones sugeridas es información esencial en cualquier informe o análisis, ya que generalmente ayuda a identificar el error exacto y a menudo proporciona la corrección más fácil.

Notas de navegación sobre infracciones múltiples

Utilice los botones Previous y Next

Utilice los botones previous y next para ir al incumplimiento anterior/siguiente si el análisis registró múltiples incumplimientos de reglas. El incumplimiento actualizado de la línea x de y es anunciado automáticamente por la mayoría de los lectores de pantalla al seleccionar los botones previous o next. Por ejemplo, si el panel muestra actualmente el incumplimiento uno de diez y selecciona el botón next, NVDA anuncia automáticamente "incumplimiento dos de diez". Los botones next y previous proporcionan el único medio de navegación hacia un incumplimiento de regla particular.

Para llegar a la violación ocho de diez de la regla x, haga clic en la regla x y luego haga clic siete veces en next .

Sobre la última infracción

Al hacer clic en next cuando se muestra actualmente la última violación de una regla determinada, no se muestra automáticamente la primera violación de la siguiente regla. De hecho, el botón next se desactiva cuando se muestra la última violación de la regla. Regrese a la lista de reglas y seleccione la siguiente regla para inspeccionar.

Revise todas las violaciones de accesibilidad para todas las reglas. Exporte el informe a un archivo CSV para revisar rápidamente todas las violaciones de las reglas en un solo lugar.

Usar reglas personalizadas

El Rules panel es la cuarta selección del menú principal. Si ha escrito un archivo JSON de reglas personalizadas para que axe Expert Extension las escanee, use el Rules panel para agregar su conjunto de reglas. Una vez agregado al Rules panel, puede seleccionar su conjunto de reglas desde la Rules pestaña. El Custom Ruleset panel contiene dos campos de formulario y un botón: Name for Custom Rules, Enter JSON SAVE y USE RULESET

Agregar reglas personalizadas

  1. Especifique un nombre para su conjunto de reglas personalizado en el campo (Nombre para Reglas Personalizadas e Ingresar JSON).

Asegúrese de que el nombre contenga solo letras o números (no se permiten espacios, guiones u otros símbolos como parte del nombre del conjunto de reglas).

  1. Ingrese o pegue sus JSON reglas en el Enter JSON campo.

  2. Seleccione SAVE Y USE RULESET.

El panel Rules muestra un mensaje de éxito o de error si especificó un nombre no válido o utilizó JSON no válido. Puede ver el nombre de su conjunto de reglas en la sección Conjuntos de reglas personalizados del menú de la barra lateral izquierda en el panel Reglas. Elimine un conjunto de reglas personalizado seleccionando la casilla de verificación correspondiente y luego seleccionando Eliminar conjunto de reglas.

Is this page helpful?

Help us improve this page

Still need help?