WCAG framgångskriterier · Level A
WCAG 3.1.1: Sidans språk
WCAG 3.1.1 kräver att det går att fastställa den huvudsakliga mänskliga språkinställningen för varje webbsida programmatiskt, främst genom att ange ett giltigt lang-attribut på HTML-elementet. Detta gör det möjligt för hjälpmedel som skärmläsare att uttala innehållet korrekt och hjälper användare med kognitiva och språkliga funktionsnedsättningar att förstå sidan.
Vad Denna Regel Innebär
WCAG 3.1.1 — Sidans språk är ett framgångskriterium på nivå A under principen Förståelig. Det kräver att det primära mänskliga språket för varje webbsida exponeras på ett sätt som gör att hjälpmedelstekniker kan upptäcka det programmatiskt. I praktiken innebär detta nästan alltid att man placerar ett giltigt lang-attribut direkt på sidans <html>-element.
Värdet för lang-attributet måste vara en giltig BCP 47-språktagg. BCP 47-taggar består av en primär språksubtagg (såsom en för engelska, tr för turkiska, fr för franska) och eventuellt en regionsubtagg separerad med ett bindestreck (såsom en-US, tr-TR eller pt-BR). Språktaggen måste korrekt återspegla det dominerande språk som sidans innehåll är skrivet på. En sida som huvudsakligen är skriven på turkiska måste deklarera lang='tr' eller lang='tr-TR'; en sida skriven på engelska måste deklarera lang='en' eller en regional variant.
En sida klarar detta kriterium när <html>-elementet har ett lang-attribut vars värde är en icke-tom, syntaktiskt giltig BCP 47-språktagg som korrekt identifierar sidans primära språk. En sida underkänns när lang-attributet helt saknas, när värdet är tomt (lang='') eller när värdet inte är en erkänd BCP 47-språktagg (till exempel lang='turkish' eller lang='en_US' med ett understreck i stället för ett bindestreck).
För XHTML-sidor som levereras med en XML MIME-typ bör både lang-attributet och XML-namnområdesattributet xml:lang finnas, och deras värden måste stämma överens. En avvikelse mellan de två — såsom lang='en' tillsammans med xml:lang='tr' — utgör ett misslyckande både för detta kriterium och den relaterade axe-core-regeln html-xml-lang-mismatch.
WCAG anger uttryckligen ett undantag: om sidan är rent dekorativ, är en CAPTCHA som avsiktligt saknar urskiljbart språk, eller består helt av icke-språkligt innehåll (såsom en sida som endast är en bild utan text), kan den sakna ett fastställbart språk. Detta undantag är dock snävt, och den stora majoriteten av verkliga sidor innehåller tillräckligt med text för att kräva en språkdeklaration.
Varför Det Är Viktigt
De primära mottagarna av ett korrekt deklarerat sidans språk är skärmläsaranvändare, varav de flesta är blinda eller har grav synnedsättning. Skärmläsare som NVDA, JAWS och VoiceOver använder lang-attributet för att välja lämplig text-till-tal (TTS)-röst och uttalsmotor. När en turkisk användare besöker en sida som korrekt deklarerar lang='tr' växlar deras skärmläsare till en turkisk TTS-röst och tillämpar korrekt turkisk fonologi, betoning och diakritiska tecken. Utan denna deklaration kan en skärmläsare falla tillbaka på användarens systemspråk eller på ett helt felaktigt språk, vilket ger ett gibberish-liknande uttal som gör innehållet obegripligt.
Föreställ dig ett konkret scenario: en synskadad turkisk medborgare besöker en offentlig institutions webbplats för att ladda ner en blankett från myndigheten. Webbplatsen utelämnar lang-attributet. Användarens NVDA-installation använder som standard en engelsk TTS-profil. Turkiska ord läses upp med engelsk fonologi — ord som "şehir" (stad) eller "başvuru" (ansökan) blir oigenkännliga. Användaren kan inte fylla i blanketten utan seende assistans, vilket motverkar hela syftet med den digitala tjänsten.
Användare med kognitiva och inlärningssvårigheter gynnas också. Webbläsare använder lang-attributet för att erbjuda korrekta översättningsförslag; vissa användare med dyslexi förlitar sig på webbläsarbaserade översättningsverktyg för att omvandla innehåll till ett språk de har lättare att bearbeta. Ett felaktigt eller saknat lang-attribut gör att dessa verktyg felidentifierar källspråket, vilket ger dåliga översättningar eller inget erbjudande om översättning alls.
Användare med motoriska funktionsnedsättningar som förlitar sig på röststyrningsprogram som Dragon NaturallySpeaking är beroende av att programvaran korrekt tolkar sidans språk för att matcha talade kommandon mot text på skärmen. Ett felidentifierat sidans språk bryter denna matchning.
Utöver tillgänglighet finns konkreta SEO-fördelar: sökmotorer använder lang-attributet som en av flera signaler för att avgöra en sidas målspråk och region, vilket förbättrar träffsäkerheten i lokalanpassade sökresultat. Korrekt språktaggning förbättrar också tillförlitligheten hos webbläsares stavnings- och grammatikkontroll för alla användare, inte bara dem som använder hjälpmedelsteknik. Enligt Världshälsoorganisationen har cirka 2,2 miljarder människor globalt någon form av synnedsättning, varav en betydande del förlitar sig på skärmläsare — vilket gör korrekt språkdeklaration till en av de mest effektfulla och minst arbetskrävande tillgänglighetsförbättringarna som finns.
Relaterade Axe-core-regler
- html-has-lang — Denna regel kontrollerar om
<html>-elementet över huvud taget har ettlang-attribut. Den flaggar alla sidor därlang-attributet helt saknas på den rotande<html>-taggen, oavsett om attributet förekommer någon annanstans i dokumentet. Detta är en av de vanligaste och mest betydelsefulla automatiska träffarna, eftersom åtgärden är att lägga till ett enda attribut. - html-lang-valid — Denna regel kontrollerar om värdet på
lang-attributet på<html>-elementet är en giltig BCP 47-språktagg. Den flaggar värden som inte är erkända språkkoder, såsomlang='turkish'(som använder det fullständiga engelska namnet i stället för ISO 639-1-kodentr),lang='en_US'(som använder understreck som avskiljare i stället för bindestreck) ellerlang='xx'(en platshållare utan tilldelat språk). Ettlang-attribut som finns men innehåller ett ogiltigt värde är lika problematiskt som ett saknat attribut, eftersom hjälpmedelstekniker inte pålitligt kan agera utifrån det. - html-xml-lang-mismatch — Denna regel gäller specifikt XHTML-sidor som har både ett
lang-attribut och ettxml:lang-attribut på<html>-elementet. Den flaggar fall där de två attributen anger olika språkkoder — till exempellang='en'ochxml:lang='tr'. När dessa värden står i konflikt får hjälpmedelstekniker och XML-processorer motstridiga signaler och kan bete sig oförutsägbart. Båda värdena måste ange samma primära språksubtagg.
Även om dessa tre regler täcker de vanligaste programmatiska felen kan automatiserade verktyg inte verifiera semantisk korrekthet — det vill säga, de kan inte avgöra om det deklarerade språket faktiskt stämmer överens med språket som sidan är skriven på. En sida som är helt skriven på turkiska men deklarerar lang='en' kommer att klara alla tre axe-core-reglerna, men den kommer ändå att underkännas enligt WCAG 3.1.1, eftersom det deklarerade språket inte återspeglar sidans faktiska primära språk. Manuell granskning krävs därför alltid tillsammans med automatiserad skanning för att bekräfta att det deklarerade språket är korrekt.
Hur Man Testar
- Automatisk skanning med axe DevTools eller Lighthouse: Öppna sidan i Chrome eller Firefox. Öppna DevTools (F12), gå till panelen för axe DevTools eller fliken Lighthouse och kör en fullständig tillgänglighetsgranskning. Titta specifikt efter överträdelser under reglerna
html-has-lang,html-lang-validochhtml-xml-lang-mismatch. Axe kommer att markera<html>-elementet och beskriva det specifika felet. Lighthouse kommer att lyfta fram liknande problem under sin kategori Accessibility. Notera alla flaggade överträdelser och deras rekommenderade åtgärder. - Manuell källkodsinspektion: Visa sidans källkod (Ctrl+U i de flesta webbläsare) och lokalisera den inledande
<html>-taggen. Kontrollera att den innehåller ettlang-attribut, att attributvärdet är en giltig BCP 47-tagg (kontrollera mot IANA Language Subtag Registry) och att det korrekt återspeglar språket som sidans innehåll är skrivet på. För XHTML-sidor, kontrollera också att eventuelltxml:lang-attribut har samma primära språksubtagg somlang. - Test med skärmläsare med NVDA och Firefox: Installera NVDA (gratis, Windows) och öppna sidan i Firefox. Tryck NVDA+T för att läsa sidans titel och lyssna på TTS-rösten som används. Om sidan är på turkiska ska rösten vara en turkisk TTS-röst, och turkiska ord ska uttalas korrekt. Om du hör en engelsk eller på annat sätt felaktig röst på turkiskt innehåll är
lang-attributet saknat eller felaktigt. Upprepa med JAWS i Chrome och VoiceOver i Safari på macOS (Cmd+F5 för att aktivera VoiceOver, navigera sedan till sidan och lyssna på hur brödtexten uttalas). - Kontroll av webbläsarens språkdetection: Öppna sidan i Chrome. Leta efter webbläsarens inbyggda översättningsfält — Chrome erbjuder att översätta sidor som den identifierar som på ett främmande språk i förhållande till webbläsarens inställningar. Om Chrome felaktigt identifierar sidans språk eller inte erbjuder översättning när den borde, är detta en praktisk signal om att
lang-attributet är felaktigt eller saknas. Detta är inte ett definitivt tillgänglighetstest, men det är en användbar sekundär indikator. - Kontroll av semantisk korrekthet (endast manuellt): Läs igenom sidans innehåll och bekräfta att det deklarerade
lang-värdet stämmer överens med sidans faktiska primära språk. Automatiserade verktyg kan inte utföra denna kontroll. Var särskilt uppmärksam på flerspråkiga webbplatser som levererar olika språkversioner från olika URL:er — varje URL:s sida ska deklarera sitt eget korrekta språk, inte ärva ett enda globalt standardvärde.
Hur Man Åtgärdar
Saknat lang-attribut — Felaktigt
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>Başvuru Formu</title>
</head>
<body>
<h1>Hoş Geldiniz</h1>
</body>
</html>Saknat lang-attribut — Korrekt
<!DOCTYPE html>
<html lang='tr'>
<!-- lang='tr' talar om för skärmläsare att använda en turkisk TTS-röst -->
<head>
<meta charset='UTF-8'>
<title>Başvuru Formu</title>
</head>
<body>
<h1>Hoş Geldiniz</h1>
</body>
</html>Ogiltigt värde för lang-attribut — Felaktigt
<!DOCTYPE html>
<html lang='turkish'>
<!-- 'turkish' är inte en giltig BCP 47-tagg; axe kommer att flagga html-lang-valid -->
<head>
<title>Kurumsal Site</title>
</head>
<body>
<p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
</body>
</html>Ogiltigt värde för lang-attribut — Korrekt
<!DOCTYPE html>
<html lang='tr'>
<!-- Använd den tvåbokstavskod enligt ISO 639-1 'tr', inte det engelska ordet 'turkish' -->
<head>
<title>Kurumsal Site</title>
</head>
<body>
<p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
</body>
</html>XHTML xml:lang-avvikelse — Felaktigt
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='en' xml:lang='tr'>
<!-- lang och xml:lang är inte överens — html-xml-lang-mismatch-överträdelse -->
<head><title>XHTML Sayfası</title></head>
<body><p>İçerik burada.</p></body>
</html>XHTML xml:lang-avvikelse — Korrekt
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='tr' xml:lang='tr'>
<!-- Både lang och xml:lang är 'tr' — konsekvent och giltigt -->
<head><title>XHTML Sayfası</title></head>
<body><p>İçerik burada.</p></body>
</html>Fel språk deklarerat på en flerspråkig webbplats — Felaktigt
<!-- Engelskspråkig version av webbplatsen, men lang är globalt satt till 'tr' -->
<html lang='tr'>
<head><title>About Us</title></head>
<body>
<p>Welcome to our company. We specialize in accessible web solutions.</p>
</body>
</html>Fel språk deklarerat på en flerspråkig webbplats — Korrekt
<!-- Varje språkversion deklarerar sitt eget korrekta lang-attribut -->
<html lang='en'>
<!-- Detta är den engelska sidan; den turkiska sidan på /tr/ deklarerar lang='tr' -->
<head><title>About Us</title></head>
<body>
<p>Welcome to our company. We specialize in accessible web solutions.</p>
</body>
</html>Vanliga Misstag
- Att använda språkets fullständiga engelska namn i stället för dess BCP 47-kod — att skriva
lang='turkish',lang='english'ellerlang='arabic'i stället för de korrekta kodernatr,enochar. Dessa värden känns inte igen av hjälpmedelstekniker. - Att använda understreck som regionsavskiljare — att skriva
lang='en_US'ellerlang='tr_TR'i stället för de bindestrecksseparerade formernalang='en-US'ochlang='tr-TR'. BCP 47 kräver bindestreck, inte understreck. - Att sätta lang-attributet på <body> i stället för <html> —
lang-attributet måste finnas på det rotande<html>-elementet för att uppfylla axe-core-regelnhtml-has-langoch för att ge hjälpmedelstekniker den sidnivåspråkkontext de behöver innan något innehåll tolkas. - Att lämna lang som en tom sträng — att sätta
lang=''behandlas på samma sätt som ett saknat attribut av de flesta hjälpmedelstekniker och kommer att flaggas avhtml-has-langeftersom en tom sträng inte är en giltig språktagg. - Att kopiera en mall från ett annat språksprojekt utan att uppdatera lang-attributet — ett mycket vanligt problem i turkiska utvecklingsflöden där en engelskspråkig boilerplate återanvänds och
lang='en'på<html>-taggen aldrig ändras tilllang='tr'. - Att deklarera korrekt lang-attribut men inte uppdatera det när en ny språkversion av webbplatsen lanseras — flerspråkiga webbplatser som använder server-side rendering måste säkerställa att lang-attributet sätts dynamiskt per språkvariant, inte hårdkodas till ett enda värde i en delad layoutmall.
- Att anta att ett CMS eller ramverk automatiskt sätter lang-attributet korrekt — många CMS-plattformar (inklusive vissa konfigurationer av WordPress, Joomla och anpassade ramverk) sätter inte ett giltigt lang-attribut som standard. Utvecklare måste verifiera detta på mallnivå, inte anta att det hanteras.
- Att blanda ihop lang-attributet (för HTML) med HTTP-headern Content-Language — HTTP-headern påverkar cachning och innehållsförhandling men används inte av skärmläsare. Det inbäddade
lang-attributet på<html>är den korrekta mekanismen för att uppfylla WCAG 3.1.1. - Att använda en giltig men felaktig regionsubtagg som antyder en annan dialekt — till exempel att deklarera
lang='zh-TW'(traditionell kinesiska, Taiwan) på en sida skriven på förenklad kinesiska (zh-CN) kan göra att en skärmläsare väljer fel röstprofil och uttalsregler. - Att glömma att sätta lang på dynamiskt injicerat helsidoinnehåll i single-page-applikationer (SPA:er) — om en SPA laddar innehåll på flera språk inom samma dokumentskal utan att uppdatera
lang-attributet kommer användare som navigerar mellan språksektioner inte att få korrekt TTS-uttal för nya innehållssektioner.
Relation till Turkiets Tillgänglighetsföreskrifter
WCAG 3.1.1 Sidans språk har direkt rättslig tyngd i Turkiet enligt Presidential Circular 2025/10, publicerad i den officiella tidningen nr 32933 den 21 juni 2025. Detta cirkulär fastställer obligatoriska krav på webbtillgänglighet i linje med WCAG 2.2 och anger nivå A-konformitet som den minsta obligatoriska standarden för alla berörda aktörer.
Cirkuläret omfattar ett brett spektrum av både offentliga och privata organisationer. Offentliga institutioner — inklusive ministerier, kommuner, statliga universitet, offentliga sjukhus och alla centrala och lokala myndigheter — måste uppnå full nivå A-konformitet inom ett år från cirkulärets publicering. Privata aktörer som omfattas av regleringen har ett tvåårigt efterlevnadsfönster och inkluderar e-handelsplattformar, banker och finansiella institutioner, privata sjukhus och vårdgivare, teleoperatörer med 200 000 eller fler abonnenter, resebyråer, privata transportföretag och privatskolor som verkar med tillstånd från Ministry of National Education (MoNE).
Eftersom WCAG 3.1.1 är ett kriterium på nivå A ingår det i den obligatoriska baslinjen för varje aktör som omfattas av cirkuläret. En turkisk offentlig institutions webbplats som utelämnar lang='tr' från sitt <html>-element — eller som deklarerar en felaktig eller ogiltig språktagg — står i direkt icke-konformitet med en lagstadgad standard. För privata aktörer såsom banker och e-handelsplattformar utgör samma brist inom deras efterlevnadsfönster en regulatorisk överträdelse.
Den praktiska konsekvensen för turkiska webbteam är betydande: varje sidmall, varje CMS-layout, varje SPA-skal och varje dynamiskt genererad sida måste granskas för att bekräfta närvaron av ett giltigt lang='tr' (eller lämplig variant) på rotens HTML-element. Detta är inte bara en rekommendation om bästa praxis — enligt Circular 2025/10 är det en rättslig skyldighet. Med tanke på att axe-core-reglerna html-has-lang och html-lang-valid kan upptäcka de flesta av dessa fel automatiskt finns det inga tekniska hinder för att identifiera och åtgärda detta problem innan tidsfristerna för efterlevnad infaller.
Organisationer som omfattas av cirkuläret bör behandla efterlevnad av WCAG 3.1.1 som en åtgärd med högsta prioritet: det är ett av de enklaste kriterierna att åtgärda (ett enda attribut på ett enda element), men det har en oproportionerligt stor inverkan på tillgängligheten för varje sida för skärmläsaranvändare — den grupp vars rättigheter regleringen i första hand är avsedd att skydda.