HTML les 3 – De eerste site
We gaan nu daadwerkelijk aan de slag met het maken van een site. We nemen een voorbeeld
site aan de hand waarvan we een site gaan maken en uitbouwen. Het voorbeeld is een site
over de school ‘de Klingel’ te Klingeldam. Het is handig om elk stapje daadwerkelijk uit te voeren, om
direct het resultaat te bekijken en te ervaren.
De vorige les hadden we een pagina aangemaakt die we hadden opgeslagen in de map
‘cursus’. Deze gaan we er weer bij halen. We gaan voorlopig werken met Kladblok.
Mocht je de vorige les niet hebben gedaan, kopieer dan onderstaand model voor je
site en plak deze in een lege pagina in Kladblok.
<html>
<head>
<title>Untitled</title>
</head>
<body>
</body>
</html>
Opdracht 1
Geef eerst je site maar eens een titel. Dat zet je tussen de twee title-elementen.
dus als volgt: <title>De Klingel</title>
Nu gaan we het bestand eerst opslaan. Het is om twee redenen van belang dit vaak
te doen. Ten eerste om belangrijke gegevens niet kwijt te raken. Ten tweede omdat je
alleen opgeslagen pagina’s kunt zien in de browser.
1. Kies in bestand; “opslaan als”.
2. Kies dan in “Mijn Documenten” voor de map “Cursus”.
3. Typ dan als bestandsnaam index.htm
4. Bij opslaan als type klik je op het pijltje zodat er Alle bestanden komt te staan.
5. Zorg er voor dat je .htm altijd(!) toevoegd. Anders krijg je een textdocument,
onleesbaar voor een browser.
6. Klik daarna op opslaan.
We gaan nu eens wat vulling geven aan de site zelf. Een titel hebben we al. Nu wat
tekst. Bijvoorbeeld zoiets als:
“Welkom op de website van Basisschool De Klingel.
De Klingel is een leuke basisschool in het dorpje Klingeldam.
Verder is dit de eerste website van de school.”
Deze tekst komt tussen <body> en </body> te staan. Dus als volgt.
Nu de tekst weer even opslaan. En dan gaan we alles eens bekijken.
We gaan naar het bureaublad en klikken op de map “Mijn Documenten”.
Dan gaan we naar “Cursus”.
Klik nu maar op index.htm
Zie hier het resultaat!!
Als je verder gaat hoef je niet steeds de browser te sluiten, klik gewoon op
in de rechterbovenhoek. Als je dan weer verder
hebt gewerkt, en je de pagina weer hebt opgeslagen, klik je op de balk onderin je
pagina.
Nog even op vernieuwen
klikken en de site is er weer, helemaal up-to-date.
Doe het maar eens en typ een extra
regel op de website.
