Técnicas para as WCAG 2.0

Ir para o conteúdo (Pressione a tecla Enter)

-

H24: Fornecer alternativas em texto para os elementos area de mapas de imagens

Aplicabilidade

Documentos HTML e XHTML que incluam elementos area .

Esta técnica está relacionada com:

Notas de Apoio para o Agente de Utilizador e para a Tecnologia de Apoio

A especificação HTML 4.01 explica que o texto do atributo alt deve ser apresentado quando o elemento não puder ser apresentado normalmente. Os Agentes de Utilizador irão apresentar o texto do atributo alt quando não são apresentadas imagens. Contudo, actualmente, os Agentes de Utilizador visuais não apresentam o texto do atributo alt para elementos area de mapas de imagens, quando acedidos por teclado ou quando não são apresentadas imagens, e podem cortar os elementos area se o tamanho intrínseco da imagem não for utilizado. Além disso, o texto do atributo alt quando está sob o ponteiro do rato não é apresentado no tamanho de letra ou na combinação de cores definidos no Agente de Utilizador.

O atributo title destina-se a fornecer informações adicionais. Contudo, a implementação actual nos Agentes de Utilizador permite aceder ao atributo title ou alt, mas não a ambos. Normalmente, os Agentes de Utilizador apresentam o texto do atributo title quando o ponteiro do rato é colocado sobre o elemento que contém o atributo title . Por exemplo, o Internet Explorer irá apresentar o texto alt quando este estiver sob o ponteiro do rato se não existir nenhum texto title, o Firefox e o Opera só irão apresentar o texto title quando este estiver sob o ponteiro do rato e não irão utilizar o texto do atributo alt para esta finalidade. Assim, para garantir que o texto do atributo alt está visível quando estiver sob o ponteiro do rato, deve ser utilizado o mesmo texto no atributo title.

Por conseguinte, ao utilizar mapas de imagens, será necessário o seguinte para uma implementação com êxito desta técnica:

Descrição

O objectivo desta técnica é fornecer alternativas em texto que sirvam a mesma finalidade das áreas seleccionáveis de um mapa de imagens. Um mapa de imagens é uma imagem dividida em áreas seleccionáveis definidas por elementos area . Cada área é um link para outra página Web ou outra secção da página Web actual. O atributo alt de cada elemento area serve a mesma finalidade da área seleccionável da imagem.

Exemplos

Exemplo 1

Este exemplo utiliza o atributo alt do elemento area para fornecer texto que descreva a finalidade das áreas do mapa de imagens.

Código Exemplo:

<img src="welcome.gif" usemap="#map1" 
    alt="Areas in the library. Select an area for
more information on that area." /> 
<map id="map1" name="map1">
  <area shape="rect" coords="0,0,30,30"
    href="reference.html" alt="Reference" />
  <area shape="rect" coords="34,34,100,100"
    href="media.html" alt="Audio visual lab" />
</map> 

Recursos

Os recursos são indicados apenas a título informativo, não implica que tenham sido aprovados.

Testes

Procedimento

Para cada elemento area existente num mapa de imagens:

  1. Verifique se o elemento area tem um atributo alt .

  2. Verifique se a alternativa em texto especificada pelo atributo alt serve a mesma finalidade que a parte da imagem do mapa de imagens referenciada pelo elemento area do mapa de imagens.

Resultados Esperados