Voorleessoftware kan tekst omzetten in spraak. Het gebruikt hier verschillende stemmen voor. Iedere stem is gemaakt om in een bepaalde taal te spreken. Om te bepalen in welke taal er moet worden gesproken, is voorleessoftware afhankelijk van taal die in de code is vastgelegd.
Het vastleggen van de taal in de code heeft meerdere functies:
- Voorleessoftware kan woorden en zinnen in de juiste taal uitspreken.
- Browsers kunnen letters en karakters op de goede manier weergeven.
- Zoekmachines gebruiken de taal van een webpagina om te bepalen of een pagina wordt opgenomen in zoekresultaten.
- Spellingscontroles in de browser kunnen de juiste taalregels toepassen.
- Automatische vertaaltools kunnen de content correct vertalen.
In dit artikel lees je hoe taal in de code kan worden vastgelegd.
Wat WCAG precies eist
Er zijn twee WCAG-succescriteria voor taal:
Taal van de pagina
3.1.1 Taal van de pagina vereist dat de standaardtaal van elke webpagina door software te bepalen moet zijn. In de praktijk betekent dit: Gebruik het lang-attribuut met de juiste taalcode op het <html>-element.
Als een pagina meerdere talen bevat, kies je de taal die het meest voorkomt. Komen twee talen evenveel voor? Dan kies je de taal die het eerst verschijnt.
Taal van onderdelen
3.1.2 Taal van onderdelen verplicht dat je anderstalige passages en zinnen in de content markeert met een lang-attribuut op het betreffende element.
Je hoeft niet álles te markeren. Er zijn een aantal categorieën uitgezonderd:
- Eigennamen: merknamen, plaatsnamen (“Apple”, “München”, “CoolBlue”)
- Technische termen: vakjargon dat internationaal wordt gebruikt (“WCAG”, “responsive design”, “Homo Sapiens”)
- Woorden met onbepaalde taal: woorden waarvan niet duidelijk is in welke taal ze zijn
- Ingeburgerde woorden: woorden die deel zijn geworden van de Nederlandse taal (“software”, “website”, “e-mail”, “deadline”)
Het W3C geeft hierbij een praktische vuistregel: “Single words should be considered part of the language of the surrounding text unless it is clear that a change in language was intended.”
Taal instellen
Meestal kan alleen een ontwikkelaar de hoofdtaal van de website instellen. Soms kan dit ook via de instellingen van het CMS.
Voor onderdelen van een webpagina kun je in een CMS de taal vaak makkelijk toevoegen in de editor op de pagina.
Let op: WordPress ondersteunt standaard geen inline lang-attributen in de blokeditor. Je hebt dan een plugin nodig zoals “Lang Attribute for the Block Editor”.
Code van taal instellen
Taal kan worden toegevoegd met het lang-attribuut. Gebruik als waarde van dit attribuut alleen een taalcode die voorkomt in de IANA Subtag Registry.
Het lang-attribuut is een zogenaamd global attribute in HTML. Het mag op elk HTML-element staan. De waarde moet een geldige BCP 47-taaltag zijn, gebaseerd op ISO 639-taalcodes.
Het systeem werkt met overerving: elk element zonder eigen lang-attribuut erft de taalinstelling van zijn ouder-element. Door lang="nl" op het <html>-element te zetten, geldt die taal voor de hele pagina (inclusief de <head> met daarin de <title>).
Een aantal veelgebruikte taalcodes:
| Taalcode | Taal |
|---|---|
nl | Nederlands |
nl-NL | Nederlands (Nederlands) |
nl-BE | Nederlands (België/Vlaams) |
en | Engels |
en-GB | Engels (Brits) |
en-US | Engels (Amerikaans) |
fr | Frans |
de | Duits |
pl | Pools |
it | Italiaans |
es | Spaans |
pt | Portugees |
Houd taalcodes zo kort mogelijk. Gebruik regiosubtags (nl-NL, en-GB) alleen als het regionale verschil relevant is voor bijvoorbeeld spelling- of uitspraakverschillen. Voor de meeste situaties volstaat de tweeletterige code.
Taal van de pagina
De standaard taal van een webpagina wordt aangegeven in het <html>-element. Voeg het lang-attribuut toe aan het <html>-element en gebruik de juiste taalcode.
<html lang="nl">Taal van onderdelen
Passages, zinnen of onderdelen van je website in een andere taal moet je apart markeren. Voeg hiervoor het lang-attribuut toe aan het HTML-element met een andere taal en gebruik de juiste taalcode.
Het lang-attribuut kan worden gebruikt op block-elementen (<div>, <p>, <ul>, enz.) maar ook op inline-elementen (<span>, <a>, <strong>, enz.).
Voorbeeld van een taalwissel met een block-element:
<p lang="en">
The quick brown fox jumps over the lazy dog.
</p><ul lang="fr">
<li>
Langue de la page
</li>
<li>
Langue d’un passage
</li>
</ul>Voorbeeld van een taalwissel met een inline-element:
<p>
In het Verenigd Koninkrijk zeggen ze
<span lang="en">
It’s raining cats and dogs
</span>
en dat is mooi.
</p>Gerelateerde succescriteria
Dit artikel behandelt twee WCAG-succescriteria:
- 3.1.1 Taal van de pagina (niveau A)
- 3.1.2 Taal van onderdelen (niveau AA)