Controlli mobili piccoli
Silktide carica ogni pagina su un dispositivo mobile simulato e segnala link, pulsanti e controlli dei moduli troppo piccoli per essere toccati in modo affidabile. I controlli devono essere larghi almeno 12 pixel e alti almeno 12 pixel per superare il controllo.
Perché è importante
Le dita sono meno precise dei puntatori del mouse. Un controllo facile da selezionare sul desktop può essere quasi impossibile da toccare su un telefono: i visitatori sbagliano, toccano invece il link adiacente e finiscono in un punto in cui non intendevano arrivare. Le persone con disabilità motorie, tremori o dita più grandi sono quelle più colpite, ma tutti possono toccare per errore obiettivi molto piccoli.
La soglia di 12 pixel rileva solo i controlli gravemente sottodimensionati; gli obiettivi comodi da toccare sono considerevolmente più grandi (le indicazioni comuni suggeriscono circa 44 pixel).
Come risolvere il problema
- Aumenta le dimensioni del controllo segnalato: usa testo più grande, più spazio interno o una dimensione minima esplicita in :
/* Imposta una dimensione minima confortevole per gli obiettivi da toccare */
a.icon-button {
min-width: 44px;
min-height: 44px;
}
- Per i link contenenti solo icone, aumenta l'area toccabile oltre le dimensioni dell'icona stessa usando lo spazio interno, invece di ingrandire l'icona.
- Se un elemento non dovrebbe essere interattivo, ad esempio un link vuoto rimasto per errore, rimuovilo invece di ridimensionarlo.
Come Silktide esegue il controllo
- Carica la pagina su un dispositivo mobile simulato.
- Trova ogni controllo interattivo: link, aree delle mappe immagine, campi dei moduli, menu a discesa, aree di testo e pulsanti.
- Ignora i controlli nascosti al caricamento della pagina, privi di dimensioni o completamente fuori dallo schermo.
- Misura ogni controllo rimanente e segnala quelli più stretti o più corti di 12 pixel.
Risoluzione dei problemi
L'elemento appare solo dopo un'interazione
Silktide misura la pagina durante il caricamento. I controlli all'interno di menu o pannelli che si aprono in un secondo momento vengono misurati nello stato iniziale, il che può occasionalmente segnalare un elemento durante un'animazione. Se il controllo ha dimensioni adeguate quando è effettivamente utilizzabile, il risultato.
In che modo questo controllo è correlato alle regole WCAG sulle dimensioni degli obiettivi?
Questo controllo riguarda l'usabilità sui dispositivi mobili e utilizza deliberatamente una soglia permissiva. I controlli correlati — Dimensione dell'obiettivo al Livello AA e Dimensione ragionevole dell'obiettivo al — applicano requisiti dimensionali più rigorosi, con eccezioni più articolate.