Olika teckenkoder

I denna artikeln förklarar vi hur olika teckenkoder fungerar. Det är bra att veta för att du ska få en hemsida som visar rätt tecken (du har väll säkert sett en del hemsidor som har haft problem med att visa tecknen å, ä och ö?), men även om du inte vill sätta dig in i hur det fungerar kan du enbart läsa lösningen i artikeln och få reda på hur man undviker problem.

Problem

En del hemsidor har problem med att visa våra svenska tecken å, ä och ö. Egentligen är det inte bara dessa tecken, utan alla tecken som inte ingår i ASCII-tabllen (läs mer om ASCII-tabllen nedan), men det är inte så ofta vi ser övriga tecken (hur ofta ser du till exempel ü, ÿ och ñ?).

En hemsida som webbläsarna har problem med att visa tecknen å, ä och ö korrekt i är detta exemplet. Öppna den själv och se problemet.

Bakgrund

När datorerna kom infördes teckentabellen ASCII. I den beskriver 7 efterföljande bitar (1 bit är en digital etta eller nolla) ett tecken, men i och med att bara 7 bitar representerar ett tecken kan bara 27 = 128 olika tecken representeras. Det räcker ju gott och väl för de vanliga tecknen som används i USA (a-z, A-Z, 0-9, punkt, komma och dylikt), men inte till andra tecken som är vanliga i övriga världen, till exempel våra å, ä och ö.

Om du vill se vilka tecken som finns med i ASCII-tabellen kan du kolla in det på asciitabell.se. Den hemsidan har delat upp alla tecken i tre olika tabeller, men enbart de två första tabellerna visar hur ASCII-tabellen ser ut. Vad den sista tabellen visar får du lära dig senare i denna artikeln.

Med tiden har det kommit nya teckentabeller som bygger på 8 bitar, istället för 7, som ASCII-tabellen. De tabellerna kan spara ytterligare 128 tecken, och i vissa av dem har man klämt in våra svenska tecken å, ä och ö. De första 128 tecknen i de tabellerna är samma som i ASCII-tabellen, men efter dem är det olika tecken i de nya tabellerna.

En av de tabellerna som har utvecklats heter ISO 8859-1. Den tabellen innehåller de tecken vi i Europa ofta använder (bland annat våra å, ä och ö), och du kan se vilka på samma länk som innan (de som står i den nedersta tabellen är de tecken som även finns med i ISO 8859-1). Denna teckentabell är mycket nyttjad i Sverige, men den klarar bara av att hantera 256 olika tecken. Hur gör man om man vill skriva ett brev på japanska, ett språk som använder helt andra tecken?

Jo, lösningen blev ett projekt som heter Unicode, vars uppgift är att ta fram en teckentabell som hanterar väldigt många olika tecken. De skapade bland annat teckentabellen UTF-8, en tabell där ett tecken kan ta upp 21 bitar, och därmed är bristen på teckenplats eliminerad för en väldigt lång tid framöver. Liksom andra teckentabeller är de 128 första tecknen i tabellen samma som i ASCII-tabellen, så en text skriven med tecknen a-z kan utan problem visas korrekt oberoende av ifall man använder ASCII-tabellen eller UTF-8-tabellen, dock kommer tecknen å, ä och ö att se annorlunda ut, eftersom deras digitala värden representerar olika tecken i de olika tabellerna

Exemplet vi länkade till i början använde sig alltså av en teckentabell när den skrevs, och en annan när den visas. Exemplet är skriven med teckentabellen UTF-8, men webbläsaren visar den med teckentabellen ISO 8859-1, vilket gör att tecknen å, ä och ö blir fel. Man kan manuellt ändra vilken teckentabell webbläsaren ska visa en hemsida med. I till exempel Chrome gör man det via menyn "Verktyg --> Kodning", och i Firefox via menyn "Visa --> Kodning". Testa själv att ändra kodningen webbläsaren visar exemplet med till "Unicode (UTF-8)" och se att den sedan visar å, ä och ö korrekt..

Lösning

Det bästa är alltså att använda teckentabellen UTF-8, som innehåller alla tänkbara tecken, men hur gör man det? Jo, när du sparar filen får du ställa in att du vill spara den med den teckenkodningen. Här kommer en bild på hur man gör det i Anteckningar i Windows.

Längst ner i spara-rutan kan du ange vilken teckenkodning filen ska sparas med. Ange UTF-8 (om alternativet finns, ange UTF-8 utan BOM).

I den versionen av Anteckningar som bilden ovan är tagen i finns inte alternativet UTF-8 utan BOM, men om det finns bör du välja den. Om du inte väljer den (utan väljer UTF-8) kan du få problem med headers när du börjar arbeta med PHP-filer.

Nu är filen sparad med teckenkodningen UTF-8, men vi måste även tala om för webbläsaren att sidan ska visas med teckenkodningen UTF-8 (annars får vi samma problem som i exemplet ovan). Det kan vi göra med <meta>-taggen på följande sätt:

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

Denna kodraden ska självklart ligga i <head>-taggen, i och med att den inte direkt visar något på sidan.

Exemplet som webbläsarna har problem med att visa tecknen å, ä och ö korrekt ser ut såhär (och är sparad med teckentabellen UTF-8):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Min egna sida</title> </head> <body> <h1>Välkommen till min hemsida!</h1> <p>Detta är min egna hemsida som jag har gjort själv. Välkommen!</p> </body> </html>

Följande kod, där vi även talar om för webbläsarna att sidan är kodad med UTF-8 med hjälp av en <meta>-tagg, kan webbläsarna utan problem visa korrekt. Se själv!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Min egna sida</title> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> </head> <body> <h1>Välkommen till min hemsida!</h1> <p>Detta är min egna hemsida som jag har gjort själv. Välkommen!</p> </body> </html>