Rätt doctype?

written by Lena on July 19, 2008 in HTML and Webguider with 2 comments

När du ska göra en hemsida får du aldrig glömma ett doctype. Man använder en doctypedefinition för att underlätta webbläsarnas valideringsverktyg samt att dessa ska kunna utläsa i vilken form hemsidan är konstruerad. Ett utelämnat doctype innebär att sidan visas i något som kallas för quirkes mode, det vill säga, webbläsarna “gissar” rätt friskt om hur du har tänkt dig att hemsidan ska se ut. Att utelämna en doctype innebär faktiskt större problem än vad man tror för ett doctype är den första informationen som utläses på sidan. Genom att använda det så underlättar du inte bara för webbläsarna, du vinner också på detta genom att sökspindlarna lättare kan identifiera din sida. I slutändan hamnar du högre upp i sökmotorerna. Validerar man en sida utan doctype brukar man få följande text: No referrer head is found. Tja, det säger väl ganska mycket – eller hur?

Använder du dig av xhtml så måste du ha en namespacedeklaration i ditt doctype:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

I detta fall är språket satt till engelska –> lang=”en”. Vill du ändra till svenska anger du “sv” istället.

Vilket doctype ska jag då ha?

OM det enbart handlar om “vanlig” html 4.01 använder du någon av dessa tre:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Som Du nu ser så finns tre alternativ att välja mellan. Det första alternativet strict är med helt rena html-koder utan några personliga förändringar i koden. Utseendet ska ske genom stöd av css-mallar.

Det andra alternativet transitional (övergångar) är det vanligast förekommande och används som ovan men om man har en “övergång” mellan vanlig html och css. Viss formatering direkt i html tillåts. Utseendet kan delvis ske genom stöd av css-mallar.

Det tredje alternativet används om man vill använda frames. Doctype i sig är identisk med alternativet transitional. Men skillnaden är innehållet i html-elementet. I dokumentet frames ersätter FRAMES-elementet själva BODY-elementet. Använder Du xhtml 1.0 är det någon av dessa tre doctypes du ska använda:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Vi har samma regler här. Strict är helt styrd av css i både utseende som uppbyggnad och helt ren från cssformatering i xhtml-koden. Transitional medger viss formatering i koden som exempelvis enkel radbrytning. Frameset är som transitional fast i frames. Läs gärna mer i de andra länkarna om xhtml angående detta.

Sist, det sista doctype är detta om du använder xhtml 1.1:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

W3C:s rekommendationer är dessutom att använda en xml-encoding för bästa resultat om du ska göra en sida i xhtml 1 strict.

<?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" xml:lang="en" lang="en">
<head>
<title>An XHTML 1.0 Strict standard template</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
</head>
<body>
<p>… Your HTML content here …</p>
</body>
</html>

Ge akt på typsnittet. Vi i Sverige har inte utf-8 på grund av våra å ä och ö – vi använder charset=iso-8859-1 som medger ett västerländskt typsnitt. Ni som bloggar med färdiga plattformar som exempelvis WordPress ska inte ändra unicode utan behålla den som redan finns.

Läs gärna mer hos W3C.

Liknande poster:

Share with me
Created by disruptive.nu