server-side-image-map-absent

Los mapas de imagen del lado del servidor deben tener una alternativa operable con teclado

automaticWCAG 2.1.1 (A)confianza: highgravedad: seriousoperable

Pregunta, por cada <img ismap> dentro de un enlace, si la página ofrece los mismos destinos como enlaces alcanzables con el teclado, ya que un mapa de imagen del lado del servidor no tiene regiones propias operables con teclado.

Ámbito de aplicación. Se aplica a cualquier ámbito de análisis. Un <img ismap> dentro de un <a href> es un mapa de imagen del lado del servidor: el navegador envía las coordenadas del clic a la URL del enlace, lo que no tiene equivalente operable con teclado y no expone regiones individuales a la tecnología de asistencia.

Resultado esperado. Cada mapa de imagen del lado del servidor se informa como cantTell: 2.1.1 se cumple cuando los mismos destinos se ofrecen también como enlaces alcanzables con el teclado, algo que la regla no puede verificar. Los mapas de imagen del lado del cliente (<map>/<area>) no se marcan. Un ámbito sin <img ismap> pasa. Uno cuyos únicos <img ismap> están fuera de un enlace es notApplicable: ahí ismap no hace nada, así que no hay mapa de imagen del lado del servidor (el atributo mal colocado es HTML no válido, asunto del validador).

Ejemplos

pass
<img src="image.png" usemap="#nav" alt="Site map">
<map name="nav">
<area href="/x" shape="rect" coords="0,0,10,10" alt="Go">
</map>

Un mapa de imagen del lado del cliente no tiene atributo ismap, lo que satisface la regla directamente. (Un <img ismap> fuera de un enlace no hace nada y hace que la regla no sea aplicable.)

can't tell
<a href="/map-handler">
<img src="image.png" ismap alt="Site map">
</a>

ismap depende de que el navegador envíe las coordenadas del clic al servidor, así que las regiones del mapa no se pueden alcanzar con el teclado; si la página ofrece los mismos destinos como enlaces lo comprueba una persona. Esta regla nunca falla.

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.

SERVER_SIDE_IMAGE_MAP

  1. Localizar el mapa de imagen que indica el informe y hacer clic en sus regiones para anotar adónde lleva cada una.
  2. Dejar el puntero a un lado, recorrer la página con Tab hasta el enlace de la imagen, pulsar Intro y anotar lo que ocurre.
  3. Buscar en otras partes de la página enlaces de texto normales a cada uno de los destinos anotados, y comprobar que puede llegar a ellos y seguirlos con Tab y Intro.

Se cumple. Cada destino del mapa de imagen se ofrece también como un enlace que funciona con el teclado.

No se cumple. Algún destino solo se puede alcanzar haciendo clic en un punto de la imagen, lo que incumple WCAG 2.1.1.

Ver código fuente