Calculadora de Tamanho de Area Clicavel de Link em mm

Área Clicável de Links em Milímetros

A área de toque (touch target) é o pedaço físico que o usuário precisa acertar com o dedo. Converter pixels CSS em milímetros depende da densidade da tela. Na referência de 96 dpi, 1 px = 25,4 / 96 ≈ 0,2646 mm. De forma geral, mm = (px × 25,4) / dpi, em que dpi é a densidade real do display (digamos, 326 dpi num iPhone Retina).

As principais diretrizes caem todas na mesma faixa, por volta de 7–11 mm por lado. A WCAG 2.2 SC 2.5.5 (AAA) recomenda 44×44 px CSS, que dão cerca de 11,6 × 11,6 mm a 96 dpi. O iOS HIG da Apple pede 44×44 pt ≈ 7,5 × 7,5 mm num Retina de 326 dpi. O Material Design do Google fala em 48×48 dp, algo como 9×9 mm na maioria dos Androids. Na prática, o piso em mobile fica perto de 7×7 mm se você quer fugir dos toques errados.

Aplicações

Recorra a este cálculo quando estiver auditando formulários, barras de navegação, toolbars de ícones, CTAs de anúncios ou qualquer coisa que tenha de ser alcançada com o polegar. Pesa ainda mais com idosos, em auditorias de acessibilidade, totens, HMIs automotivos e terminais POS, onde luva no dedo ou entrada imprecisa fazem parte da rotina.

Perguntas frequentes

Por que o resultado muda com o dpi? O pixel CSS é uma unidade lógica, e seu tamanho físico anda no sentido contrário da densidade da tela. Aumente o dpi e cada pixel CSS encolhe em milímetros reais.

Preciso sempre atingir 44 px? 44 px CSS é a meta AAA da WCAG. O nível AA se contenta com 24×24 px, mas num design mobile-first compensa mirar ao menos os 44 pt do iOS ou os 48 dp do Material.

Espaçamento conta? Conta. A WCAG aceita alvos menores desde que haja ao redor uma zona de exclusão inativa de 24×24 px, o que devolve a mesma tolerância de toque de um alvo maior.