Esta tradução ainda não foi revista editorialmente. A versão alemã é vinculativa. Deutsche Fassung →
Responsive
Qual deve ser o tamanho mínimo dos botões num website?
Botões e hiperligações devem ter pelo menos 24 por 24 pixels — isto é o que exige a regra de acessibilidade WCAG 2.5.8. Superfícies menores são difíceis de acertar com o dedo: no telemóvel quem falha aterr numa hiperligação errada ou desiste. O serviço de verificação mede cada superfície de interação em quatro tamanhos de dispositivo e mostra exemplos de superfícies demasiado pequenas com tamanho medido.
Estas superfícies contam como superfícies de interação
Mede-se tudo o que os visitantes podem clicar ou tocar: botões, hiperligações, campos de entrada e listas de seleção. Hiperligações no meio do texto corrido são exceções — a altura delas resulta da linha de texto, e a norma também permite isto explicitamente. Também excluídas são pequenos elementos auxiliares invisíveis de alguns pixels de tamanho, que alguns websites incluem para leitores de ecrã ou estatísticas; não são alvo do dedo e contá-los produziria falsos alarmes. Restam precisamente as superfícies que uma pessoa realmente tem de acertar: o botão de encomenda, o item de menu, o ícone de busca, o campo para o endereço de correio eletrónico. Para cada uma destas superfícies aplica-se um limite inferior de 24 por 24 pixels.
Assim mede o serviço de verificação o tamanho
A página é construída em quatro tamanhos de dispositivo num navegador real: smartphone com 390, tablet com 768, desktop com 1440 e wide com 1920 pixels de largura. Em cada tamanho a verificação mede a largura e altura realmente apresentadas de cada superfície de interação. Isto é crucial, pois o mesmo botão pode ser grande o suficiente no desktop e encolher no telemóvel. Cada achado é recolhido duas vezes; apenas é reportado o que ambas as medições veem de forma consistente. O relatório mostra até três exemplos com tamanho medido — por exemplo um botão com 18 por 18 pixels — e uma imagem de ecrã do local afetado, para que a superfície seja encontrada sem busca.
Isto traz o tamanho mínimo aos seus visitantes
Grandes superfícies de interação ajudam primeiro pessoas com tremores, destreza manual limitada ou dedos maiores. Mas ajudam todos: num comboio em movimento, com luvas, com o polegar da única mão livre. Quem acerta um botão na primeira tentativa mantém o fluxo — quem toca ao lado três vezes abandona a página. Para uma empresa significa concretamente: o botão «Solicitar orçamento» é pressionado mais vezes se for fácil de acertar. Os 24 pixels são o limite inferior da norma, não um valor ideal; muitos designers escolhem deliberadamente superfícies muito maiores, especialmente para o botão mais importante de uma página.
- Toque nos botões mais importantes do seu website no telemóvel com o polegar e note se acerta à primeira tentativa.
- Preste especial atenção a ícones pequenos: lupa, menu, telefone, setas em galerias de imagens.
- Transmita à sua agência os exemplos do relatório de verificação — aí está o tamanho medido de cada superfície demasiado pequena.
- Deixe que novos botões sejam planeados desde o início com no mínimo 24 por 24 pixels.