Del resultado al elemento afectado
El Inspector conecta un hallazgo del plugin con su ubicación en tu sitio. Puedes localizar un enlace difícil de reconocer, leer la explicación y previsualizar una mejora sin editar HTML.
Está disponible en todos los planes. Abrirlo, recorrer los hallazgos y consultar correcciones guardadas no consume cuota de IA. Solo una nueva generación utiliza la cuota disponible. Ni una prueba automática ni una vista previa sustituyen una evaluación manual completa de WCAG.
Abrir y utilizar el Inspector
- Abre la prueba de accesibilidad del plugin y los detalles de un resultado guardado.
- Elige la acción para abrir el Inspector. La acción junto a un hallazgo lleva directamente a ese elemento.
- Utiliza los números, los controles anterior y siguiente o la vista general. Un elemento puede tener varios hallazgos.
- Lee primero el hallazgo. La tarjeta del elemento situada encima ayuda a identificar su ubicación.
En escritorio puedes elegir la posición del panel y arrastrar su borde de ajuste. En teléfonos aparece un panel inferior. Ocultarlo y volverlo a mostrar conserva una vista previa activa. Usa Tab para recorrer los controles y Enter o Espacio para activar botones y secciones desplegables.
Entender la tarjeta del elemento
| Dato | Significado y siguiente paso |
|---|---|
| Elemento seleccionado | Texto o descripción que identifica la ubicación, como el texto alternativo de una imagen. Una descripción guardada puede diferir del contenido actual. |
| Icono y tipo | Identifican enlaces, imágenes, encabezados o botones. El tipo también se muestra por escrito. |
| Visibilidad | Indica si el elemento actual puede verse y resaltarse. Visible no significa accesible. |
| Ruta DOM | Dirección técnica dentro de la página cargada, útil para compartir un hallazgo con tu desarrollador. No es una dirección web. |
| Descripción | Ayuda a identificar el elemento; no garantiza lo que anunciará un lector de pantalla. |
| Rol | Función del elemento, por ejemplo link o button. Estos valores técnicos no se traducen. |
| Tamaño | Anchura y altura actuales en píxeles. El tamaño por sí solo no demuestra facilidad de uso. |
| Árbol de accesibilidad | Estimación de la disponibilidad para tecnologías de asistencia, con los límites descritos a continuación. |
Despliega la ruta DOM y los detalles cuando los necesites. El icono de copia permite copiar la ruta y muestra una confirmación.
Qué es el árbol de accesibilidad
El navegador ofrece a los lectores de pantalla una representación simplificada de la página con nombres, roles y estados de los controles.
La indicación de inclusión mediante una estimación significa que el plugin considera que el elemento está disponible según la página cargada. No lee el árbol de accesibilidad real del navegador. No demuestra una lectura correcta ni una interacción completa con el teclado.
Una indicación de exclusión tampoco implica siempre un fallo: la decoración o el contenido de un menú cerrado pueden estar ocultos correctamente. Un enlace necesario o un control activo debe seguir siendo accesible. Comprueba la función con teclado y, cuando corresponda, con lector de pantalla.
WCAG exige que los nombres, roles y estados pertinentes de los controles puedan determinarse mediante software. Este dato del Inspector orienta; no constituye otra prueba WCAG. Explicación del W3C sobre WCAG 4.1.2: nombre, función, valor
Cuando la ubicación no está clara
| Situación | Qué puedes hacer |
|---|---|
| Oculto | Abre el menú, pestaña o diálogo correspondiente. El Inspector no abre controles cerrados intencionadamente. |
| Solo contexto visible | El elemento no tiene una superficie visible propia. Se resalta un área secundaria visible para orientarte; compara descripción y hallazgo. |
| No encontrado | La página puede haber cambiado. Ejecuta una nueva prueba y abre el Inspector desde ese resultado. |
| Varias coincidencias | Compara el texto y el párrafo que lo rodea. Elige un objetivo solo si puedes identificarlo con seguridad; el mismo texto o la primera posición no bastan. |
| Hallazgo de toda la página | No existe un objetivo individual. Revisa la estructura indicada en el hallazgo. |
| Contexto no válido o caducado | Actualiza la lista de resultados y vuelve a abrir el Inspector. Repite la prueba si la página cambió. |
Revisar una propuesta con AI Element Fix
Genera un AI Element Fix. El plugin utiliza el hallazgo y el contexto limitado disponible del elemento. Revisa la solución recomendada antes de aplicar cambios.
- La explicación de importancia describe el efecto sobre los visitantes.
- El apartado de código y vista previa muestra el marcado actual y, si está disponible, el propuesto. Puedes desplazar horizontalmente y copiar las líneas largas.
- El apartado de comprobación explica cómo verificar el cambio.
La vista previa solo modifica temporalmente tu navegador. Puedes deshacerla; cambiar de elemento también la retira. Ocultar y restaurar el Inspector la conserva. La vista previa no guarda cambios en WordPress.
Algunas soluciones no admiten una vista previa segura. Si no hay vista previa o código verificable, lee el motivo indicado. Revisa el contexto, repite la prueba si procede o comparte las instrucciones con tu desarrollador. No cambies atributos arbitrariamente para eliminar un aviso.
Hallazgos habituales y WCAG
Enlace que depende del color: Un subrayado permanente puede hacerlo reconocible sin distinguir colores. Comprueba además el contraste con el fondo; el contraste entre enlace y texto circundante es otra medición. WCAG 1.4.1: uso del color
Encabezado que no encaja en la estructura: Revisa la sección y los encabezados anteriores. Elige el nivel por su significado, no por su tamaño. Volver a una sección superior no es incorrecto por sí mismo. WCAG 1.3.1: información y relaciones
Botón sin nombre comprensible: Añade una etiqueta adecuada que explique la acción y comprueba su lectura. El rol no sustituye al nombre. WCAG 4.1.2: nombre, función, valor
Aplicar y verificar el cambio permanente
- Localiza dónde se mantiene el elemento: contenido, bloque, constructor de páginas, plantilla u otro plugin.
- Aplica allí el cambio revisado. Copiar una propuesta no modifica el sitio.
- Comprueba escritorio, teléfono, teclado y, cuando corresponda, lector de pantalla. Conserva etiquetas claras, foco visible y funcionamiento.
- Repite la prueba de accesibilidad. La desaparición de un hallazgo confirma solo esa comprobación automática; revisa también la experiencia en contexto.
Más información: Prueba de accesibilidad · Explicación y solución y AI Element Fix