Esta tradução ainda não foi revista editorialmente. A versão alemã é vinculativa. Deutsche Fassung →
Barrierefreiheit
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.
Beispiele
Symbol-Links in einer Zeile
.symbol { width: 16px; height: 16px; margin: 0; }.symbol { width: 24px; height: 24px; }
/* oder: 16 px Symbol mit 8 px Abstand zum Nachbarn */Auf Stufe AA sind 24 × 24 CSS-Pixel die Grenze, oder ein Abstand, der einen 24-Pixel-Kreis um das Ziel frei hält. Links im Fließtext sind ausgenommen.
- 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.