Dit is een gearchiveerde versie van www.webrichtlijnen.nl.

Verkorte titel
Hu5 Karaktercodering: UTF-8 gespecificeerd via HTTP en in HTML

Volledige titel van de techniek

Hu5: De UTF-8 karakterset is zowel via HTTP headers gespecificeerd als door middel van een meta element, waarbij het meta element zo hoog mogelijk in de head sectie van de opmaaktaal is geplaatst (HTML)

Toepasbaarheid

Alle webpagina's.

Deze techniek is van toepassing op:

Beschrijving

Met de UTF-8 karakterset kan elk karakter in de internationale standaard ISO/IEC 10646 worden weergegeven. Consequente toepassing van de UTF-8 karakterset is een geschikt middel om de consistentie van content te borgen en meertaligheid te ondersteunen.

Bij het specificeren van de UTF-8 karakterset is het belangrijk dat de specificatie in het document overeenkomt met de specificatie op de server, aangezien de server voorrang heeft bij een verschil. Sommige webservers zijn "karakterset-neutraal", waardoor de specificatie in het document ook belangrijk is.

In gevallen waarbij de karakterset niet door de server wordt gespecificeerd, kijkt de user agent naar de specificatie in het document. Als de user agent deze specificatie bereikt, kan er een pauze ontstaan terwijl het document opnieuw door de user agent wordt gelezen met de correcte karakterset. Om ongewenste visuele effecten te voorkomen is het daarom aan te raden de UTF-8 specificatie zo hoog mogelijk in de broncode te plaatsen. In HTML zou dit zo hoog mogelijk in de <head>-element zijn.

Specificatie op de server gebeurt via het HTTP Content-type header. Specificatie in een HTML-document is mogelijk via het <meta>-element.

Voorbeelden

Opmerking: Voorbeelden hebben uitsluitend een informatieve functie. Het is niet de bedoeling om een succescriterium te beoordelen enkel op basis van de hier gepresenteerde voorbeelden.

Voorbeeld 1: UTF-8 specificeren op de server

Content-type: text/html; charset=utf-8

Dit kan worden ingesteld in de configuratie van de webserver, maar ook bijvoorbeeld middels een .htaccess bestand:

AddCharset UTF-8 .html

waar ".html" de extensie is van de bestanden waar de specificatie voor geldt. Generieker is:

AddDefaultCharset UTF-8

Daardoor geldt UTF-8 ineens voor alle bestanden op de webserver.

Voorbeeld 2: Content-type header via PHP

De header() functie van PHP maakt het mogelijk om de karakterset te specificeren:

header('Content-Type:text/html; charset=UTF-8');

Tevens is het mogelijk om dit te doen via php.ini:

ini_set('default_charset', 'UTF-8');

Voorbeeld 3: UTF-8 specificeren in een HTML-document

Hier wordt een <meta>-element gebruikt om UTF-8 te specificeren; dit element wordt zo hoog mogelijk in het <head>-element geplaatst:

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Mijn document</title>
...
</head>

Voorbeeld 4: Vereenvoudigde specificatie in HTML5

In HTML5 is het mogelijk om de langere syntax nog steeds te gebruiken:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Een vereenvoudigde variant is ook mogelijk:

<meta charset="UTF-8">

De specificatie van een karakterset in HTML5 dient binnen de eerste 512 bytes van het document te zijn. Let ook op de DOCTYPE:

<!doctype html>
<html lang="nl">
    <head>
        <meta charset="utf-8">
        <title>Mijn document</title>
    ...
    </head>

    ...

Informatiebronnen

Opmerking: Informatiebronnen zijn uitsluitend informatief bedoeld. Ze maken geen deel uit van de Webrichtlijnen. Deze opsomming impliceert geen goedkeuring van de bronnen door de opstellers of toezichthouders van deze specificatie.

Gerelateerde technieken

Toetsen

Procedure

  1. Controleer of UTF-8 via de Content-type HTTP header is gespecificeerd;
  2. Controleer of UTF-8 via de <meta>-element in het HTML-document is gespecificeerd;
  3. Controleer of de specificatie via de <meta>-element het eerste element binnen de <head>-element is, of binnen de eerste 512 bytes van het document voorkomt.

Verwacht toetsresultaat

Er wordt aan het succescriterium voldaan bij de volgende uitkomst:

  1. Alle controles zijn waar.

Opmerking: Alle technieken hebben een informatieve status - het is niet verplicht om ze te gebruiken. De "afdoende technieken" worden als afdoende beschouwd om aan succescriteria te voldoen; het is echter niet noodzakelijk om deze technieken toe te passen.
Het staat eenieder vrij om nieuwe technieken voor te stellen.