Verifica della dimensione minima del target tattile
Lo strumento di verifica dei target tattili confronta la larghezza e l’altezza visualizzate di un pulsante, link, controllo a icona o altro elemento interattivo con il minimo scelto da Lei.
Esegui gratis nel browser
Il valore predefinito è 44 per 44 punti, un riferimento comune nel design mobile, ma è possibile indicare un’altra soglia e un’altra unità. Il risultato mostra l’esito per ogni dimensione, l’esito complessivo e lo scarto esatto da correggere.
Misuri il target interattivo, non soltanto l’icona visibile
L’accessibilità tattile riguarda l’area che risponde al tocco. Una piccola icona può trovarsi dentro un pulsante con un’imbottitura adeguata; misurare solo la grafica farebbe sembrare insufficiente un controllo corretto. Può accadere anche il contrario: un’icona può apparire grande mentre il relativo elemento cliccabile occupa un riquadro più piccolo. Ispezioni l’elemento interattivo visualizzato e ne inserisca larghezza e altezza. Mantenga tutti e quattro i valori dimensionali nella stessa unità. Lo strumento usa per impostazione predefinita i punti e un minimo di 44 per 44, ma non converte implicitamente punti, pixel, pixel indipendenti dalla densità o millimetri, perché tali unità dipendono dal design e dal contesto di esecuzione. L’unità viene riportata nel risultato affinché i report siano comprensibili. Larghezza e altezza devono essere numeri positivi e finiti. Zeri, valori negativi, dimensioni mancanti, testo e numeri non finiti vengono rifiutati anziché generare una conclusione fuorviante sull’accessibilità. L’output è quindi adatto a revisioni manuali, controlli dei sistemi di design e test automatizzati deterministici.
Interpreti i controlli dimensionali e gli scarti
Un target tattile supera la verifica solo quando entrambe le dimensioni raggiungono o superano i rispettivi minimi. La risposta distingue width_passes e height_passes perché un controllo largo ma basso richiede comunque attenzione, anche se la sua area totale sembra generosa. meets_minimum è vero soltanto quando entrambi gli indicatori sono veri. Se una dimensione non supera la verifica, lo scarto indica esattamente quanto aggiungere nell’unità selezionata; una dimensione conforme presenta uno scarto pari a zero. Per esempio, un target di 40 per 52 punti rispetto a un minimo di 44 per 44 fallisce nel complesso: l’altezza passa, la larghezza no e width_shortfall vale 4. L’uguaglianza è considerata conforme, quindi 44 per 44 raggiunge esattamente la soglia predefinita. Il calcolo confronta separatamente le dimensioni, senza equiparare al quadrato un rettangolo della stessa area. La distinzione è importante per il tocco: un target molto stretto o basso resta difficile da acquisire anche con un’area numericamente grande. Non viene applicato alcun arrotondamento, quindi misure decimali e minimi personalizzati conservano la precisione fornita da Lei.
Scelga il minimo adatto allo standard adottato
I sistemi di design e i criteri di accessibilità pubblicano dimensioni dei target differenti, e unità dall’aspetto simile non sono automaticamente intercambiabili. Usi il valore predefinito di 44 per 44 punti quando corrisponde alla regola da controllare. Se il prodotto prevede un altro target, specifichi minimum_width e minimum_height nella stessa unità dell’elemento misurato. Per esempio, un gruppo che verifica una convenzione di 48 per 48 pixel indipendenti dalla densità può impostare entrambi i minimi su 48 e selezionare dp. Un audit web può scegliere px e indicare la soglia in pixel CSS richiesta dal criterio adottato. Lo strumento restituisce un confronto geometrico; non sostiene che un singolo valore predefinito dimostri la conformità a ogni standard e non valuta eccezioni di spaziatura, target sovrapposti, comportamento dello zoom, gesti alternativi o controlli vicini. Questi aspetti richiedono una revisione del layout e dell’interazione. Usi il risultato come controllo mirato e riproducibile all’interno di tale processo più ampio. Poiché l’algoritmo non usa rete, orologio, casualità o rilevamento del dispositivo, lo stesso input produce sempre lo stesso output nel browser e tramite API.
Casi d'uso
Rivedere una specifica di design mobile
Confronti le dimensioni proposte per pulsanti e controlli a icona con il minimo tattile adottato dal sistema di design del prodotto.
Classificare un audit di accessibilità
Trasformi le dimensioni misurate in risultati distinti per larghezza e altezza, con scarti esatti per le attività correttive.
Testare i componenti del sistema di design
Impieghi risultati deterministici nei controlli automatici delle varianti compatte, normali e grandi prima del rilascio.
Domande frequenti
Quale minimo usa lo strumento per impostazione predefinita?
Il valore predefinito è 44 per 44 punti. Imposti minimum_width, minimum_height e unit se il Suo standard usa un’altra soglia.
Il target passa se una sola dimensione è abbastanza grande?
No. Larghezza e altezza vengono controllate separatamente, e meets_minimum è vero solo quando entrambe passano.
Lo strumento converte punti, pixel, dp e millimetri?
No. Dimensioni dell’elemento e minimi devono usare la stessa unità selezionata, evitando conversioni dipendenti dal contesto.
Devo misurare l’icona o l’area cliccabile?
Misuri l’intera area interattiva, inclusa l’imbottitura cliccabile, non soltanto l’icona o l’etichetta visibile.
Il superamento garantisce la conformità all’accessibilità?
No. Vengono verificate solo le dimensioni fornite rispetto al minimo indicato. Spaziatura, eccezioni, gesti e altri requisiti richiedono controlli separati.
Quanto costa utilizzare l’API?
L’accesso tramite API parte da $0.002 per richiesta. La versione nel browser esegue localmente lo stesso calcolo deterministico.
Per sviluppatori — accesso via API
Tutto quello che vedi in questa pagina è disponibile anche via API. Questa sezione è per i team che vogliono integrarlo nei propri sistemi; chi non ne ha bisogno può semplicemente usare lo strumento qui sopra.
Endpoint
Autenticazione con Bearer token: un POST mette in coda l'attività e il risultato arriva via webhook o link firmato.
Chiamala dal tuo stack
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)Esempio di richiesta
{
"width": 48,
"height": 48
}Esempio di risposta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "verify.touch_target_size_check",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}L'API è asincrona: ricevi subito un task_id e puoi fare polling fino a 1 richiesta al secondo.
Prezzi
Prezzo pubblicato, senza token né crediti. Se l'attività fallisce, non paghi.
Errori
| HTTP | Codice | Significato |
|---|---|---|
401 | unauthorized | Chiave API mancante o non valida: controlla l'header Authorization. |
402 | insufficient_balance | Credito esaurito: ricarica per continuare a eseguire attività. |
404 | unknown_type | Tipo di attività sconosciuto: controlla il campo type della richiesta. |
429 | rate_limited | Troppe richieste in poco tempo: rallenta e riprova tra qualche secondo. |