Inleiding
Webpagina's bestaan uit (X)HTML-broncode waarbinnen content (tekst, afbeeldingen, tabellen, formulieren) wordt geplaatst. Binnen (X)HTML bestaan er verschillende versies, lopend van HTML 2.0 tot 4.01 (en momenteel met HTML 5 in een zeer vergevorderde ontwikkelingsfase), en van XHTML 1.0 tot 1.1 (met de ontwikkeling van XHTML 2.0 is men inmiddels gestopt).
HTML 2.0 en HTML 3.2 zijn onderhand meer dan 'onbruikbaar' geworden, omdat de (opmaak)mogelijkheden hierbinnen zeer beperkt zijn.
HTML 4.01 is heel goed te gebruiken versie en tot op heden de laatste officiële versie binnen HTML.
HTML 5 is echter al zo ver geïmplementeerd in de bekendste typen browsers, Chrome, Firefox, Internet Explorer 9, Opera en Safari, dat je bij HTML 5 al een beetje zou kunnen spreken van de laatste officiële HTML-versie.
XHTML 1.0 en XHTML 1.1 zijn te beschouwen als XML-variant en werden tot voor kort door het W3C als opvolger(s) van HTML 4.01 gezien.
Sinds enkele jaren wordt HTML 5 echter als de opvolger van HTM 4.01 beschouwd.
Wat dat voor consequenties voor XHTML heeft, zal de toekomst moeten leren (mijn inschatting is dat XHTML geen partij zal zijn voor HTML 5, al was het maar door de semantische tags, header, footer, enzovoorts, in 5.
XHTML en HTML bieden dezelfde opmaakmogelijkheden, maar verschillen hierin dat HTML door de webserver als tekst (text/html) wordt geïntepreteerd, terwijl XHTML door de webserver als een applicatie (application/xhtml+xml) behoort te worden / wordt geïntepreteerd. Met andere woorden, HTML wordt via een SGML-parser en XHTML door een XML-parser verwerkt.
Doorgaans wordt XHTML als een HTML-medium gebruikt om tekst en afbeeldingen en dergelijke weer te geven; de meeste webontwerpers maken geen gebruik van de integratie-mogelijkheden van XHTML met ander XML-toepassingen als SVG en MathML.
Dat roept de vraag op wat de meerwaarde van XHTML ten opzichte van HTML in de praktijk zou zijn.
Op basis van HTML 4.01 Strict is ISO-HTML ontwikkeld. Deze 'basale' versie van HTML 4.01 is zeer geschikt voor gebruik in eenvoudig gestructureerde content zoals wetenschappelijke teksten, waar de inhoud belangrijker is dan de presentatie.
ISO-HTML kan door de strikte regels waaraan het moet voldoen, gemakkelijk worden omgezet naar gevalideerd HTML 4.01, XHTML 1.0 en 1.1.
Die striktheid / eenvoud in regels komt tot uiting in het feit dat in de img-tag de attributen width, height en border niet mogen worden gebruikt; deze eigenschappen moeten altijd worden beschreven in een stylesheet; en zo zijn er meer atrributen die uitgesloten zijn. Verder mag de hx-tag (h1 t/m h6) nooit in een div-tag staan; en de hx-tags mogen officieel alleen in aflopende volgorde worden gebruikt zodat h4 niet voor h3 mag komen staan.
Dat laat zien dat deze versie van HTML een minder ingewikkelde structuur heeft dan HTML 4.01. Zie http://jp29.org/iso.htm voor meer informatie op dit vlak.
Maar al met al is ISO-HTML ongeschikt voor het maken van 'echte' websites.
Intussen is er gewerkt aan een directe officiële opvolger van HTML 4.01: HTML 5.
HTML 5 werd in eerste instantie door de WHATWG community geïnitialiseerd. Later heeft het W3C zich bij de ontwikkeling ervan aangesloten.
Er zijn steeds meer webpagina's in HTML 5 te vinden op het web. Daarnaast zijn er ook al online-validators voor HTML 5 beschikbaar: W3C Markup Validation Service en Validator.nu (X)HTML5 Validator.
In begin 2011 heb ik op grond van alle ontwikkelingen op het web deze website van XHTML 1.0 Strict omgebouwd naar HTML 5. Het risico dat sommige bezoekers door gebruik te maken van een verouderde browser deze site niet goed kunnen inlezen, weegt niet op tegen de wens om mee te gaan in de nieuwste webontwikkelingen.
Verderop op deze pagina vindt u een (gevalideerde) pagina in HTML 5 met een overzicht van onder andere alle nieuwe tags.
De zin van het valideren van webpagina's
Wat is de zin van het valideren van webpagina's?
Net als verkeersregels zijn strikte gebruiksregels voor (X)HTML zinvol: ze bevorderen de doorstroom / het parsen van de (X)HTML-code.
Als je 'afgekeurde' code (zoals font) gebruikt of gewoon fouten maakt in de code, moet de parser van de webbrowser die allemaal verwerken.
Het eindresultaat is dan doorgaans dezelfde als bij gebruik van schone en correcte (X)HTML-code, maar in het laatste geval wordt de webpagina soepeler en sneller geladen.
De parser verdoet immers geen tijd aan het doorploegen van foutieve of niet te gebruiken informatie.
In dit verband is het heel onwenselijk om Word-documenten in HTML-vorm op het web te plaatsen. Het door Word gebruikte HTML is zo complex en niet-conform de internationaal geaccepteerde HTML-validatie-normen, dat elke browser onnodig veel tijd kwijt is om die code-brij door te ploegen.
Door een webpagina te laten valideren (via de online-validatie-machine van het W3C of ) weet je zeker dat die webpagina snel en soepel wordt geladen.
Bovendien is de kans groter, dat zo'n pagina ook identiek in de verschillende typen browsers (Firefox 133.0.3 (64-bits), Opera 115.0.5322.109 (64-bits), Safari , Chrome 131.0.6778.205 (64-bits), Konqueror en Internet Explorer 9) wordt weergegeven.
Die kans wordt nog meer vergroot, als er ook gebruik wordt gemaakt van correcte CSS-stylesheet-codering.
Gevalideerd HTML 5 bij deze website
Het toepassen van HTML 5 bij deze website is kort samengevat door de volgende factoren bepaald.
Dat er nu twee betrouwbare online-validators voor HTML 5 beschikbaar zijn, er een groeiend aantal HTML5-websites verschijnen en de meeste typen browsers HTML 5 ondersteunen, is doorslaggevend geweest om deze site om te bouwen naar HTML 5.
Opmerking 1. CSS3 wordt helaas nog niet volledig gevalideerd, aangezien menig element hieruit zoals border-radius, nog niet wordt herkend / ?erkend? door W3C CSS Validatie Service.
Een andere zwakke schakel in het geheel is dat niet alle CSS3-opmaakelementen door de genoemde typen browsers worden weergegeven. IE is in de CSS3-support tot dusverre het minst ver ontwikkeld.
Inleiding tot Voorbeelden
Hieronder krijgt u een reeks van gevalideerde HTML en XHTML-voorbeelden aangeboden.
Opmerking 2. (X)HTML als frames-webpagina (met de doctype Frameset in HTML 4.01 en XHTML 1.0) blijft hier verder buiten beschouwing, aangezien de content van ingebedde frames onzichtbaar is in de broncode en daardoor in strijd is met het principe van accessibility.
Bovendien worden er ook voorbeelden gepresenteerd die verwant zijn aan HTML (C-HTML en ISO-HTML) en XHTML (WML, XHTML Basic en SVG).
Voorbeelden 1: (X)HTML
Voorbeeld webpagina in HTML 2.0: HTML 2.0.
Voorbeeld webpagina in HTML 3.0: HTML 3.0.
Voorbeeld webpagina in HTML 3.2: HTML 3.2.
Voorbeeld webpagina in HTML 4.0 Transitional: HTML 4.0 Transitional.
Voorbeeld webpagina in HTML 4.0 Strict: HTML 4.0 Strict.
Voorbeeld webpagina in HTML 4.01 Transitional: HTML 4.01 Transitional.
Voorbeeld webpagina in HTML 4.01 Strict: HTML 4.01 Strict.
Voorbeeld webpagina in ISO HTML: ISO HTML.
Voorbeeld webpagina in HTML 5: HTML 5.
Voorbeeld webpagina in XHTML 1.0 Transitional: XHTML 1.0 Transitional.
Voorbeeld webpagina in XHTML 1.0 Strict: XHTML 1.0 Strict.
Voorbeeld webpagina in XHTML 1.1: XHTML 1.1.
Voorbeelden 2: C-HTML, SVG, WML, XHTML Basic
Voorbeeld webpagina in C-HTML 1.0 Draft: C-HTML 1.0 Draft.
Voorbeeld webpagina in C-HTML 2.0 Draft: C-HTML 2.0 Draft.
Voorbeeld met afbeelding in SVG 1.0: SVG 1.0.
Opmerking 3. SVG 1.0 wordt alleen in de versie 9 van Internet Explorer correct weergegeven.
Voorbeeld met afbeelding in SVG 1.1: SVG 1.1.
Opmerking 4. SVG 1.1 wordt alleen in de versie 9 van Internet Explorer correct weergegeven.
Voorbeeld webpagina in WML 1.1: WML 1.1.
Opmerking 5. WML 1.1 wordt in Internet Explorer niet correct weergegeven.
Voorbeeld webpagina in WML 1.2: WML 1.2.
Opmerking 6. WML 1.2 wordt in Internet Explorer niet correct weergegeven.
Voorbeeld webpagina in WML 1.3: WML 1.3.
Opmerking 7. WML 1.3 wordt in Internet Explorer niet correct weergegeven.
Voorbeeld webpagina in WML 2.0: WML 2.0.
Voorbeeld webpagina in XHTML Basic 1.0: XHTML Basic 1.0.
Voorbeeld webpagina in XHTML Basic 1.1: XHTML Basic 1.1.
Voorbeelden 3: XML
Voorbeeld I webpagina in XML: XML 1.0 + CSS.
Voorbeeld II webpagina in XML: XML 1.0 + XSL.
Voorbeeld III webpagina in XML: XML 1.0 + CSS + DTD.
Voorbeeld IV webpagina in XML: Sitemap with CSS layout.
Joost De WebMaker
2002-2024 © Joost van Meeteren
Laatste update website: maandag 30 december 2024
Deze website past cookies toe voor optimaal gebruik van dit platform | bron |