Saltar para o conteúdo
EUID Serviço de auditoria & selo, Página inicial
Mandar auditar o seu sítio

Esta tradução ainda não foi revista editorialmente. A versão alemã é vinculativa. Deutsche Fassung

Acessibilidade

Qual é o tamanho mínimo que um botão deve ter num sítio Web?

Um botão deve ter no mínimo 24 vezes 24 pixels — é o que o critério 2.5.8 recém-introduzido em WCAG 2.2 «Tamanho do alvo (Mínimo)» exige. Alvos mais pequenos são regularmente falhados por pessoas com mãos tremendo ou dedos largos, especialmente no telefone. Excepção: ligações no texto em fluxo e pequenos alvos com espaço livre suficiente para os alvos vizinhos.

24 vezes 24 pixels: o limite inferior para acertar

Um toque com o dedo é menos preciso do que um clique do rato, e com tremor ou motricidade fina limitada, a dispersão aumenta ainda mais. Se o alvo for demasiado pequeno, o toque falha — no melhor dos casos, nada acontece, no pior abre a ligação vizinha. Zonas problemáticas típicas são barras de ferramentas de símbolos com ícones próximos, pequenas cruzes de fecho em janelas de aviso e campos de data em calendários. Os 24 vezes 24 pixels são o limite inferior, não uma medida de conforto. O critério prevê duas excepções: as ligações no texto em fluxo podem seguir o tamanho do texto, e pequenos alvos são permitidos se há espaço livre suficiente à sua volta, de modo que nenhum alvo vizinho seja inadvertidamente atingido.

Assim o serviço de verificação mede o tamanho do alvo

O serviço de verificação mede os elementos de controlo visíveis da página — ligações, botões, campos de formulário — no seu tamanho efetivamente exibido, até 300 alvos por página. A cada alvo demasiado pequeno aplica as excepções do critério: se está como ligação no texto em fluxo, não conta; se um círculo suficiente permanece livre à sua volta de alvos vizinhos, também não conta. Se permanecer pelo menos um alvo com menos de 24 vezes 24 pixels, o critério é violado — o relatório indica o número, o primeiro elemento afectado e anexa uma captura de ecrã de comprovação. O tamanho da amostra é mencionado como uma nota de medição no relatório.

Exemplos

Ligações de símbolos numa linha

Não encontrado
.symbol { width: 16px; height: 16px; margin: 0; }
Realizado
.symbol { width: 24px; height: 24px; }
/* oder: 16 px Symbol mit 8 px Abstand zum Nachbarn */

No nível AA, 24×24 CSS pixels são o limite, ou distância, que mantém um círculo de 24 pixels livre em torno do alvo. Estão excluídas as ligações no texto.

  • Teste o seu site no telefone com o polegar: acerta em cada símbolo no cabeçalho na primeira tentativa?
  • Aumente a superfície de toque de símbolos pequenos através de espaçamento interno invisível — o símbolo pode parecer pequeno, a superfície tem de ser grande.
  • Verifique as cruzes de fecho de janelas de aviso e banners de cookies — estão entre os alvos demasiado pequenos mais comuns.
  • Deixe espaço livre suficiente entre alvos vizinhos pequenos se uma ampliação não for possível esteticamente.

Deutsche Fassung dieser Seite

  • Selo Digitale Barrierefreiheit
  • Selo Daten & Recht
  • Selo Technische Qualität
  • Selo Digital Excellence
  • Selo Cyberversicherung

Auditado. Por um futuro digital melhor.euid.com