Fem olika sätt att skriva ett minimalt xhtml 1.0-dokument

Om man läser specifikationerna för xhtml 1.0 noga, så ser man att man kan skriva dokument med hjälp av xhtml 1.0 strict på fem olika sätt som alla är korrekta…

Orsaken till att det finnns så många möjligheter är naturligtvis att man kan leverera sina xhtml-dokument dels med fyra olika “MIME-typer”, och dels att man (numera) även kan välja att använda xhtml 1.0 specificerat med ett XML Schema.

Den här artikeln reder ut skillnaderna och ger exempel på hur minimala xhtml-dokument kan se ut med de olika alternativen.

HTML-kompatibel xhtml 1.0 strict.

Det vanligaste på nätet idag är att man skriver xhtml “html-kompatibelt”, dvs att man levererar den med MIME-typen text/html (t.ex. genom att ge sidan extension .html eller .htm) och följer appendixet om HTML-kompatibilitet i xhtml 1.0-specifikationen .

Det innebär att man helt enkelt förser sin xhtml-sida med filextensionen .htm (eller .html) och slänger in en

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

-tagg för att vara på den säkra sidan om servern skulle vara felkonfigurerad och inte skicka med rätt värden i HTTP-headern automatiskt.

Exempel på hur det kan se ut:

<!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="sv" lang="sv">
    <head>
        <title>Minimalt dokument</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <link rel="stylesheet" type="text/css" href="minimalmallar.css" />
    </head>
    <body>
        <div>
Detta är ett exempel på minsta möjliga struktur för ett dokument kodat i   
<a href="http://validator.w3.org/check/referer">HTML-kompatibel xhtml 1.0 strict</a>,
samt på hur man använder en extern stilmall i ett sådant dokument.
        </div>
    </body>
</html>

Visa

Några saker att lägga märke till:

  • Dokumentet läggs ut som vore det vilket HTML4-dokument som helst, det betyder att man inte behöver ha med någon <?xml?>-tagg… Faktum är att det numera antagligen tillochmed är bättre att “köra utan” eftersom MSIE6 går upp i “Quirks” mode om man tar med <?xml?>-taggen!
  • Externa stilmallar länkas in med hjälp av <link rel=”stylesheet”/>
  • Det spelar ingen roll om man har små eller STORA bokstäver på taggnamnen i sin stilmall (trots att alla xhtml-taggar ju måste skrivas med små bokstäver).

Stilmallens innehåll i exemplen:

/* minimalmallar.css */
html, body {
    width: 100%;
    height: 100%
    margin: 0;
    padding: 0;
    text-align: center;
}
div {
    margin-top: 10%;
    margin-left: auto;
    margin-right: auto;
    padding: 1em;
    border: solid 1px gray;
    background-color: silver;
    color: navy;
    width:40%;
}

xhtml 1.0 strict som XML

Nästa sätt att skriva och levera xhtml är att göra det som XML-dokument, och i XML-världen finns det två olika MIME-typer man kan använda - text/xml och application/xml.

Jag tänker inte att gå in på vad som skiljer dessa åt i den här artikeln, för om man skriver xhtml så är de helt likvärdiga.

Den server som xhtml.se ligger på använder f.n. text/xml för filer med extensionen .xml, så därför blir det också denna variant som du kan provköra i exemplet:

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href="minimalmallar.css" ?>
<!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="sv" lang="sv">
    <head>
        <title>Minimalt dokument</title>
<!-- 
    notera att <meta http-equiv="..."/>-taggar inte läses 
    av XML-processorer och därför är verkningslösa när det 
    gäller att specificera t.ex. encoding när man servar sin 
    xhtml som text/xml eller application/xml
-->
    </head>
    <body>
        <div>
Detta är ett exempel på minsta möjliga struktur för ett dokument kodat i 
<a href="http://validator.w3.org/check/referer">xhtml 1.0 strict levererat
som text/xml</a>, samt på hur man bör använda en extern stilmall i ett 
sådant dokument.
        </div>
    </body>
</html>

Visa

Ett oväntat resultat

Det minimala dokumentet utlagt som XML valideras olika av olika valideringstjänster!

W3C:s HTML-validator har problem att validera filen eftersom den inte verkar bry sig om teckenkodningen (charset-attributet i <?xml?>-taggen) - men filen går igenom valideringen med godkänt resultat både på Page valet och WDG.
Det verkar alltså som om W3C:s validator inte gillar XML-filer just nu (februari 2003).

Att notera:

  • <?xml?>-taggen måste vara med när man kör annan encoding än UTF-8 eller UTF-16 (dvs i praktiken behövs den för alla de svenska sidor som idag använder ISO-8859-1)
  • Externa stilmallar länkas in med <?xml-stylesheet?>, och inte med <link>
  • Taggnamnen i CSS-avsnitt och CSS-filer måste skrivas med små bokstäver, eftersom XML är skiftlägeskänsligt!
  • Alla de <meta http-equiv … /> vi vant oss vid att använda för att täcka upp för mindre välkonfigurerade webbservrar blir med ens verkningslösa och kan uteslutas eftersom de programvaror som hanterar XML-filer normalt inte är programmerade att förstå vad de betyder !

xhtml som - xhtml…

Sedan i januari 2002 har man rekommenderat att xhtml-filer serveras av webbservrar med MIME-typen application/xhtml+xml.

Man har dessutom (i W3C xhtml media types note) gått så långt som att säga att all xhtml som inte är xhtml 1.0 bör eller skall serveras med denna MIME-typ…

Så alla ni som kör med xhtml 1.1 serverat som text/html går alltså egentligen emot W3C:s rekommendationer - trots att sådan kod går igenom utan anmärkning av W3C:s validatortjänst ;).

De filextensioner som rekommenderas är .xht eller .xhtml.

Koden skall följa exakt samma regler som gäller för XML-koden ovan - men den skall serveras med en annan MIME-typ

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href="minimalmallar.css" ?>
<!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="sv" lang="sv">
    <head>
        <title>Minimalt dokument</title>
<!-- 
    notera att <meta http-equiv="..."/>-taggar inte läses 
    av XML-processorer och därför är verkningslösa när det 
    gäller att specificera t.ex. encoding  när man servar sin 
    xhtml som application/xhtml+xml
-->
    </head>
    <body>
        <div>
Detta är ett exempel på minsta möjliga struktur för ett dokument kodat i 
<a href="http://validator.w3.org/check/referer">xhtml 1.0 strict 
levererat som application/xhtml+xml</a>,samt på hur man bör använda 
en extern stilmall i ett sådant dokument.
        </div>
    </body>
</html>

Visa

xhtml baserat på ett XML Schema

Skillnad i koden blir det dock om man väljer att använda det XML Schema som tagits fram för xhtml 1.0 strict (det finns f.ö. scheman för alla tre dokumenttyperna för xhtml 1.0).

Iom detta får man möjlighet att bättre kontrollera t.ex. innehållet i en del attribut automatiskt när man validerar sin fil med ett verktyg som hanterar XML-scheman.

Det man måste göra med sin sida är att lägga till lite “lim” i början för att kunna länka med schemat i sin xhtml-fil som iom detta bara kan hanteras som XML

Prova gärna vad som händer om man serverar ut detta exempel med en .html-filextension någon gång om ni har tråkigt - effekten är inte riktigt den man vill ha i de flesta moderna webbläsarna ;)

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href="minimalmallar.css" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"[
<!ATTLIST html
    xmlns:xsi CDATA #FIXED "http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation CDATA #IMPLIED
>
]>
<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="http://www.w3.org/1999/xhtml
                          http://www.w3.org/2002/08/xhtml/xhtml1-strict.xsd">
    <head>
        <title>Minimalt dokument</title>
<!-- 
    notera att <meta http-equiv="..."/>-taggar inte läses 
    av XML-processorer och därför är verkningslösa när det 
    gäller att specificera t.ex. encoding när man servar sin 
    xhtml som application/xhtml+xml
-->
    </head>
    <body>
        <div>
Detta är ett exempel på minsta möjliga struktur för ett dokument kodat i 
<a href="http://validator.w3.org/check/referer">xhtml 1.0 strict enligt 
både dess DTD och ett XML-schema levererat som application/xhtml+xml</a>,
samt på hur man bör använda en extern stilmall i ett sådant dokument.
        </div>
    </body>
</html>

Visa

F.n. har MSIE lite problem med denna typ av filer, men kör exemplet i t.ex. Mozilla så funkar det som förväntat!

Det här med xhtml och XML-scheman är alltså såpass nytt att det ännu inte garanterat finns stöd för den i alla fabrikat av webbläsare (som t.ex. MSIE) - och därmed är den i praktiken kanske inte att rekommendera för för “skarp” användning på webben riktigt än…

Stödet för de olika varianterna kan alltså sammanfattas som

text/html

funkar i alla webbläsare nyare än hedenhös om man följer riktlinjerna ordentligt tack vare att alla webbläsare konstruerats så oerhört förlåtande att de helt enkelt ignorerar sådant de inte känner igen (som t.ex. det extra “/”-tecknet i en <br /> och xmlns:-attribut.).

application/xml och text/xml

lämnar ut en till CSS för all formatering vilket gör att det t.ex. är mycket svårt att få till listor (med CSS-direktivet display:list-item) och tabeller (display:table m.fl) i en del vanliga, inte helt färska, webbläsare (som t.ex. MSIE5).

application/xhtml+xml

hanteras mycket bra av t.ex. Mozilla/NN6+ och resulterar i en “hmm_känner_inte_igen_filtypen_vill_du_spara_på_disk”-dialogruta om man försöker ta upp dem i äldre webbläsare som producerats innan MIME-typen överhuvudtaget fanns (som t.ex. MSIE5 ;).

Sammanfattning

Tumregeln att ta med sig ur detta resonemang kring de fem olika alternativa sätten att servera xhtml 1.0-strict-filer är - enligt min mening - att fortfarande köra HTML-kompatibelt som default.

Har man sedan möjlighet att lyssna in sig på vad webbläsaren begär (om man t.ex. använder ASP eller PHP hittar man enkelt informationen som finns i HTTP-ACCEPT-headern) så kan man så sakteliga börja servera application/xhtml+xml till de webbläsare som begär det…

… som jag till exempel gör här på xhtml.se :)

Powered by Movable Type 4.3-en