Spaziatura del testo

Cosa richiede

Gli utenti con dislessia, ipovisione o disabilità cognitive installano spesso estensioni del browser o fogli di stile personalizzati che allentano la tipografia compressa. Il criterio di successo definisce quattro specifiche sostituzioni — interlinea pari a 1,5 volte la dimensione del carattere, spaziatura tra paragrafi pari a 2 volte la dimensione del carattere, spaziatura tra lettere di 0,12em, spaziatura tra parole di 0,16em — e richiede che la pagina continui a funzionare correttamente quando vengono applicate. Nessun testo troncato, nessun overflow, nessun contenuto mancante.

Come soddisfarlo

• Impostare le altezze dei contenitori con min-height anziché con height fisso, in modo che crescano all’espandersi del testo.
• Evitare altezze in pixel fisse su pulsanti, voci di navigazione, schede e badge — lasciarli crescere con il contenuto.
• Verificare incollando un bookmarklet noto (esiste il bookmarklet WCAG 1.4.12 per la spaziatura del testo) che applica simultaneamente le quattro sostituzioni.
• Consentire al testo di andare a capo naturalmente; non usare white-space: nowrap su etichette che possono espandersi.
• Verificare che i menu di navigazione, le schede e le relative etichette si adattino correttamente quando la spaziatura tra lettere aumenta.

Errori comuni

• Pulsanti con height: 40px che troncano l’etichetta quando l’interlinea cresce fino a 1,5.
• Etichette di schede con white-space: nowrap che escono dal contenitore con una spaziatura tra lettere più ampia.
• Schede con altezze fisse in cui il testo viene nascosto dietro una dissolvenza «continua a leggere».
• Tooltip e badge che troncano il testo quando la spaziatura tra paragrafi aumenta.
• Intestazioni fisse con altezze prefissate che si sovrappongono alla pagina quando il testo di navigazione si espande.

Perché è importante

Questo criterio di successo individua i layout «progettati per un’unica impostazione di spaziatura», in cui il designer ha bloccato tutto sull’interlinea perfetta di Figma. Gli utenti reali degli strumenti di supporto alla lettura applicano costantemente sostituzioni di spaziatura. La correzione di solito consiste nel passare da height a min-height e nel rimuovere white-space: nowrap — modifiche piccole e meccaniche che si ripagano sull’intera interfaccia.