Textavstånd

Vad kriteriet kräver

Användare med dyslexi, synnedsättning eller kognitiva funktionsnedsättningar installerar ofta webbläsartillägg eller användarstilmallar som vidgar trång typografi. Kriteriet definierar fyra specifika åsidosättningar — radavstånd 1,5 gånger teckenstorleken, styckemellanrum 2x teckenstorleken, bokstavsavstånd 0,12em, ordavstånd 0,16em — och kräver att sidan fortfarande fungerar när de tillämpas. Inget klippt innehåll, inget spill, inget försvunnet innehåll.

Hur du uppfyller det

• Ange behållarhöjder med min-height snarare än fast height så att de växer när texten expanderar.
• Undvik fasta pixelhöjder på knappar, navigeringsposter, kort och märken — låt dem växa med innehållet.
• Testa genom att klistra in ett känt bokmärke (WCAG 1.4.12-textavståndsbokmärket) som tillämpar de fyra åsidosättningarna samtidigt.
• Tillåt text att radbryta naturligt; använd inte white-space: nowrap på etiketter som kan växa.
• Kontrollera att navigationsmenyer, flikar och fliketiketter fortfarande ryms när bokstavsavståndet ökar.

Vanliga fel

• Knappar med height: 40px som klipper etiketten när radavståndet växer till 1,5.
• Fliketiketter med white-space: nowrap som spiller ur sin behållare vid bredare bokstavsavstånd.
• Kort med fasta höjder där text döljs bakom en “läs mer”-toning.
• Verktygstips och märken som klipper sin text när styckemellanrummet ökar.
• Fästa sidhuvuden med fasta höjder som överlappar sidan när deras navigeringstext växer.

Varför det spelar roll

Det här kriteriet fångar layouter “designade för en enda avståndskonfiguration” där designern låste allt till ett Figma-perfekt radavstånd. Verkliga användare av lästödjande verktyg tillämpar avståndsjusteringar konstant. Åtgärden innebär vanligtvis att byta från height till min-height och ta bort white-space: nowrap — små, mekaniska ändringar som ger avkastning i hela gränssnittet.