W3Cs tagprojekt – html, xhtml och xml.

Av Jonas Hägglund, Daniel Granholm och Mojgan Akhavam

Vad är HTML?

HTML - HyperText Markup Language - är ett sidbeskrivningsspråk som används för att skriva de webbsidor som utgör World Wide Web. Som namnet antyder kan man med HTML märka upp en sidas olika delar, t.ex vad som ska vara rubrik, nytt stycke, kursiverad text och liknande. Det går också att placera in bilder, tabeller och en del andra finesser, men man har dessvärre inte samma kontroll över sidans utseende som i avancerade layoutprogram.

Grundtanken bakom HTML är följande. Om du skapar finessrika sidor, med exotiska typsnitt, bilder, kolumner, fotnoter och annat fiffigt, i ett avancerat ordbehandlingsprogram (t.ex MS Word) brukar dessa program spara information om sidans layout och formatering med hjälp av styrkoder inlagda i filen. Nackdelen med dessa styrkoder är dels att de är olika för de olika programmen, men också att en del av dessa specialkoder har en tendens att inte överleva överföring via nätverk. Bättre då att, som i HTML, lägga in formateringsanvisningarna i klartext i filen, i form av koder skrivna med tecken som överlever nättransport.

Viktigt med HTML är också att det är en öppen standard, d.v.s den ägs av ingen, och ingen behöver därför betala licens till företag som Microsoft eller Adobe för att få göra program som stöder HTML, t.ex webbläsare. Detta främjar utvecklandet av ny och billig programvara för World Wide Web.

HTMLs BEGRÄNSNINGAR

Med HTML kan du alltså snygga upp din trista text genom att lägga in lite formateringskoder och titta på sidan genom en HTML-tolk, d.v.s en webbläsare. Som formateringsspråk är dock HTML dessvärre ganska primitivt, och den som är van vid riktiga layoutprograms möjligheter att exakt bestämma läget hos text eller bilder på sidan, ändra typsnitt, lägga text och bild över varandra m.m, blir nog ganska frustrerad i mötet med HTML. Men man kommer faktiskt ganska långt med HTML ändå, om man bara lär sig acceptera och hantera dess begränsningar.

Begränsningarna i webbskribentens möjligheter att skapa raffinerade webbsidor är huvudsakligen av tre slag:

Användaren kan ställa in vissa parametrar :

En av grundtankarna bakom HTML är att endast det som verkligen måste föras över nätet - nämligen innehållet - ska läggas i HTML-koden, och så mycket som möjligt av formen ska den mottagande och tolkande webbläsaren prestera själv. Användaren kan konfigurera sitt webprogram (i Netscape: titta i menyn Options : Preferences) och ange t.ex typsnittet, graden (storleken) för brödtext, hur länkar ska visas m.m. Webbsideförfattaren kan bara bestämma den relativa storleken och stilen för t.ex rubriker och brödtext. Framför allt är det användaren och inte författaren som kontrollerar bredden på fönstret (=sidan), vilket gör sidlayout extremt frustrerande. En designer kan t.ex belåtet se sin vackra sida på ett sätt i sin webbläsare, men en användare som t.ex ställt in ett stort konstigt typsnitt och har en hemskt liten bildskärm med dålig färgåtergivning får se en version av sidan som skulle få designern att börja gråta.

Olika webbläsare tolkar HTML-koden olika :

En överraskning för de flesta är att HTML-standarden inte rigoröst definierar hur olika märkord ska tolkas av en webbläsare. Det enda paragrafavskiljaren <P> förväntas göra är att markera nytt stycke. Om detta sen görs genom att en blankrad läggs in mellan styckena , eller att det nya stycket bara läggs på en ny rad, något indenterad, det är upp till tillverkarna av webprogrammen att bestämma. Andra element som brukar tolkas olika är listors indentering och hanteringen av bilder. Återigen: webdesignern har inte full kontroll över sin sidas utseende.

HTML klarar faktiskt inte allt :

Den tredje och uppenbara begränsningen kommer sig av att konstruktörerna av HTML inte har lagt, eller ens vill lägga in alla tänkbara möjligheter för ord-, bild- och layouthantering i HTML. Detta dels för att inte belasta nätet med allt för tunga och komplicerade kodbemängda sidor , dels för att det kanske inte ens är nödvändigt att webbsidor ska se perfekta ut - innehållet kan nog föras fram också utan snyggast möjliga förpackning.

Exempel

Före: OFORMATERAD TEXT

HTML

Sidor på World Wide Web skrivs i ett sidbeskrivningsspråk som heter HTML, vilket betyder HyperText Markup Language. Det går ganska snabbt att lära sig HTML och skriva egna webbsidor.

Man behöver inga andra hjälpmedel än en vanlig texteditor för skrivandet, och en webbläsare för att testa hur sidan blev.

UPPMÄRKNING

Sidor på <A HREF="omwww.html">World Wide

Web</A> skrivs i ett sidbeskrivningsspråk

som heter HTML, vilket betyder <I>HyperText Markup

Language</I>. Det går ganska snabbt att

lära sig HTML och skriva egna webbsidor.

<P>

Man behöver inga andra hjälpmedel

än en vanlig texteditor för skrivandet,

och en webläsare för att testa hur

sidan blev.

Efter: FORMATERAD TEXT!

HTML

Sidor på World Wide Web skrivs i ett sidbeskrivningsspråk som heter HTML, vilket betyder HyperText Markup Language. Det går ganska snabbt att lära sig HTML och skriva egna webbsidor.

Man behöver inga andra hjälpmedel än en vanlig texteditor för skrivandet, och en webbläsare för att testa hur sidan blev.

XML

Vad är XML ? / Hur fungerar XML ?

XML står för eXtensible Markup Language och är en metod för att strukturera data i en text fil. Metoden kan alltså vara väldigt användbar för träd- och hierarkistrukturer och andra typer av data som kan behöva organiseras som t ex adressböcker, släktträd och tekniska ritningar.

Precis som HTML använder sig XML av taggar (ord som föregås av ’<’ och avslutas med ’>’) och attribut (enligt formen name=”value”), men skillnaderna av användningen är stora. HTML använder taggar och attribut för att specifiera funktionalitet som påverkar innehållet mellan dem, t ex hur text kommer att se ut i webläsaren.. XML använder istället taggarna för att avgränsa data och låter istället den applikation som läser dokumentet avgöra vilken interpretation som skall göras. Detta innebär att de taggar vi sedan tidigare lärt oss i HTML kan ha vilka som helst betydelser i XML.

Ex: HTML:s taggning <b></b> betyder att den text som ligger mellan start- och sluttagg kommer att vara fetstilt, men i XML skulle det t ex kunna betyda att det är titeln till en bok eller namnet på en biologisk organism. Man kan alltså inte begränsas utav fördefinerade taggar utan döpa dem till vad som önskas för att kunna få en lätt förståelig struktur.

Eftersom XML filer är text filer som är tänkta att läsas av människor så är de väldigt lätthanterliga. Man kan alltså på samma sätt som med HTML editera kod och justera fel direkt i vilken texteditor som helst, men XML använder sig av en strikt debugmetod som ger felmeddelande om en starttagg saknar en sluttagg eller om ett attribut saknar kvotering. Detta leder till att man snabbt kan upptäcka fel, samt att man får ett dokument med bra struktur.

Vad som är mindre enkelt är skapande av applikationer som skall läsa XML datat, t ex script av olika slag (t ex javascript). Alltså, om man inte vill använda sig av någon färdigbyggd parser, som för övrigt bara fungerar i InterNet Explorer 5 och Netscapes Pre-Release 6, så kommer det att bli ganska komplicerat (se kommande demo!).

När XML skapades var man medveten om att text formatet skulle ge större filer än vad binärt format gör, men det ansågs viktigare att ha kod som är lättläslig för användare och att filerna tar plats anser man vara ett mindre problem eftersom de flesta har gott om diskutrymme.

XHTML

XHTML(Extensible Hyper Text Markup Language) är en omformulering av HTML 4.0 som en applikation till XML(Extensible Markup Language).

XHTML är den efterföljande versionen av HTML 4.0. Man kan säga HTML5. I XHTML fungerar alla taggar och attribut som tidigare existerar. Olikt HTML kan XHTML utökas/utvidgas av vem som helst som använder det. Nya attribut och taggar kan definieras och läggas till de som redan existerar.

XHTML 1.0 är det första steget mot en modulär och utvidgningsbar ”web” baserad på XML.

Varför är XHTML bättre än HTML ?

Den vanligaste orsaken till uppgradering till en ny språkversion är att kunna dra fördel av nya tekniker och också för att problem med de tidigare versionerna har fixats.

Utvidgningsbarhet :

HTML-en SGML applikation kräver en omarbetning av hela DTD(Document Type Definition) vid tilläggandet av en ny grupp av element. XML är en förenklad delmängd av SGML. Detta förenklar utvecklingen och integrationen av nya kollektioner av element.

Portabilitet :

Vid år 2002 kommer så mycket som 75% av tillgång till internet kunna utföras av icke PC-plattformar som ”palm-datorer”, television, kylskåp, telefoner m.m. I de flesta fall kommer dessa apparater inte kunna inneha samma ”datorkraft” som skrivbordsdatorer., och kommer inte att designas för att klara av ”icke välformad” HTML som nuvarande ”web”-läsare gör.

Om vi ser till dessa två punkter ovan saknar inte HTML helt dessa attribut. Problemet ligger i den långsamma utveckling relativ till utvecklingen av internet och hur svårt det kan vara att skapa sidor som fungerar bra på brett omfång av ”web”-läsare och plattformar. I och med XHTML erhålls hjälp med dessa problem.

Varför skapades XHTML, och varför behöver vi det ?

Än fast HTML har varit väldigt användbart och framgångsrikt, så är språket inte längre lämpad som en bas för utvecklingen av kommersiella och industri ”web”-baserade applikationer på internet och intranet.

HTML skapades ursprungligen för en skild omgivning från den i dag väldigt krävande ”högteknologiska” internet. Syftet var framförallt för utbytandet av data och dokument mellan vetenskapsmän.

Med tiden har språket dragits ut ”hafsigt” vilket gett till följd att det blivit svårt eller nästan omöjligt för användaragenter, som webläsare, att tyda det. Efter ett årtionde av användande och tillfällig, slumpmässig utveckling är det åtråvärt med ett mer utvidgningsbart och mer protabelt språk.

Det aktuella utfärdandet är att underlätta övergången från HTML för alla användare som är hemma på HTML. Det verkar eftertraktat att återskapa HTML i XML. Resultatet är XHTML, en särsklid applikation av XML för att uttrycka WEB-sidor.

Med HTML, har skapare endast en fix mängd av element att utnyttja utan variation. Men med XHTML kan vem som helst utvidga elementen – nya taggar och attribut kan definieras och appliceras till de redan existerande vilket gör det möjlighet till ny vägar vid utveckling av WEB-sidor. Med XHTML 1.0 kan skapare kombinera kända HTML 4 element med element från andra XML språk.

Skillnader mellan HTML 4 och XHTML.

Taggar och attribut måste skrivas med små bosktäver :

Eftersom XML är känslig för om det är stora eller små bokstäver måste XHTML element och attribut namn skrivas med små bokstäver. Attribut - värden kan väljas antingen stora och små(dvs i exemplet nedan är det tillåtet med både attribut - värdet ”#ffcc33” och ”#FFCC33”.

Ex :

HTML	XHTML
<TD BGCOLOR = ”#ffcc33”>	<td bgcolor = ”#ffcc33”>

Element måste nästas, inte överlappas :

De flesta web – läsare bryr sig inte om i fall element överlappas. T.ex. om en ”bold” (<b>) tag placeras i slutet av en ”paragraph”(<p>), spelar det ingen vilken av taggarna </b> eller </p> som stängs först. Vid användandet av XML och XHTML måste taggarna stängas i omvänd ordning – först öppnad – först stängd.

Ex :

HTML	XHTML
<p> Nya <b> medier ! </p> </b>	<p> Nya <b> medier ! </b> </p>

Alla icke-tomma element måste stängas :

Alla element måste vara stängda, explicit eller implicit.

Påverkade element : <basefont>, <body>, <colgroup>, <dd>, <dt>, <head>, <html>, <li>, <p>, <tbody>, <thead>, <tfoot>, <th>, <td>, <tr>.

Ex :

HTML

XHTML

Första paragrafen <p>

Andra paragrafen <p>

<p> Första paragrafen </p>

<p> Andra paragrafen </p>

Tomma element måste stängas :

Tomma element, de som saknar stängande tag, har inget innehåll. Medan en <p> tag innehåller en paragraf och en <b> tag innehåller text som ska bli ”grov(eller färgstark)”, är en <br> tag tom eftersom den aldrig innehåller någonting. Andra tomma taggar är <hr> och <img src = ”xxx.gif”>. I XML måste alla tomma element använda tecknet ”/” innan den avslutande haken (”>”).

(Notera i exemplet nedan blanksteget efter elementtexten och ”/>”. Detta för kompabilitet med nuvarande web – läsare.)

Ex :

HTML

XHTML

<hr>

<br>

<hr />

<br />

Attribut måste citeras :

Varje attribut måste citeras, även om det är numeriskt.

Ex :

HTML	XHTML
<img ... border = 0>	< img ... border = ”0” />

Attribut – värdepar kan inte minimeras :

Ett attribut minimeras när det finns endast ett möjligt värde. Till skillnad från HTML är detta inte tillåtet. Ensamstående attribut måste expanderas.

Ex :

HTML

XHTML

Referenser :

http://msdn.microsoft.com

http://www.whatis.com/xhtml.htm

http://www.w3.org