Tekstavstand

Silktide finner elementer der innebygde stiler låser tekstavstanden – letter-spacing, word-spacing eller line-height – med !important til en verdi under WCAG-minimumet, slik at brukerne ikke kan justere den.

Hvorfor dette er viktig

Personer med dysleksi eller nedsatt syn trenger ofte mer plass mellom teksten for å kunne lese den: høyere linjer og større avstand mellom bokstaver og ord. Dette gjør de ved hjelp av nettleserutvidelser og egendefinerte stilark som overstyrer sidens avstand.

Disse verktøyene legger inn vanlig CSS på forfatternivå. En !important- erklæring i et elements style-attributt slår ut alle regler på forfatternivå, uansett hvor spesifikke de er – det er den ene konstruksjonen på en side som disse verktøyene ikke kan overstyre. Når den låser avstanden under minimumsverdiene, blir brukeren ganske enkelt utestengt.

-suksesskriterium 1.4.12 (nivå AA) krever at innhold tåler at brukerne øker tekstavstanden til minst:

Linjehøyde – 1,5 ganger skriftstørrelsen
Bokstavavstand – 0,12 ganger skriftstørrelsen
Ordavstand – 0,16 ganger skriftstørrelsen

Slik løser du det

For hvert markerte element gjør du ett av følgende:

Fjern !important-flagget fra den innebygde erklæringen. Verktøyene til brukerne kan da overstyre den, og utformingen din er uendret for alle andre.
Flytt erklæringen til et stilark. Selv med !important kan regler i stilark overstyres av brukerens verktøy.
Øk verdien til WCAG-minimumet hvis avstanden faktisk må låses.

<!-- Fails: locked below the minimum; user tools cannot override this -->
<p style="line-height: 1.2 !important">…</p>

<!-- Fixed: overridable -->
<p style="line-height: 1.2">…</p>

<!-- Also fine: locked, but at a value that already meets the minimum -->
<p style="line-height: 1.5 !important">…</p>

Slik tester Silktide dette

Finn elementer hvis style-attributt erklærer letter-spacing, word-spacing eller line-height med !important, og som inneholder synlig tekst direkte.
Beregn den erklærte verdien opp mot elementets skriftstørrelse.
Rapporter elementet når den låste verdien er under WCAG-minimumet for den aktuelle egenskapen.

Dette gjenspeiler W3C ACT-reglene for 1.4.12 (bokstavavstand, ordavstand, linjehøyde).

Silktide markerer ikke !important-avstand i stilark – brukerens verktøy kan fortsatt overstyre dette – og simulerer ikke bruk av avstandsoverstyringene for å oppdage ødelagte layouter, noe ingen automatiserte verktøy gjør i dag. Hvis denne kontrollen består, betyr det at ingenting på siden blokkerer brukerne fra å justere avstanden. Å teste at layouten fortsatt er lesbar med justert avstand, er en rask manuell test med en bokmerkelet for tekstavstand.

Feilsøking

Komponentbiblioteker og skript for innebygging skriver noen ganger innebygde !important-stiler. De teller likevel med på siden din; sjekk leverandørens innstillinger eller ta det opp med leverandøren.

Avstanden er låst til en verdi som oppfyller kravene

Verdier på eller over WCAG-minimumene består selv når de er låst – å låse line-height: 1.6 !important skader ingen, fordi verdien allerede overstiger det brukerne ellers ville økt den til.