Questa traduzione non è ancora stata rivista dalla redazione. Fa fede la versione tedesca. Deutsche Fassung →

Barrierefreiheit

Quanto deve essere grande almeno un pulsante su un sito web?

Un pulsante deve essere almeno 24 per 24 pixel — così richiede il criterio 2.5.8 „Dimensione del bersaglio (Minimo)” introdotto di recente con WCAG 2.2. I bersagli più piccoli falliscono regolarmente con le persone che hanno le mani tremanti o le dita larghe, soprattutto al telefono. Eccetto i link nel testo scorrevole e i bersagli piccoli con spazio libero sufficiente ai bersagli vicini.

24 per 24 pixel: il limite minimo per colpire

Un tocco del dito è meno preciso di un clic del mouse e con tremori o motricità fine limitata lo spread aumenta ulteriormente. Se il bersaglio è troppo piccolo, il tocco manca — nel migliore dei casi non succede nulla, nel peggiore si apre il link vicino. Le zone di problema tipiche sono barre di strumenti con icone fitte, piccole croci di chiusura su finestre di avviso e campi data nei calendari. I 24 per 24 pixel sono il limite minimo, non una misura di comfort. Il criterio prevede due eccezioni: i link nel testo scorrevole possono seguire la dimensione del testo e i bersagli piccoli sono consentiti se c'è abbastanza spazio libero intorno, in modo che un bersaglio vicino non venga toccato accidentalmente.

Come il servizio di verifica misura le dimensioni dei bersagli

Il servizio di verifica misura gli elementi di controllo visibili della pagina — link, pulsanti, campi di modulo — nella loro dimensione effettivamente visualizzata, fino a 300 bersagli per pagina. Su ogni bersaglio troppo piccolo applica le eccezioni del criterio: se si trova come link nel testo scorrevole, non conta; se rimane uno spazio sufficiente intorno al suo centro libero da bersagli vicini, non conta neanche. Se rimane almeno un bersaglio al di sotto di 24 per 24 pixel, il criterio è ritenuto violato — il rapporto nomina il numero, il primo elemento interessato e allega una schermata di prova. Le dimensioni del campione sono riportate come nota di misurazione nel rapporto.

Beispiele

Symbol-Links in einer Zeile

Verstoß

.symbol { width: 16px; height: 16px; margin: 0; }

Erfüllt

.symbol { width: 24px; height: 24px; }
/* oder: 16 px Symbol mit 8 px Abstand zum Nachbarn */

Auf Stufe AA sind 24 × 24 CSS-Pixel die Grenze, oder ein Abstand, der einen 24-Pixel-Kreis um das Ziel frei hält. Links im Fließtext sind ausgenommen.

Testate il vostro sito web sul telefono con il pollice: colpite ogni simbolo nell'area dell'intestazione al primo tentativo?
Ingrandite la superficie di tocco di piccoli simboli tramite uno spaziamento interno invisibile — il simbolo può sembrare piccolo, la superficie deve essere grande.
Controllate le croci di chiusura di finestre di avviso e banner di cookie — sono tra i bersagli troppo piccoli più comuni.
Lasciate spazio libero sufficiente tra bersagli piccoli vicini, se un ingrandimento non è possibile dal punto di vista progettuale.

Deutsche Fassung dieser Seite

FAQ

Quale dimensione minima richiedono le WCAG per i pulsanti?

Il criterio 2.5.8 di WCAG 2.2 richiede almeno 24 per 24 pixel per le superfici di controllo — pulsanti, icone collegate, elementi di modulo. Ci sono due eccezioni: i link nel testo scorrevole possono seguire la dimensione del testo e bersagli più piccoli sono consentiti se c'è spazio libero sufficiente ai bersagli vicini. La specificazione si riferisce alla superficie effettivamente toccabile, non solo al simbolo visibile.

Perché i pulsanti troppo piccoli sono un problema di accessibilità?

Perché colpire un bersaglio richiede precisione: un tocco di dito si disperde più di un clic del mouse, con tremori, malattie articolari o su un autobus in movimento ancora di più. I bersagli troppo piccoli vengono mancati o si colpisce il link vicino — da „apri carrello” diventa „esci dal conto”. Le superfici sufficientemente grandi rendono il funzionamento più sicuro per tutti, non solo per le persone con limitazioni.

Come un piccolo simbolo può comunque soddisfare la dimensione minima?

Sulla superficie del tocco: il simbolo visibile può rimanere piccolo se la superficie cliccabile intorno ad esso — tramite spaziatura interna invisibile — misura almeno 24 per 24 pixel. In alternativa, lo spazio libero sufficiente ai bersagli vicini è sufficiente secondo il criterio, in modo che un tocco sbagliato vada nel vuoto invece che sul link sbagliato.