input-image-alt-quality
La alternativa textual de <input type="image"> debe ser adecuada (revisión manual)
Marca los elementos <input type="image"> con una alternativa textual no vacía (alt, aria-label, aria-labelledby o title) para que una persona revise si es adecuada. Indica cuándo el nombre parece un nombre de archivo, una dirección web, un marcador de posición, un comienzo del tipo "image of" o es muy largo.
Ámbito de aplicación. Se aplica a los elementos <input type="image"> que obtienen una alternativa textual no vacía de cualquier fuente: aria-labelledby (que resuelve a texto), aria-label, alt o title. Un elemento cuyo alt está presente pero vacío queda para input-image-alt-decorative, que pregunta por ese caso. El elemento debe estar incluido en el árbol de accesibilidad, y role="presentation"/"none" lo saca del alcance salvo que sea enfocable, lo que restablece su rol.
Resultado esperado. Se requiere revisión manual para confirmar que el texto alternativo proporcionado es preciso y apropiado. Cada ocurrencia enumera todas las fuentes presentes (data.details.sources), para que la persona que revisa compruebe cada una. También se comprueba en el nombre lo que la regla img-alt-quality comprueba en un alt (helpers.getTextAlternativeSignal): un nombre de archivo, una dirección web, solo símbolos, un marcador de posición o una palabra genérica, un comienzo que dice que es una imagen, o más de 150 caracteres. Un nombre así recibe su propio resumen y su propia sugerencia; el hallazgo sigue siendo cantTell.
Qué informa un hallazgo.
reasonCode:TEXT_ALTERNATIVE_REVIEW, sea cual sea la señal.name: la alternativa textual del control tal como se anuncia, de la primera fuente que proporciona una.sources: cada fuente que proporciona una alternativa textual no vacía, en el orden en que se usan para el nombre. Cada elemento esaria-labelledby,aria-label,altotitle.altSignal, ylengthylimitparatoo-long: lo que hizo que el nombre pareciera algo distinto de una descripción, como en img-alt-quality. No aparece cuando el nombre es corriente.alt(un control con unaltno vacío): el texto dealt.
Estos campos de data.details ayudan a leer y reproducir un hallazgo. Salvo reasonCode y los pocos campos que Esquema de salida indica como estables, no son un contrato estable: un campo puede cambiar de nombre o desaparecer en una versión menor, así que no construyas sobre ellos.
Ejemplos
<input type="image" src="submit.png" alt="Submit order">
Este botón de imagen tiene un alt no vacío; conviene confirmar que "Submit order" corresponde a lo que el botón hace realmente. También se pregunta por un botón de imagen nombrado solo mediante aria-label, aria-labelledby o title.
<input type="image" src="submit.png" alt="" title="Submit order">
Un alt vacío en un control funcional es la cuestión de input-image-alt-decorative, no la de esta regla.
Cómo comprobarlo
Cuando esta regla no puede decidir, informa cantTell y deja la pregunta a una persona. Cada pregunta que puede plantear aparece aquí bajo su código de motivo, con los pasos para responderla. Un hallazgo lleva los mismos pasos en howToCheck, en el idioma del análisis. Consulta Esquema de salida.
TEXT_ALTERNATIVE_REVIEW
- Localizar el botón de imagen que indica el informe y leer el nombre que da; comprobar cada fuente enumerada (alt, aria-label, aria-labelledby, title).
- Pulsar el botón o leer el formulario para saber qué hace.
- Decidir si el nombre anunciado dice lo que hace el botón, y que las demás fuentes no lo contradicen.
Se cumple. El nombre indica la acción del botón, como «Enviar pedido» o «Buscar».
No se cumple. El nombre no dice lo que hace el botón, por ejemplo un nombre de archivo, una dirección, una palabra genérica o símbolos, lo que incumple WCAG 1.1.1 (H36, F30).