SC 3.1.1 Taso A WCAG 2.0

Sivun kieli

Jokaisen sivun oletuskieli on määritettävä ohjelmallisesti — yleensä html-elementin lang-attribuutilla. Ruudunlukuohjelmat, pistenäytöt ja käännöstyökalut käyttävät sitä valitakseen oikean ääntämisjärjestelmän, ääniprofiilin ja merkkikoodauksen.

Mitä vaaditaan

Jokaisen verkkosivun on ilmoitettava oletuskielensä tavalla, jonka avustava teknologia pystyy lukemaan. HTML:ssä tämä tarkoittaa kelvollista lang-attribuuttia juuri-<html>-elementissä, asetettuna BCP 47:n ensisijaiseen kielen alatunnisteeseen (en, de, bg, zh-Hans). Arvon on vastattava tekstisisällön todellista oletuskieltä — ei sisällönhallintajärjestelmän kieltä eikä palvelimen sijaintimaan kieltä.

Sivu, joka yhdistelee kieliä, on silti yhden oletuskielen sivu; toissijaiset kielet käsitellään onnistumiskriteerin 3.1.2 (Osien kieli) avulla.

Kuinka täyttää vaatimus

Lisää lang jokaisen sivun <html>-elementtiin: <html lang="fi">.
Käytä oikeaa BCP 47:n alatunnistetta. Käytä en:ää yleiselle englanniksi; käytä en-GB:tä tai en-US:ia vain, jos alueellinen ääntäminen on merkityksellistä.
Kiinankielisissä, erottele kirjoitusjärjestelmä: zh-Hans (yksinkertaistettu), zh-Hant (perinteinen).
Oikealta vasemmalle kirjoitettaville kielille (arabia, heprea, persia) yhdistä lang dir="rtl":ään.
React/Next.js/Astrossa aseta attribuutti juuri-asettelupohjaan, ei _document-rungossa, jotta jokainen reitti perii sen.
Monikielisissä sivustoissa vaihda lang reitin mukaan — älä koskaan tarjoile yhtä globaalia oletusta lokalisoiduille sivuille.

Yleisiä virheitä

lang puuttuu kokonaan — yleisin virhe vanhoilla ja sisällönhallintajärjestelmistä mallinnetuilla sivuilla.
lang="" (tyhjä arvo) tai lang="suomi" — ei kelvollinen; vain BCP 47:n alatunnisteet ovat vaatimustenmukaisia.
Kaikki sivut kovakoodattu lang="en":ksi, vaikka sisältö on saksaa, ranskaa tai bulgariaa.
Ranskankielinen sivu, jolla on lang="en", koska sisällönhallintajärjestelmän pohja toimitetaan englannin oletuksella eikä kukaan ole muuttanut sitä.
lang asetettu <body>-elementtiin <html>-elementin sijaan — jotkut työkalut hyväksyvät tämän, mutta se ei ole kanoninen sijainti.

Miksi tämä on tärkeää

Ruudunlukuohjelmat käyttävät lang-attribuuttia valitakseen oikean äänisyntesaattorin. Väärän kielen ilmoittamisella englanninkielinen ruudunlukija lukee saksankielistä tekstiä foneettisesti — „Schmetterling“ tulee ulos merkityksettöminä tavuina. Pistenäytöt käyttävät sitä valitakseen oikeat lyhennystaulukot. Selainten käännösominaisuudet käyttävät sitä havaitsemaan, mistä kielestä käännetään. Hakukoneet käyttävät sitä sijoitteluun ja katkelmaluontiin.

Tämä on 30 sekunnin korjaus, joka avaa ymmärtämisen kaikille sivun ruudunlukuohjelmien käyttäjille — ja silti se puuttuu merkittävältä osalta tuotantosivustoja. Se on yksi useimmin siteeratuista ongelmista automaattisissa auditoinneissa, koska se on binaarinen ja helppo havaita.