Técnicas para as WCAG 2.0

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

-

H37: Utilizar atributos alt em elementos img

Aplicabilidade

Imagens utilizadas em documentos HTML.

Esta técnica está relacionada com:

Descrição

Ao utilizar o elemento img, especifique uma alternativa em texto abreviado com o atributo alt . Nota: O valor deste atributo é referido como "texto alt".

Quando uma imagem inclui palavras importantes para compreender o conteúdo, o texto alt deve incluir essas palavras. Isto irá permitir que o texto alt tenha a mesma função na página que a imagem. Tenha em atenção que não descreve necessariamente as características visuais da própria imagem, mas tem de transmitir o mesmo significado da imagem.

Exemplos

Exemplo 1

Uma imagem num sítio da Web fornece um link para uma newsletter gratuita. A imagem inclui o texto "Newsletter gratuita. Obtenha receitas gratuitas, novidades e mais. Saiba mais." O texto alt corresponde ao texto existente na imagem.

Código Exemplo:

<img src="newsletter.gif" alt="Free newsletter. 
   Get free recipes, news, and more. Learn more." />

Exemplo 2

Uma imagem num sítio da Web retrata a planta dos pisos de um edifício. A imagem é um mapa de imagens, no qual cada divisão é uma área do mapa interactivo. O texto alt é "A planta dos pisos do edifício. Para mais informações sobre a finalidade ou conteúdo da divisão, seleccione uma divisão." A instrução para "seleccionar uma divisão" indica que a imagem é interactiva.

Recursos

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

HTML 4.01 - elemento IMG

HTML 4.01 - atributo alt

Testes

Procedimento

  1. Examine cada elemento img existente no conteúdo.

  2. Verifique se cada elemento img que transmite um significado inclui um atributo alt .

  3. Se a imagem incluir palavras importantes para compreender o conteúdo, as palavras são incluídas na alternativa em texto.

Resultados Esperados

Os passos 2 e 3 são verdadeiros.