De structuur van een XHTML-document ................................................................................... 8 3.1 Opbouw van XHTML ............................................................................................................. 8 3.2 DOCTYPE............................................................................................................................... 8 3.3 Namespace............................................................................................................................... 9 3.4 Tekenset................................................................................................................................... 9
4
XHTML-tags................................................................................................................................ 11 4.1 Elementen binnen de -tag......................................................................................... 11 4.2 Elementen binnen de -tag......................................................................................... 12 4.3 Definitielijst........................................................................................................................... 16 4.4 Tabellen ................................................................................................................................. 17 4.5 Hyperlinks en anchors ........................................................................................................... 20
5
XHTML-regels............................................................................................................................. 23 5.1 Alle tagnamen met kleine letters schrijven............................................................................ 23 5.2 Alle tags afsluiten .................................................................................................................. 23 5.3 Alle waarden van attributen tussen aanhalingstekens plaatsen ............................................. 24 5.4 Alle afbeeldingen moeten een alt-attribuut hebben............................................................... 24 5.5 Alle elementen moeten correct genest zijn............................................................................ 24 5.6 Commentaren correct schrijven............................................................................................. 25 5.7 Geen Attributen minimaliseren ............................................................................................. 25 5.8 Het id attribuut in plaats van name........................................................................................ 25
6
XHTML validaren....................................................................................................................... 26 6.1 On-linevalidatie ..................................................................................................................... 26 6.2 Aparte toepassingen voor validatie ....................................................................................... 27
XHTML In deze cursus maak je kennis met de principes van XHTML (Extensible HyperText Markup Language), dit wordt de basistaal voor het maken van webpagina's. XHTML is een vernieuwde versie van HTML 4.01 in XML en wordt herkend door de bestaande browsers, mits enkele eenvoudige regels te volgen. XHTML 1.0 werd een officiële W3C aanbeveling op 26 januari 2000. Een W3Caanbeveling betekent dat deze versie nu een webstandaard is.
In feite is het geen taal voor het opmaken van webpagina's, maar een taal waarmee documenten gestructureerd worden. De bedoeling is dat je na het doorlopen van deze cursus inzicht hebt in de basissyntaxis en structuur van XHTML-documenten. Op de duur zal HTML door XHTML vervangen worden. XHTML lijkt erg veel op HTML 4.0, maar is een strengere en “gekuiste” versie van HTML. Een XHTML-pagina is niets anders dan een tekstdocument dat een andere extensie gekregen heeft en waarin de tekst in een bepaalde codering staat. Dat verklaart ook waarom XHTML-bestanden vrij klein zijn. In XHTML worden speciale controletekens en codewoorden gebruikt. Deze worden tags genoemd. Een tag staat altijd tussen < en > tekens. Welke standaarden moet je kennen : •
(HTML), XHTML en XML voor het structureren van gegevens.
•
CSS level I en CSS level 2.1 voor het presenteren (opmaken) van gegevens.
•
ECMAScript en DOM voor interactieve items en gedrag (behavior) voor gegevens.
Onderstaande figuur geeft de relatie tussen deze standaarden weer. Dit is een erg belangrijke figuur
Structuur Lab Multimedia XHTML en Webtechnologie XML
XHTML is een herformulering van HTML 4 in XML. Maar wat houdt die herformulering precies in ? Waarom zouden we dat eigenlijk willen, HTML herformuleren als XML. Daar zijn verschillende redenen voor. •
XML is consistent, terwijl HTML dat niet is. Als u in een XML-document een tag opent, moet deze ook weer gesloten worden. In HTML is dat niet het geval. Sommige tags kennen wel een sluittag (
…..
, terwijl andere geen sluittag kennen (vb. ). Weer andere tags kennen weliswaar een sluittag (bijvoorbeeld
…
), maar als deze ontbreekt, is er ook geen man overboord. De browser bakt er wel wat fraais van. Dat is in XML ondenkbaar. Het traditioneel HTML is daardoor onvoorspelbaar, hetgeen bij vertoning op verschillende typen devices voor problemen kan zorgen. XHTML is daarentegen net als XML voorspelbaar en consistent
•
Door webdocumenten te baseren op een XML-gebasseerde taal (XHTML) is samenwerking en gegevensuitwisseling met toekomstige XML-applicaties veel makkelijker geworden. Elke moderne device kan ermee overweg. Of het nu een webbrowser is, een tablet PC, een Smart Phone, noem maar op. Bovendien is XHTML volledig backward compatible.
Lab Multimedia en Webtechnologie
-5-
Bachelor Toegepaste Informatica
Christophe De Waele
XHTML is de huidige standaard terwijl toch de complete HTML 4-tagset wordt ondersteund. XHTML slaat de brug tussen HTML en XML.
2
VERSIES VAN XHTML
2.1
XHTML 1.0
XHTML is de oudste versie van XHTML en de directe opvolger van HTML 4.01. Deze versie heeft volgende kenmerken. • • • •
Alle tags uit HTML 4.01 worden ondersteund. De wijze waarop de tags door de browser worden ondersteund, is afhankelijk van het opgegeven documenttype (DOCTYPE). Deze regel was overigens ook al van kracht voor HTML 4.01 maar moderne browsers interpreteren deze regel nu strenger. XHTML is onbeperkt neerwaarts compatibel. Er zijn binnen XHTML weer drie subtypen te onderscheiden. W3C noemt het “de drie smaken van XHTML 1.0”
2.2
o
XHTML-1.0-Strict : gebruik deze versie als je 100 % structurele webdocumenten wilt schrijven die vrij zijn van alle opmaakkenmerken. Alle opmaak moet vastgelegd zijn in CSS-bestand. Dit is de strengste vorm.
o
XHTML-1.0-Transitional: gebruik deze versie om gebruik te maken van alle voordelen van XHTML maar toch de vrijheid van HTML te behouden. Het staat vrij CSS te gebruiken.
o
XHTML-1.0-Frameset : gebruik deze versie indien uw site gebruik maakt van frames om de site weer te geven. In deze versie is het bijvoorbeeld verboden om de tag te gebruiken. Alleen frametags zijn toegestaan. De documenten die binnen de frames worden getoond, kunnen vervolgens weer van het type Transitional of Strict zijn.
XHTML 1.1
Dit is een breuk met het verleden. Tags die in HTML 4.01 de status deprecated hebben, zijn in XHTML 1.1 verboden. Zo mogen in XHTML 1.1 documenten tags als ,