HTML

Introductie tot XHTML

Wat is XHTML?

Een pagina voor het World Wide Web (www) moet gelezen kunnen worden door een browser zoals Internet Explorer, Chrome, Firefox, Safari etc. Als een browser een pagina goed moet kunnen lezen, is het belangrijk dat deze de opmaaktaal van zo’n pagina begrijpt. Het is vergelijkbaar met Word. Een Word-document kan je alleen lezen met een programma dat Word documenten begrijpt.

De taal voor het maken van webpagina’s is HTML (Hyper Text Markup Language). Het systeem waarbij er met hypertext, tekst met hyperlinks, verwijzingen,  wordt gewerkt.

HTML is een pagina beschrijvingstaal. Je geeft aan waar wat moet komen te staan.

In deze cursus gebruiken we XHTML (Extensible Hypertext Markup Language). Met XHTML kan je, net als met HTML, webpagina’s bouwen. XHTML is eigenlijk een “verbeterde” versie van HTML. De regels voor het gebruik van XHTML zijn wel veel strenger dan bij HTML. Dit zullen we veelvuldig laten zien.

 

XHTML-bestanden maken

Een XHTML-bestand maak je op dezelfde manier als een tekstbestand: je opent een programma waarmee je teksten kunt typen en je slaat je tekst op als een tekstbestand. Alleen, om aan te geven dat je een XHTML-bestand hebt getypt en geen tekstbestand, geef je het bestand de extensie .html in plaats van .txt.

 

Het simpelste programma om teksten mee te typen is Kladblok. Kladblok is geïnstalleerd op elke pc waar Windows op draait.

 

 

Dreamweaver is eigenlijk de standaard voor het maken van webpagina’s.

 

In deze cursus gebruiken we Kladblok. In het vervolg stappen we over op Dreamweaver.

 

Elementen en tags

Een XHTML-document bevat meer dan alleen maar een tekst. Je kunt de opmaak van je tekst bepalen en allerlei objecten invoegen. Dit doe je door bepaalde codes te gebruiken. Deze codes noemen we elementen.

 

De  meeste elementen bestaan uit twee tags. De eerste tag geeft het begin van een element aan en de twee tag het einde. Om bijvoorbeeld aan te geven dat een document een XHTML-document is, begin je het document met <html> en je eindigt met </html>. Het is verplicht dat alle tags met kleine letters geschreven worden.

 

Zoals hieruit al blijkt staat elke tag tussen een kleiner-dan- (<) en een groter-dan-teken (>). Een eindtag heeft bovendien een slash (/) na het kleiner dan-teken.

 

XHTML schrijft voor dat alle elementen bestaan uit twee tags; een openingstag en een sluitingstag. In een aantal situaties kun je het anders oplossen. Als je een horizontale lijn wilt tekenen gaat dan op de volgende manier: <hr></hr>. Dit is echter niet verstandig daar oudere browsers er niet goed mee overweg kunnen en het lijkt net alsof je inhoud tussen de tags zou kunnen zetten wat bij dit voorbeeld niet kan! Gebruik daarom alleen de volgende constructie:

<hr /> . Let op de spatie in deze combitag!  Je kunt dit ook gebruiken als je bijvoorbeeld een regel wilt overslaan:
<br />.

Opdracht 1

Een simpel XHTML-bestand

We gaan nu eens een heel klein XHTML-bestand in elkaar zetten. Typ de volgende tekst in Kladblok en sla het bestand op als simpel.html. Open het bestand daarna in je webbrowser.

 

<html>

<head>

<title>Een simpel HTML-bestand.</title>

</head>

 

<body>

Hier komt de tekst te staan.

</body>

</html>

 

Zo ziet ons HTML-bestand er uit in de browser Internet Explorer.

 

 

 

Basiselementen

In dit voorbeeld gebruiken we vier elementen. Elk HTML-document moet op z’n minst deze vier elementen bevatten. We bekijken ze stuk voor stuk.

 

Opdracht: 2

 

maak deze website na in kladblok, sla het bestand op als: summer.html

 

de tekst is hier te verkrijgen

 

verder

 

 

©jw webdesign