HTML Basiskennis - Structuur
Wat is de structuur van een HTML-document?
Start ~ Kop elementen ~ Body elementen ~ Template
Start van het document
Elk HTML-document begint met een declaratie om aan te geven welk type document het betreft. Deze DOCTYPE-declaratie verwijst naar een formele definitie van de gebruikte markup-taal. Het ziet er ingewikkeld uit, maar je hoeft er verder niets mee te doen.
Daarna volgt een tag om de start van het HTML-document te markeren: <HTML>. Het aldus begonnen element HTML omvat verder het hele document.
Vervolgens wordt het HTML-element in tweeën gesplitst: de elementen HEAD (met informatie over het document) en BODY (waarin de eigenlijke inhoud komt).
We hebben nu de basis van een HTML-document, dat er als volgt uitziet:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<HTML>
<HEAD>
... hier komen kop elementen ...
</HEAD>
<BODY>
... hier komen body elementen ...
</BODY>
</HTML>
Kop elementen
In het kop element moet in ieder geval de titel van het document worden opgenomen m.b.v. het element TITLE. Er zijn nog enkele andere elementen mogelijk in de kop. Deze worden hier niet behandeld.
Body elementen
In de body komen één of meer blok-elementen. Dit zijn elementen die op zichzelf een logische eenheid vormen, en beginnen en eindigen met een regeleinde.
Voorbeelden zijn: koppen (H1 t/m H6), paragrafen (P), lijsten (UL, OL) en tabellen (TABLE).
Binnen een blok-element kunnen één of meer inline elementen worden opgenomen. Dit zijn elementen die op zichzelf een kleine logische eenheid vormen. Ze beginnen en eindigen niet met een regeleinde, en kunnen ook geen blok-elementen bevatten. Wel kunnen ze soms andere inline elementen bevatten.
Voorbeelden zijn:
- Elementen voor inhoudelijke kenmerken, zoals EM voor emphasis (nadruk) en STRONG voor sterke nadruk
- Elementen voor opmaakkenmerken, zoals B voor bold (vet), I voor italic (cursief) en FONT voor lettertype- manipulatie
- Elementen voor het opnemen van hyperlinks A en plaatjes IMG
Voorbeeld van markup met blok- en inline elementen:
<P>Dit is een paragraaf.</P>
<P>Dit is een paragraaf met <EM>benadrukte</EM> onderdelen.</P>
<P>Dit is een paragraaf met <EM>benadrukte</EM> onderdelen, waarvan sommige onderdelen <STRONG>extra veel nadruk</STRONG> hebben gekregen.</P>
Voorbeeld-weergave in jouw browser.
Template voor een HTML-document
Hieronder staat een template voor een eenvoudig HTML-document. In het onderdeel elementen worden de eigenschappen van de belangrijkste elementen beschreven.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<HTML>
<HEAD>
<TITLE>De titel van het document</TITLE>
</HEAD>
<BODY>
<H1>De belangrijkste kop</H1>
<P>De rest van de inhoud van het document, bestaande uit diverse blok-elementen</P>
<UL>
<LI>Zoals een <STRONG>lijst</STRONG></LI>
<LI>Met enkele</LI>
<LI>Items</LI>
</UL>
<ADDRESS>Adresgegevens van de auteur.</ADDRESS>
</BODY>
</HTML>
Voorbeeld-weergave in jouw browser.