HTML/Inleiding/Printversie

Deel I: Inleiding

Dit deel van het boek zal optreden als een inleiding. Er zal nog geen echte code worden aangemaakt, maar enkele fundamentele denkwijzen zullen wel worden uitgelegd.

De inhoud van dit deel

1. Geschiedenis van HTML

TE DOEN

TE DOEN
Dit hoofdstukje moet herschreven worden. Ook zouden de nieuwe ontwikkeling van HTML moet worden toegevoegd zoals HTML5

De geschiedenis van HTML ging in de eerste jaren hand in hand met de ontwikkeling van webbrowsers. De belangrijkste spelers daarin waren de concurrerende browsers van Netscape en Microsoft. Met elke uitgebrachte browserversie werd de HTML uitgebreid of aangepast. De organisatie W3C werd opgericht door Tim Berners-Lee, met het doel om standaarden vast te stellen, maar moest regelmatig constateren dat de standaard waaraan gewerkt werd, inmiddels achterhaald was.

HTML werd in 1991 bedacht en ontwikkeld door Tim Berners-Lee om wetenschappelijke documenten van het CERN in Genève gemakkelijker toegankelijk te maken. Hij ontwikkelde ook de eerste webbrowser, WorldWideWeb genaamd. In 1993 werd de webbrowser Mosaic ontwikkeld door het NCSA, die als eerste grafische elementen in HTML ondersteunde. Op basis daarvan ontstond in 1994 Netscape Navigator. Met de komst van deze beide browsers werd het World Wide Web echt populair. Beide browsers voegden elementen toe aan de oorspronkelijke HTML. Kort daarop mengde Microsoft zich in de strijd met een eigen webbrowser.

De eerste officiële specificatie van HTML door de W3C organisatie was HTML 2.0, geaccepteerd in september 1995. Eerder was er gewerkt aan uitbreiding van de oorspronkelijke standaard onder de naam HTML+ (gepubliceerd in november 1993). Al vóór de officiële acceptatie van HTML 2.0, werd er de volgende specificatie (HTML 3.0) voorbereid. Deze specificatie werd achterhaald door het uitkomen van Netscape versie 3 en het voorstel werd in september 1995 verlaten. Het werk werd voortgezet in HTML versie 3.2, dat de naam "Wilbur" meekreeg. Wilbur werd geaccepteerd in januari 1997. In december 1997 werd de HTML 4.0 specificatie geaccepteerd, waarop nog enkele kleine correcties zijn aangebracht in HTML 4.01 (geaccepteerd in december 1999).

De HTML-4.01-specificatie was lange tijd bedoeld als de laatste specificatie van HTML. Verdere ontwikkeling van de markup-taal zou plaatsvinden in de vorm van XHTML (een subset van XML) en in de ontwikkeling van stijlbladen en JavaScript.

W3C-directeur Tim Berners-Lee zette echter in een blogposting in oktober 2006 een nieuwe koers uit. Hij constateerde dat een groot deel van de webontwikkelaars en -uitgevers niet bereid was gebleken over te stappen naar X(HT)ML, en dat het daarom nodig was de ontwikkeling van HTML toch voort te zetten. Die ontwikkeling diende volgens Berners-Lee parallel te lopen aan de ontwikkeling van XHTML.

Het W3C stelde daarop in maart 2007 een nieuwe HTML Working Group in, die al in juni 2007 een Working Draft diende te kunnen presenteren. Om dit te kunnen realiseren, zou de Working Group nauw samenwerken met de WHATWG-groep, die uit ongenoegen over de koers van het W3C sinds 2004 werkte aan HTML 5.

Meer informatie

De website van het W3C (Engels)
Beschrijving van het HTML formaat uit 1992 door W3C (Engels)
Specificatie van HTML+ door W3C (Engels)
Beschrijving van het HTML+ formaat door W3C (Engels)
De HTML 2.0 specificatie, Request for Comments nr. 1866 (Engels)
Ontwerp van HTML 3.0 (Engels)
De HTML 3.2 specificatie, genaamd "Wilbur" (Engels)
De HTML 4.01 specificatie (Engels)

Deze pagina is vrijgegeven onder de GNU Free Documentation License (GFDL) en nog niet onder CC-BY-SA. Klik hier voor meer informatie.

2. Toekomst van HTML

Nadat HTML 4.01 werd hergeformuleerd in XHTML 1.0 (hierover later meer), verwachtte bijna iedereen dat het was afgelopen met de HTML-serie. XHTML was opeens "the way to go", een visie die wordt gesteund door het feit dat W3C afziet van verdere ontwikkeling van de HTML-standaard. Toch is niet alle ontwikkeling gestaakt.

HTML 5

Zo werkt de WHATWG (Web Hypertext Application Technology Working Group) aan een nieuwe standaard genaamd "HTML 5", voorheen Web Applications. Er wordt nog steeds gewerkt aan HTML 5. Het doel is dat dit later als vervolg kan optreden in de HTML-serie en de XHTML-serie. De bedoeling van de werkgroep is dan ook om een stabiele versie van het document op te sturen naar het W3C, zodat het een officiële standaard kan worden. Het plan is dat Web Forms, dat al verder is ontwikkeld, een onderdeel gaat vormen van HTML5. Het is echter de vraag of concurrerende standaarden wel zo goed zijn voor het web.

Formulieren

Webformulieren (Web Forms), wederom van WHATWG, zijn bedoeld om het voor HTML- en XHTML-ontwikkelaars makkelijker te maken om professionele formulieren te maken. De ontwikkeling verkeert inmiddels in een vergevorderde fase en wordt al toegepast door Firefox en Google Chrome.

Web Controls

Ook werkt het WHATWG aan Web Controls 1.0. De bedoeling is om aan JavaScript- en CSS-functionaliteiten toe te voegen die het mogelijk maken om geavanceerde opmaak toe te kunnen passen op webprogramma's. De ontwikkeling verkeert nog in de beginfase, omdat eerst op andere projecten moet worden gewacht.

Meer informatie

3. Over XHTML

XHTML staat voor Extensible Hypertext Markup Language en is een soort uitgebreide en striktere versie van HTML 4.01. Met strikter bedoelen we dat er bij XHTML regeltjes zijn bij het opmaken van een XHTML document die niet bestaan bij een gewoon HTML document.

Waarom XHTML

Vele auteurs van webpagina's waren vroeger (en nu nog steeds eigenlijk) heel laks bij het schrijven van de HTML-code voor hun webpagina's. De browsers die worden gebruikt werken dit nog meer in de hand door foute HTML-code vrij te interpreteren en te raden wat de auteur wou bereiken. Zoals al eerder werd gezegd is XHTML een striktere versie van HTML met verschillende regeltjes voor het schrijven van goede HTML-code. Als er een fout in een XHTML-document is zal, in tegenstelling tot HTML, de browser stoppen met de code te verwerken en gewoonweg een foutmelding tonen.

Het nadeel van XHTML is wel dat er voor het kleinste foutje een foutmelding wordt gegeven en de pagina helemaal niet wordt getoond en moet het XHTML-document worden aangepast. Om aan te geven dat je webpagina een XHTML document is moet er een zogenaamde MIME-type worden vermeld in je document dat aangeeft dat het om een XHTML-document gaat(application/xhtml+xml). Internet Explorer interpreteert dit fout en behandelt de webpagina dan als een document om te downloaden en niet als een webpagina die moet worden geopend in de browser. Hierdoor is het het beste dat je de MIME-type gebruikt om aan te geven dat het om een gewoon HTML-document gaat(text/html), want gelukkig kan Internet Explorer dit wel naar behoren verwerken.

Dit is natuurlijk zeer moeilijk te begrijpen voor iemand die juist begint met HTML en dus moet je er nu nog niet veel van aantrekken. We zullen er in dit boek later nog wel dieper op ingaan.

Toekomst van XHTML

Oorspronkelijk was bedoeld om XHTML de opvolger te maken van HTML en vervolgens verder de XHTML standaard uit te breiden en niet langer de gewone HTML. Er werd ook een lange tijd gewerkt aan een opvolger voor XHTML genaamd XHTML 2.0. Deze versie moest oorspronkelijk een echte breuk maken met het verleden. Nu wordt er echter gewerkt aan HTML 5 die uiteindelijk HTML 4.01 moet opvolgen en nieuwe functies gaat toevoegen aan HTML. HTML 5 is wel nog steeds geen standaard maar de meeste moderne browsers ondersteunen wel al veel van deze nieuwe functies. XHTML is echter niet ten dode opgeschreven, want er wordt ook een XHTML-versie ontwikkeld op basis van HTML 5 die simpelweg XHTML 5 heet.

XHTML in dit boek

In dit boek zullen we zo veel mogelijk de regeltjes van XHTML gebruiken alsof het gewoonweg HTML is, omdat het simpelweg mooi geordende webpagina's oplevert.

4. Semantiek

Wat is semantiek

Zo staat het op het Wikipedia-artikel over semantiek:

De semantiek houdt zich bezig met de betekenis van symbolen (zoals de woorden in een taal).

In HTML geeft de semantiek de structuur van een document aan. Het gaat daarbij niet om de semantiek van de inhoud van het document, maar om de betekenis voor de weergave van de onderdelen van het document. Opdat een user agent de structuur goed kan weergeven, moet deze structuur ook duidelijk in het document aangegeven zijn.

Zo zullen onderdelen van een document die een verschillende rol spelen, als zodanig moeten worden aangegeven. Het is dus niet voldoende dat het weergegeven resultaat (bij de meeste browsers) goed is, nee die goede weergave moet z'n oorzaak vinden in de correcte semantiek van de gebruikte HTML.

Een heel eenvoudig voorbeeld is het gebruik van een rijtje =-tekens om een dubbele lijn aan te geven. Daardoor ontstaat een dubbele betekenis van het =-teken. Een semantische fout. Of nog eenvoudiger het gebruik van het koppelteken "-" als minteken in berekeningen. Weergegeven door een browser zien we geen verschil, maar vanwege de verschillende betekenis (semantiek), moet in de code onderscheid gemaakt worden, dus aparte tekens.

Wanneer u een menu wilt maken (feitelijk dus een lijst met links), moet u dat ook beschrijven als een lijst, en niet als bijvoorbeeld een tabel.

Het nut van semantiek

Uit het bovenstaande blijkt al wel het belang van een goede semantiek in de HTML-code. Het zal blijken dat u een lijst en een tabel er bij weergave precies hetzelfde kunt laten uitzien. Toch is het van belang semantisch onderscheid te maken en de lijst ook als een lijst en de tabel als een tabel te definiëren. Mocht een eenvoudige browser niet de mogelijkheden hebben voor de gewenste weergave, dan zal hij de lijst als een lijst behandelen en niet als tabel. Of als u later het uiterlijk van tabellen wat wil veranderen hoeft u niet bang te zijn dat ook uw lijsten er anders gaan uit zien.

Zo zijn er nog meer voordelen. User agents begrijpen beter wat u bedoelt, waardoor het surfen voor (visueel) gehandicapten makkelijker wordt. Ook zal uw website toegankelijker zijn voor mensen met een tekstbrowser, zoals Lynx. Daarnaast wordt ook voor u het werken makkelijker: u weet meteen met wat voor een informatie u van doen heeft.

Semantiek speelt een steeds grotere rol, wanneer u uw site hoog in de zoekresultaten van zoekmachines wilt hebben. Zo zal er waarschijnlijk meer waarde worden gehecht aan de inhoud van een kop, dan aan de waarde van bijvoorbeeld een gewone paragraaf.

Meer informatie

Semantiek - Waarom zou je? (Nederlands)
Naar Voren over semantiek (Nederlands)
Rikkert Koppes over semantiek in "Do you smurf what I smurf?" (Engels)
Brainstorms and Raves over semantiek (Engels)
Het klassieke artikel The Semantic Web (Engels)
Discussie op Gathering of Tweakers over het semantische web met als deelonderwerp de semantiek in de HTML (Nederlands)
Wikipedia EN over het semantisch web (Engels)

5. Scheiding tussen structuur en opmaak

Wanneer u uw auto een andere kleur wilt geven, maar de auto zelf wilt houden, kunt u de auto laten overspuiten. U geeft dan dezelfde structuur een andere opmaak. Dit is mogelijk omdat de structuur en de opmaak zijn gescheiden: de opmaak vormt als het ware een laag over de structuur heen, maar zit niet in de structuur genesteld, waardoor u eenvoudig een andere opmaak kunt laten toepassen.

Zo kan het ook met websites gaan. Het HTML-document beschrijft de structuur door aan te geven wat de diverse onderdelen, zoals titels, subtitels, paragrafen, voetnoten lijsten enz., voor betekenis hebben, maar laat de opmaak, dus hoe de onderdelen uiteindelijk weergegeven worden, over aan een of meer zogenaamde "style sheets", waarin de opmaak van de onderdelen vastgelegd is. Deze "style sheets", aangeduid met de naam CSS, van Cascading Style Sheets, zijn aparte bestanden, waarnaar in het HTML-document wordt verwezen, en die een eigen syntax hebben.

Wanneer u dan uw website een nieuwe stijl geeft, hoeft u alleen het CSS-bestand te veranderen. Sterker nog, wanneer u een apart CSS-bestand aanmaakt en daar naar toe verwijst vanaf al uw HTML-bestanden, dan hoeft u slechts één bestand te wijzigen in plaats van alle HTML-bestanden.

HTML biedt echter wel de mogelijkheid om een opmaak te realiseren zonder de tussenkomst van CSS. Herinnert u zich nog wat er is gezegd over semantiek? Dan zult u waarschijnlijk wel begrijpen dat schuin gedrukt een slechtere beschrijving is dan nadruk. Semantisch gezien moet het gebruik van HTML om een opmaak te realiseren vermeden worden. Bovendien kan het gebruik van CSS u een hoop tijd schelen.

Dit is tevens de reden waarom dit boek de opmaakmogelijkheden binnen HTML slechts oppervlakkig zal beschrijven: er is immers een veel beter alternatief. Over hoe u een CSS-bestand "bevestigt" aan een HTML-pagina, krijgt u later uitleg.

6. Over dit boek

Doelstelling

De makers van dit boek hebben zichzelf tot doel gesteld een correcte cursus voor HTML te maken. Hierbij zal de nadruk worden gelegd op semantiek en de daarmee samenhangende scheiding van structuur en opmaak. In dit boek zijn geen opgaven opgenomen. De ervaring leert immers dat veel mensen HTML beginnen te leren om een eigen site te maken; aan een heleboel kleine opgave-sites hebt u dan niets.

Verder is het de bedoeling geweest dat mensen die op zoek zijn naar informatie over een bepaald aspect van HTML, dit meteen kunnen vinden. Er is daarom gestreefd naar het behandelen van verschillende onderwerpen op verschillende pagina's.

Zelf wijzigen

Iedere pagina in dit boek kunt u ook zelf aanpassen. Wanneer u een fout (inhoudelijke fouten, maar ook spel-, typ- of grammaticafouten) aantreft, wordt u er toe aangemoedigd die fout te verbeteren. Wanneer u niet zeker bent of de inhoud wel klopt, kunt u in overleg treden op de overlegpagina (zie bovenkant) van die pagina.

Denk er aan dat de overlegpagina is bedoeld om te overleggen over een pagina, en niet om uw HTML-probleem op tafel te gooien in de verwachting van een oplossing. Er is veel over HTML te vinden op het Internet, maar ook in bibliotheken, en van u wordt verwacht dat u gebruik maakt van deze informatiebronnen. Als u vragen hebt, kunt u deze stellen op discussieforums op internet. Vaak zijn op de pagina's in dit boek links opgenomen naar plaatsen waar meer informatie te halen is; neem deze mee in uw zoektocht naar de oplossing van uw probleem.