Les 1
Tags in XHTML
In de inleiding van deze cursus zei ik al dat XHTML een strengere taal is dan HTML. Er zijn een paar vereisten waaraan je tags moeten voldoen om hiervan geldige XHTML tags te maken. In gewoon HTML golden deze vereisten niet. Hieronder bespreek ik deze vereisten stuk voor stuk.
Lowercase
Dit is waarschijnlijk de grootste verandering die geldt voor XHTML code: alle tags moeten nu lowercase zijn, dat wil zeggen: in kleine letters. Standaard HTML was niet case-sensitive.
Dus fout is nu:
<Table>
<TABLE>
<TablE>
De enige, juiste manier om deze tag te schrijven in XHTML is:
<table>
Geneste Tags
Een ander belangrijke regel in XHTML is dat je de tags correct moet nesten.
Dit betekent dat je de tags in de juiste volgorde moet openen en sluiten.
Fout is dus:
<p><b><i>Tekst van de pagina.</b></i></p>
Waarom is dit nu fout? Omdat de tags niet in de juiste volgorde gesloten zijn.
De sluitingstag </i> had voor de </b> tag moeten staan.
De correcte code is dus als volgt:
<p><b><i>Tekst van de pagina.</i></b></p>
Alle Tags Sluiten!
Dit zal je waarschijnlijk het meeste werk opleveren bij het omzetten van oude HTML code naar XHTML. Je moet namelijk alle tags sluiten in XHTML! Natuurlijk moest je in HTML ook al een heleboel tags sluiten, zoals:
<a></a>
<b></b>
<table></table>
Maar er was ook een aantal tags dat niet gesloten hoefde te worden. De meest voorkomende tags van dit type waren:
<br>
<hr>
<img>
In XHTML moeten deze tags wel gesloten worden! Je kunt deze tags op twee manieren sluiten.
De eerste manier zal je bekend voorkomen.
Je voegt gewoon een sluitingstag toe.
Dus:
<br></br>
<hr></hr>
<img></img>
Bij de tweede manier voeg je de sluitingstag toe aan de al bestaande tag. Dit doe je als volgt:
<br />
<hr />
<img />
Als je er eenmaal aan gewend bent is de tweede methode waarschijnlijk het prettigst om mee te werken.
Dit is ook de manier die aanbevolen wordt door het W3C.
Het zal je waarschijnlijk ook zijn opgevallen dat er in de code hierboven een spatie staat voor de / . Deze spatie is strict gezien niet nodig, dus <img/> zou ook correct zijn. Ik raad je echter wel aan de spatie telkens te gebruiken, omdat je XHTML code anders problemen zal opleveren voor bezoekers met een oudere browser.
De / plaats je voor het > teken. Een <img> tag zou er dus als volgt kunnen uitzien in XHTML:
<img src="plaatje.jpg" width="100" height="50" alt="Alternatieve tekst" />
Einde les 1
Dit is het einde van de eerste les. Je leerde hier de regels die gelden voor het maken van correcte XHTML tags. In de volgende les leer je de regels die gelden voor attributen in XHTML.
Homepage-Maken Tip
De makkelijkste manier om je eigen website te maken?
Dat is via een website bouwer als Weebly. Hiermee kun je eenvoudig via je browser door middel van drag-en-drop een website bouwen. Je kunt volledig gratis beginnen met 500MB webruimte voor je site. Zo nodig kun je een betaald pakket nemen met eigen domeinnaam, "onbeperkte" opslag (fair use policy) en e-commerce mogelijkheden.
Weebly is daarom een prima optie als je snel een website in elkaar wilt zetten. Kennis van HTML of het installeren van een eigen content management systeem is niet nodig bij Weebly.
