Técnicas para as WCAG 2.0

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

-

H30: Fornecer texto de link que descreva a finalidade de um link para os elementos anchor

Aplicabilidade

Documentos HTML e XHTML que incluam links, (elementos <a href>).

Esta técnica está relacionada com:

Descrição

O objectivo desta técnica é descrever a finalidade de um link, fornecendo texto descritivo como o conteúdo do elemento a . A descrição permite que um utilizador distinga este link de outros links da página Web e ajuda o utilizador a determinar se deve seguir o link. O URI do destino não costuma ser suficientemente descritivo.

Quando uma imagem é o único conteúdo de um link, a alternativa em texto para a imagem descreve a única função do link.

Quando o conteúdo de um link inclui texto e uma ou mais imagens, se o texto for suficiente para descrever a finalidade do link, as imagens podem ter uma alternativa em texto vazia. (Consulte H67: Utilizar texto alt nulo e nenhum atributo title em elementos img para imagens que a TA deve ignorar (HTML).) Quando as imagens transmitem informações para além da finalidade do link, têm igualmente de ter texto alt apropriado.

Exemplos

Exemplo 1

Descrever a finalidade de um link em HMTL no conteúdo de texto do elemento a .

Código Exemplo:

<a href="routes.html">
  Current routes at Boulders Climbing Gym
</a>

Exemplo 2

Utilizar o atributo alt para o elemento img para descrever a finalidade de um link gráfico.

Código Exemplo:

<a href="routes.html">
   <img src="topo.gif" alt="Current routes at Boulders Climbing Gym" /> 
</a> 

Exemplo 3

Utilizar um atributo alt vazio quando o elemento anchor (a) incluir texto que descreva a finalidade do link para além do elemento img . Tenha em atenção que o texto do link irá aparecer na página junto à imagem.

Código Exemplo:

<a href="routes.html">
  <img src="topo.gif" alt="" />
  Current routes at Boulders Climbing Gym
</a>

Exemplo 4

Um link inclui um ícone e texto, e a ajuda do sítio da Web faz referência ao ícone. O img tem uma alternativa em texto que corresponde ao nome utilizado para o ícone na ajuda do sítio da Web, que descreve como clicar no ícone da página inicial.

Código Exemplo:

<a href="foo.htm">
<img src="house.gif" alt="icon"/>
Home page
</a>

Exemplo 5

Um link inclui texto e um ícone, e o ícone fornece informações adicionais sobre o objectivo.

Código Exemplo:

<a href="WMFP.pdf">
Woodend Music Festival Program
<img src="pdficon.gif" alt="PDF format"/>
</a>

Recursos

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

Testes

Procedimento

Para cada link existente no conteúdo que utilize esta técnica:

  1. Verifique se está incluído um texto ou uma alternativa em texto para o conteúdo não textual no elemento a .

  2. Se um elemento img for o único conteúdo do elemento a, verifique se a respectiva alternativa em texto descreve a finalidade do link.

  3. Se o elemento a incluir um ou mais elementos img e a alternativa em texto dos elementos img estiver vazia, verifique se o texto do link descreve a finalidade do link.

  4. Se o elemento a apenas incluir texto, verifique se o texto descreve a finalidade do link.

Resultados Esperados