Esta tradução ainda não foi revista editorialmente. A versão alemã é vinculativa. Deutsche Fassung
Acessibilidade
Qual é o tamanho de um botão para os dedos e mãos trêmulas?
Um botão de 20 pixels de altura atinge um dedo no telefone apenas com sorte, uma mão trêmula com o mouse. Nível AA (2.5.8, novo em WCAG 2.2) requer 24 × 24 pixels ou distância suficiente. O critério de nível AAA 2.5.5 requer 44 × 44 pixels CSS para cada alvo operado com um ponteiro. Excluídos estão links no texto de fluxo, elementos com uma alternativa equivalente maior e elementos cujo tamanho o navegador especifica.
O que o critério requer
Cada alvo digitado ou clicado tem pelo menos 44 pixels CSS largos e altos. Isto corresponde a cerca de 9 milímetros em um telefone móvel, a largura de uma ponta do dedo. Excepções: links em uma frase ou parágrafo; alvos para os quais existe uma alternativa equivalente de 44 pixels na mesma página; alvos cujo tamanho não é determinado pelo autor (controle navegador); e alvos para os quais a representação concreta é essencial, como pontos em um mapa.
Para quem isto conta
Pessoas com tremor, artrite, espasticidade ou após o derrame não atingir pequenos alvos ou bater ao lado deles. Ao telefone, isso afeta todos que tocam com o polegar, no ônibus, com uma luva, com um dedo grosso. Os 44 pixels vêm das diretrizes de projeto dos grandes sistemas operacionais e provaram-se como um limite do qual os erros operacionais diminuem significativamente. Objetivos maiores também reduzem a taxa de erro para todos os outros.
É assim que lidamos com isso
Hoje, o núcleo de medição mede cada superfície de operação na área de teste Responsivo ao limite de 24 pixels do nível AA e especifica largura e altura para cada local. A mesma medição diz quais áreas atingem 44 pixels. O critério é automaticamente decidível, com excepção da questão de saber se uma alternativa é equivalente. Pertence à categoria AAA em conhecimento; O relatório estabelece as normas.
Exemplos
Botão com 24 pixels
.symbol-knopf { width: 24px; height: 24px; } /* Stufe AA */.symbol-knopf { min-width: 44px; min-height: 44px; } /* Stufe AAA */44 × 44 pixels CSS por alvo, excluindo intervalos. Estão excluídas as ligações no texto.
- Insira botões, itens de menu e links de ícones com uma altura mínima e largura de 44 pixels (altura mínima, largura mínima) ou equivalente dentro da distância.
- Aumentar a área de clique dos ícones com a depuração interior, não o próprio ícone.
- Deixe links no texto de fluxo como eles são; eles estão excluídos.
- Verifique linhas em tabelas e listas com ações de ícones: existem alvos pequenos mais comuns.
