Avançar para o conteúdo
SilktideAjuda

Função de apresentação em elemento interativo

O Silktide verifica se existem elementos interativos, como botões, links e campos de formulário, que foram marcados como puramente decorativos. Marcar um elemento interativo desta forma remove o seu significado para tecnologias assistivas, embora ele continue a ser clicável no ecrã.

<!-- Problema: o botão continua a funcionar, mas é anunciado como nada -->
<button role="presentation">Delete</button>

<!-- Correção: remova a função -->
<button>Delete</button>

Por que isso é importante

As funções presentation e none informam à que um elemento não tem significado — elas existem para remover a semântica de elementos como tabelas de layout. Quando aplicadas a um elemento interativo, criam o pior tipo de barreira: um controlo que utilizadores com visão e rato clicam todos os dias, mas que um apresenta como conteúdo inerte ou ignora completamente. O utilizador não tem forma de saber sequer que existe um botão.

Como corrigir

  1. Remova role="presentation" ou role="none" do elemento interativo. Os elementos nativos já expõem o significado correto sem qualquer função.
  2. Se o elemento realmente não deveria ser interativo, torne-o assim: substitua-o por um elemento não interativo, como <div>, e remova qualquer tabindex.
  3. Se estava a tentar suprimir o significado de um elemento contêiner (por exemplo, uma tabela de layout que envolve controlos), coloque a função no contêiner, não nos controlos dentro dele.

Como o Silktide testa isso

  1. Encontra todos os elementos na página com role="presentation" ou role="none".
  2. Determina se o elemento é interativo: um botão, um link ou uma área de mapa de imagem com um href, um campo de formulário ou qualquer elemento colocado na ordem de tabulação do teclado com tabindex igual ou superior a 0.
  3. Comunica cada elemento interativo que tenha uma função de apresentação.

Os elementos retirados da ordem de tabulação com um tabindex negativo não são comunicados, nem os elementos decorativos, como imagens ou gráficos SVG.

Resolução de problemas

Uma estrutura ou biblioteca adicionou a função

Algumas bibliotecas de UI aplicam role="presentation" a contêineres internos e, ocasionalmente, ao elemento errado. Inspecione o elemento comunicado: se ele for realmente operável com o rato, mas estiver silenciado para tecnologias assistivas, a correção deve ser feita na forma como utiliza a biblioteca ou a montante dela.

Esta verificação não comunica nada, embora eu espere resultados

Os testes de ARIA podem ser desativados por website. Verifique as definições avançadas do website.

Saiba mais

Última atualização

Esta página foi útil?