Rampsight

Todas as regras

Alternativas textuais

Substitua mapas de imagem do lado do servidor

Por que isso importa

Um mapa do lado do servidor envia coordenadas de pixels: os destinos existem apenas como posições numa figura. Não sobra nada com que o teclado ou o leitor de tela possam trabalhar.

Como corrigir

  1. Troque o ismap por um <map> do lado do cliente com elementos <area>, cada um com texto alternativo.
  2. Melhor ainda: substitua o mapa por links ou botões reais posicionados sobre a imagem.

Na marcação

Falha
<a href="/map"><img src="offices.png" ismap></a>
Passa
<img src="offices.png" alt="Our offices" usemap="#offices">
<map name="offices">
  <area shape="rect" coords="0,0,60,40" href="/berlin" alt="Berlin">
</map>

A exigência por trás disso

Esta regra é uma das formas de falhar nos seguintes critérios de sucesso das WCAG 2.2. O W3C, que publica a norma, explica cada um deles:

Para aprofundar

Deque University sobre server-side-image-map (abre em nova aba)

A Deque mantém o axe-core, o motor de código aberto que o nosso scanner executa. A página deles documenta a regra como o motor a implementa.

Verificações automáticas encontram falhas que o navegador consegue comprovar. Elas não julgam se uma legenda está correta, se um texto alternativo é útil, nem se a página pode ser operada de ponta a ponta pelo teclado — isso exige uma pessoa.