Verificador de tamanho mínimo para alvo de toque
Um botão de 48 por 44 pontos passa no mínimo padrão de 44 por 44 nos dois lados; um de 40 por 52 reprova e mostra que faltam 4 pontos de largura. Cada lado é avaliado separadamente. Grátis no seu navegador.
- Grátis
- Funciona no seu navegador
- Sem cadastro
- Seus dados não saem do seu aparelho
Executar grátis
Exemplo resolvido
- Largura
- 48 pt
- Altura
- 44
- Largura mínima
- 44 pt
- Altura mínima
- 44
- Déficit de largura
- 0
- Déficit de altura
- 0
O verificador de tamanho de alvos de toque compara a largura e a altura renderizadas de um botão, link, controle de ícone ou outro elemento interativo com o mínimo escolhido por você. O padrão é 44 por 44 pontos, uma referência comum no design para dispositivos móveis, mas você pode informar outro limite e outra unidade. O resultado mostra a aprovação de cada dimensão, a conclusão geral e a diferença exata a corrigir.
Meça o alvo interativo, não apenas o ícone visível
A acessibilidade por toque diz respeito à área que responde ao comando. Um ícone pequeno pode estar dentro de um botão com preenchimento confortável; por isso, medir apenas a arte pode fazer um bom controle parecer inadequado. O contrário também ocorre: um ícone pode parecer grande, embora seu elemento clicável ocupe uma caixa menor.
Inspecione o elemento interativo renderizado e informe a largura e a altura dele. Mantenha os quatro valores de tamanho na mesma unidade. O verificador adota pontos e um mínimo de 44 por 44, mas não converte silenciosamente pontos, pixels, pixels independentes de densidade ou milímetros, pois essas unidades dependem do design e do ambiente de execução.
A unidade fica registrada no resultado para manter os relatórios claros. Largura e altura devem ser números positivos e finitos. Zero, valores negativos, dimensões ausentes, texto e números não finitos são rejeitados, em vez de gerar uma conclusão de acessibilidade enganosa.
Assim, a saída atende a revisões manuais, verificações de sistemas de design e testes automatizados determinísticos.
Interprete as verificações e as diferenças das dimensões
Um alvo de toque só é aprovado quando as duas dimensões atingem ou superam seus respectivos mínimos. Quando uma dimensão falha, sua diferença informa exatamente quanto deve ser acrescentado na unidade selecionada; uma dimensão aprovada tem diferença zero. A igualdade conta como aprovação, portanto 44 por 44 atende exatamente ao limite padrão.
O cálculo compara as dimensões separadamente, sem considerar um retângulo de área igual como equivalente a um quadrado. Essa distinção é importante no toque, pois um alvo muito estreito ou baixo continua difícil de alcançar mesmo com área numericamente grande. Não há arredondamento; medições decimais e mínimos personalizados preservam a precisão enviada por você.
Escolha o mínimo adequado à sua norma
Sistemas de design e critérios de acessibilidade publicam tamanhos de alvo diferentes, e unidades parecidas não são automaticamente intercambiáveis. Use o padrão de 44 por 44 pontos quando essa for a regra que você deseja verificar. Por exemplo, uma equipe que siga uma convenção de 48 por 48 pixels independentes de densidade pode definir os dois mínimos como 48 e selecionar dp.
Uma auditoria da web pode escolher px e informar o limite em pixels CSS exigido pelo critério adotado. O verificador apresenta uma comparação geométrica; ele não afirma que um único padrão comprova conformidade com todas as normas de acessibilidade e não avalia exceções de espaçamento, alvos sobrepostos, zoom, gestos alternativos ou o tamanho de controles próximos. Esses pontos exigem análise do layout e da interação.
Use o resultado como uma verificação específica e reproduzível dentro desse processo mais amplo.
Casos de uso
Revisar uma especificação de design móvel
Compare as dimensões propostas para botões e controles de ícone com o mínimo de toque adotado pelo sistema de design do produto.
Fazer a triagem de uma auditoria de acessibilidade
Transforme dimensões medidas em resultados separados de largura e altura, com diferenças exatas para os chamados de correção.
Testar componentes do sistema de design
Use resultados determinísticos em verificações automáticas das variantes compacta, normal e grande antes do lançamento.
Perguntas frequentes
A ferramenta converte pontos, pixels, dp e milímetros?
Não. As dimensões do elemento e os mínimos devem usar a mesma unidade selecionada, evitando conversões dependentes do contexto.
Devo medir o ícone ou a área clicável?
Meça toda a área interativa de toque, inclusive o preenchimento clicável, e não apenas o ícone ou rótulo visível.
A aprovação garante conformidade de acessibilidade?
Não. Ela verifica somente as dimensões fornecidas diante do mínimo indicado. Espaçamento, exceções, gestos e outros requisitos precisam de análise própria.
Por que um botão de 40 por 52 pontos reprova no mínimo de 44 por 44?
Porque largura e altura são comparadas separadamente. A altura passa, mas faltam 4 pontos de largura, e uma área maior não compensa um lado estreito: um alvo fino continua difícil de acertar com o dedo.
Posso conferir com 48 dp em vez de 44 pontos?
Pode. Coloque os dois mínimos em 48, escolha dp como unidade e informe o tamanho do elemento também em dp. Os quatro valores precisam estar na mesma unidade, porque a verificação não converte unidades.
Ferramentas relacionadas
Para desenvolvedores — acesso via API
Tudo nesta página está disponível via API. Esta seção é para equipes que querem integrar a ferramenta aos próprios sistemas; quem não precisa disso pode simplesmente usar a ferramenta acima.
Endpoint
Autenticação por token Bearer. Um único POST coloca a tarefa na fila; o resultado chega por webhook ou link assinado.
Chame do seu código
curl -X POST https://api.kit.forhosting.com/verify/touch-target-size-check \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"width":48,"height":48}'const res = await fetch("https://api.kit.forhosting.com/verify/touch-target-size-check", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"width": 48,
"height": 48
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/verify/touch-target-size-check",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"width": 48,
"height": 48
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/verify/touch-target-size-check", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"width":48,"height":48}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"width":48,"height":48}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/verify/touch-target-size-check", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Exemplo de requisição
{
"width": 48,
"height": 48
}Exemplo de resposta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "verify.touch_target_size_check",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}A API é assíncrona: cada chamada devolve um task_id na hora. Se preferir polling, consulte o status a até 1 requisição por segundo.
Preço
Preço publicado, sem tokens nem créditos escondidos. Tarefa que falha não é cobrada.
Erros
| HTTP | Código | O que significa |
|---|---|---|
401 | unauthorized | Token ausente ou inválido. Confira o header Authorization. |
402 | insufficient_balance | Saldo insuficiente para esta tarefa. Faça uma recarga e tente de novo. |
404 | unknown_type | Esse tipo de tarefa não existe. Confira o campo type no catálogo. |
429 | rate_limited | Muitas requisições em pouco tempo. Espere um instante e tente de novo. |
Notas técnicas
Interprete as verificações e as diferenças das dimensões
A resposta separa width_passes e height_passes porque um controle largo, porém baixo, ainda exige atenção, mesmo que sua área total pareça generosa. meets_minimum só é verdadeiro quando os dois indicadores são verdadeiros. Por exemplo, um alvo de 40 por 52 pontos diante de um mínimo de 44 por 44 é reprovado no geral: a altura passa, a largura não, e width_shortfall é 4.
Escolha o mínimo adequado à sua norma
Se o seu produto definir outro alvo, informe minimum_width e minimum_height explicitamente, na mesma unidade do elemento medido. Como o algoritmo não usa rede, relógio, aleatoriedade ou consulta ao dispositivo, a mesma entrada sempre produz a mesma saída no navegador e pela API.
Perguntas técnicas
Qual mínimo o verificador usa por padrão?
O padrão é 44 por 44 pontos. Defina minimum_width, minimum_height e unit quando sua norma adotar outro limite.
O alvo passa se apenas uma dimensão for grande o bastante?
Não. Largura e altura são verificadas separadamente, e meets_minimum só é verdadeiro quando ambas passam.
Quanto custa usar a API?
O acesso pela API começa em US$ 0,002 por solicitação. A versão no navegador executa localmente o mesmo cálculo determinístico.