Standardit · WCAG 2.2

SC 1.4.8 Taso AAA WCAG 2.0

Visuaalinen esitystapa

Tekstilohkoissa käyttäjien on voitava säätää etu- ja taustaväriä, rivin leveyttä (enintään 80 merkkiä), tasausta (ei molemmilta reunoilta), riviväliä (1,5-kertainen) ja kappaleiden väliä (1,5-kertainen riviväli) — ilman vaakasuuntaista vieritystä 200 % zoomauksella.

Mitä vaaditaan

Pitkämuotoisen tekstisisällön osalta onnistumiskriteeri sisältää viisi vaatimusta: käyttäjät voivat valita etu- ja taustavärin; rivin pituus ei ylitä 80 merkkiä (40 kiinan, japanin ja korean kirjoitusjärjestelmille); teksti ei ole molemmilta reunoilta tasattua; riviväli on vähintään 1,5 kappaleiden sisällä ja kappaleiden välinen väli on vähintään 1,5-kertainen rivikorkeus; ja teksti voidaan suurentaa 200 %:iin ilman vaakasuuntaista vieritystä ja ilman avustavaa teknologiaa.

Miten täyttää vaatimus

  • Rajoita lukusarakkeita noin 60–75 merkkiin riviä kohden englanninkielisessä leipätekstissä.
  • Käytä vasemmalle tasattua tekstiä (tai oikealle tasattua RTL-kielissä), ei text-align: justify -arvoa.
  • Aseta line-height vähintään 1,5:een leipätekstissä ja käytä rehellistä margin-bottom-arvoa kappaleiden välillä.
  • Tarjoa käyttäjäkohtainen teema tai noudata prefers-color-scheme-asetusta, jotta etu- ja taustavärit ovat käyttäjän hallittavissa.
  • Testaa 200 % zoomauksella: tekstin tulee virrata sarakkeen sisällä ilman vaakasuuntaista vieritystä.

Yleisiä virheitä

  • Aikakausilehtityylinen, molemmilta reunoilta tasattu teksti, joka tuottaa valkoisia “jokia” ja hidastaa lukemista.
  • Leipäteksti laajoissa säilöissä, joissa on yli 120 merkkiä rivillä.
  • line-height: 1.2 -arvo, joka ahtaa rivit yhteen ja vaikeuttaa heikkonäköisten lukemista.
  • Ei teemavalitsinta eikä prefers-color-scheme-tukea.

Miksi tämä on tärkeää

AAA-taso, harvoin sopimusvaatimus. Mutta taustalla oleva neuvo — lyhyet rivit, runsas välistys, ei molemminpuolista tasausta — on vain hyvää typografiaa. Tämän onnistumisskriteerin täyttäminen on sivuvaikutus, kun suunnittelun lähtökohtana on luettavuus eikä tiheys.