opmerking In deze instructie wordt een web gemaakt met frames. Het voorbeeld behandelt een digitaal portfolio, maar natuurlijk kun je de instructies gebruiken voor elk web met frames, ongeacht het onderwerp.
Frontpage 2003 Als je Frontpage hebt geïnstalleerd staat er in de map ‘Mijn documenten’ een map ‘Mijn websites’, met daarin een map ‘_private’ en een map ‘images’. Dat is de standaardindeling die Frontpage aan elk web geeft. De eerste map is bedoeld voor bestanden die niet gezien mogen worden door de bezoekers van je web, de tweede voor alle afbeeldingen. Binnen deze map maak je een nieuw web aan. Frontpage geeft het automatisch de naam ‘Mijnweb’ met een nummer erachter, tenzij je zelf een naam aan het web geeft. Een web aanmaken in Frontpage doe je zo: 1
Start Frontpage op.
Het openingsvenster van Frontpage verschijnt. Figuur 6.1a Het openingsvenster van Frontpage
2 Klik in het menu rechts op het pijltje naar beneden dat naast ‘Aan de slag’ staat en kies ‘Nieuw’ in het uitklapmenu. Het menu ‘Nieuw’ verschijnt.
Figuur 6.2a Het menu ‘Nieuw’
3
Kies in dit menu voor website met één pagina.
Het venster ‘Websitesjablonen’ opent.
Figuur 6.3a Het venster ‘Websitesjablonen’
4
Klik op ‘Lege website’.
5 Bij ‘Geef de locatie van de nieuwe website op:’ vul je het pad in naar de map waar je het web gaat zetten. Geef het web een goede naam. Hier is gekozen voor het pad ‘C:\Documents and Settings\RoelD\Mijn documenten\Mijn websites\digitaalportfolio’. 6
Klik op de OK-knop.
Het lege web wordt nu door Frontpage aangemaakt en het verschijnt in het Frontpagevenster.
Figuur 6.4a Het web is aangemaakt
1
Kies in het menu voor ‘Bestand’ – ‘Nieuw’ – ‘Pagina of web’.
Het volgende menu ‘Nieuw’ (figuur 6.2a) verschijnt weer in de workspace van Frontpage, net zoals toen je een nieuw web ging maken bij stap 2. 2
Klik op ‘Lege pagina’.
Er verschijnt een pagina met de naam ‘nieuwe_pagina_1.htm’ in de Frontpage workspace.
Figuur 6.5a Een nieuwe pagina
3
Sla de pagina op onder een goede naam.
tip Een goede naam is niet te lang, bevat geen spaties of hoofdletters en eindigt op .htm.
De eerste pagina kun je het beste opslaan als ‘template.htm’. Deze lege pagina kun je dan steeds als basis gebruiken wanneer je een nieuwe pagina gaat maken. Nu moet je op de pagina een indelingstabel maken, zodat je tekstkolom niet te breed wordt. 4
Klik in het menu op ‘Beeld’ en vervolgens op ‘Taakvenster’.
Het taakvenster opent rechts in de workspace van Frontpage. 5 Klik op de pijl naar beneden naast ‘Nieuw’ en kies ‘Indelingstabellen en -cellen’ in het uitklapmenu. Het volgende taakvenster verschijnt.
Figuur 6.6a Het taakvenster ‘Indelingstabellen en -cellen’
6
Klik op ‘Indelingstabel invoegen’.
Er verschijnt nu een indelingstabel op de nieuwe pagina.
Figuur 6.7a Pagina met indelingstabel
Vervolgens moet je zorgen dat de tabel de hele hoogte van de pagina vult. 7 Klik op het pijltje bij de linker maataanduiding en kies in het uitklapmenu ‘Rij automatisch uitrekken’. Figuur 6.8a Maatvoering indelingstabel
De indelingstabel is nu gemaakt. Je kunt bij tabelindeling ook voor andere indelingen kiezen, als je de pagina in meer blokjes wilt verdelen. In de indelingstabel kun je straks alle soorten inhoud kwijt: tabellen, opsommingen, afbeeldingen en tekstblokken. 8
Sla de pagina weer op.
Nu moet je de andere pagina’s maken die je nodig hebt voor je website. Je gebruikt daarbij de zojuist gemaakte pagina als basis. 9 Klik in het menu rechts in de workspace op het pijltje naast ‘Indelingstabellen en cellen’ en kies ‘Nieuw’. Het menu ‘Nieuw’ opent weer. 10 Klik onder ‘Nieuwe pagina’ op de optie ‘Op basis van een bestaande pagina’. Het venster ‘Nieuw van bestaande pagina’ verschijnt.
Figuur 6.9a Het venster ‘Nieuw van bestaande pagina’
11 Kies de pagina die je net gemaakt en opgeslagen hebt uit de lijst (hier ‘template.htm’). Nu maakt Frontpage een nieuwe pagina aan in het web, die dezelfde indeling en kenmerken heeft als de eerste pagina die je hebt gemaakt en die je als ‘template.htm’ hebt opgeslagen. 12 Sla ook deze pagina op onder een goede naam. Een goede naam is niet te lang, bevat geen spaties of hoofdletters en eindigt op .htm. Voorbeelden van goede namen zijn: • personalia.htm: bevat je persoonsgegevens • opleiding.htm: bevat je opleidingsgegevens • werkervaring.htm: bevat je werkervaring • swot.htm bevat je persoonlijke SWOT • leerstijl.htm bevat je leerstijl • kwaliteit.htm bevat je kwaliteiten • vaardigheden.htm bevat je vaardigheden • competenties.htm bevat je competenties 13 Geef de pagina ook een passende titel. De titel van de pagina kun je veranderen via de knop ‘Titel Wijzigen …’. Deze titel van een pagina komt in de bovenbalk van de browser te staan als een bezoeker de pagina bekijkt. opmerking Als je de titel van de pagina later wilt veranderen, klik je in het menu op ‘Bestand’ en kies je vervolgens ‘Opslaan als…’. Je kunt nu de titel wijzigen via de bovengenoemde knop. Herhaal de deelstappen 10 tot en met 13 voor elke contentpagina die je nodig hebt.
tip Wanneer het taakvenster ‘Nieuw’ in de workspace niet zichtbaar is, kun je het snel openen met de toetscombinatie [ctrl][F1]. De pagina’s ‘navigatie.htm’ en ‘banner.htm’ maak je door in deelstap 11 te kiezen voor ‘Lege pagina’. Deze pagina krijgen immers een andere indeling dan de contentpagina’s. Wanneer je een fotocollage op je web wilt plaatsen, kies je voor ‘Meer paginasjablonen’. In het venster dat opent kies je voor ‘Fotocollage’. Op de pagina die dan wordt aangemaakt door Frontpage, staan de verdere aanwijzingen. Je hebt nu alle pagina’s voor het web gemaakt. Je kunt nu de stylesheets gaan maken. De pagina’s opmaken: kleuren en lettertypen Tijdens stap 1 heb je al nagedacht over het kleurgebruik in je website. Kleur en lettertype kun je per pagina definiëren. Je kunt ook werken met een zogenaamde stylesheet. Een stylesheet is een pagina met stijlkenmerken, waarvan je er meer per pagina kunt gebruiken. Een stijl is niets anders dan een aantal opmaakkenmerken voor een paginaonderdeel, tag in html termen, zoals een alinea of op kop, een link of een tabelcel of de hele pagina. Een voorbeeld: De inhoud van een webpagina zit ingeklemd tussen de en de tag. Een definitie van die tag zou er uit kunnen zien als Body
{font-family : verdana, arial; font-size : 11px; color : #000000; background-color : #FFCC00; }
Deze stijldefinitie schrijft voor dat de browser de pagina laat zien met een goudgele achtergrond en verdana als lettertype, kleur zwart. Kent je computer geen verdana, dan wordt arial getoond. Wil je nu de stijl aanpassen naar bijvoorbeeld een witte achtergrond, dan verander je in de stylesheet de background-color in #FFFFFF en sla je de stylesheet op. Alle pagina’s die deze stylesheet gebruiken hebben nu een witte achtergrond in plaats van een goudgele. Het voordeel van stylesheets is dan ook dat deze de onderhoudbaarheid van de opmaak van het web enorm vergroten, omdat je door een definitie op een stylesheet aan te passen, je in één keer alle pagina’s aanpast die deze stylesheet gebruiken. Zonder stylesheets moet je handmatig overal in je web het kenmerk aanpassen. Dat is voor een paar pagina’s wel te doen, maar een web groeit altijd en voor je er erg in hebt, moet je enorm veel pagina’s onderhouden. Met een tweede stylesheet kun je dan nog paginaspecifieke kenmerken definiëren. Zowel met Frontpage als met Dreamweaver kun je eenvoudig stylesheets maken. Voor elk element kun je op een dergelijk stylesheet de kenmerken definiëren. 1 2 3
Open het menu ‘Nieuw’ in de workspace op de gebruikelijke manier. Kies ‘Meer paginasjablonen’. Klik in het venster dat verschijnt op het tabblad ‘Opmaakmodellen’.
Het tabblad met de opmaakmodellen verschijnt.
Figuur 6.10a
4
Het tabblad ‘Opmaakmodellen’
Kies ‘Normaal opmaakmodel’ en klik op de OK-knop.
In de workspace van Frontpage is nu ‘nieuwe_pagina _1.css’ verschenen en een werkbalk ‘Stijl’. De extensie .css staat voor ‘cascading style sheet’. De werkbalk gebruik je om de stijl te definiëren. Figuur 6.11a
De werkbalk ‘Stijl’
5
Sla de stylesheet op onder een goede naam, bijvoorbeeld: basisstijl.css.
6
Klik in de werkbalk ‘Stijl’ op ‘Opmaakprofiel…’
Het venster opmaakprofiel verschijnt.
Figuur 6.12a
Het venster ‘Opmaakprofiel’
7 Dubbelklik onder ‘Opmaakprofielen’ op de HTML-opmaakcode die je een vaste stijl wilt geven, bijvoorbeeld h1, het tekstelement dat equivalent is aan kop1 in Word. Voor de betekenis van alle opmaakcodes of tags onder ‘Opmaakprofielen’ verwijzen we naar de helpfunctie van Frontpage, omdat het te ver voert alle termen hier te behandelen. De belangrijkste opmaakcodes worden in tabel 6.1a genoemd, met de belangrijkste op te maken kenmerken en het item dat je in het opmaakmenu moet kiezen om iets met die codes te kunnen. Het opmaakmenu wordt behandeld bij deelstap 8. Tabel 6.1a Opmaakcodes Tag Beschrijving tag
Stijlkenmerken
A A:hover
lettertype, kleur, tekststijl lettertype, kleur, tekststijl
Item opmaakmenu lettertype lettertype
achtergrond, kleur lettertype, kleur, tekststijl
randen lettertype
lettertype, kleur, tekststijl, marges, achtergrondkleur, rand lettertype, kleur, tekststijl
lettertype,randen
lettertype, kleur, tekststijl
lettertype
Body h1 t/m h6 P ul,ol
Li
Link link waar de muis bovenop staat Paginakenmerken Header1 t/m 6 (vergelijk koppen in Word) Alinea ordered (genummerde) of unordered (ongenummerde) list (vergelijk opsomming in Word) listitem (item in de ul of ol)
lettertype
opmerking Wanneer je opmaakcodes of tags voor een tabel gaat definiëren, moet je er rekening mee houden dat de eigenschappen ook voor de indelingstabel zullen gelden. Wil je dat niet, dan zul je een zogenaamde CLASS aan moeten maken voor de indelingscellen. Hier gaan we daar niet dieper op in, omdat dat buiten het kader van dit boek valt. Kijk voor hulp bij classes in de helpfunctie van Frontpage. Het venster ‘Opmaakprofiel wijzigen’ verschijnt. Figuur 6.13a
8
Het venster ‘Opmaakprofiel wijzigen’
Klik op de knop ‘Opmaak’.
Je kunt nu kiezen uit een aantal stijlkenmerken. Dat gaat precies hetzelfde als in bijvoorbeeld Word. Figuur 6.14a
9
Het menu ‘Opmaak’
Kies ‘Lettertype’.
Het venster ‘Lettertype’ verschijnt.
Figuur 6.15a
Het venster ‘Lettertype’
10 Kies een lettertype, tekenstijl en dikte. Voor h1 kun je kiezen voor Verdana, Vet, 15px. Als een waarde niet in de lijst staat, kun je die zelf intikken. 11 Klik op de OK-knop en klik vervolgens op de OK-knop in het venster ‘Opmaakprofiel wijzigen’. Je komt nu weer in het venster ‘Opmaakprofiel’. Herhaal de punten 7 tot en met 11 voor alle tags waarvan je de stijl wilt vastleggen. Onder lijst in het venster opmaakprofiel kun je wisselen tussen de lijst met de elementen waarvoor jij de stijl hebt vastgelegd en de lijst met alle tags waarvan je de stijl vast kunt leggen. 12 Als je alle elementen hebt gehad die je vast wilt leggen, klik je op de OK knop in het venster ‘Opmaakprofiel’. De opmaakkenmerken staan nu op de stylesheet.
Figuur 6.16a
Het stylesheet basisstijl.css
13 Sla de stylesheet op. Je hebt nu de basisstijl voor je pagina’s vastgelegd. Later kun je altijd nog stijlkenmerken veranderen door de stylesheet te openen en via de werkbalk ‘Stijl’ op de hiervoor beschreven manier kenmerken aan te passen. Voor de banner en de navigatie maak je nu aparte stylesheets door de deelstappen 1 tot en met 13 te herhalen. Noem deze stylesheets ‘banner.css’ en ‘navigatie.css’. Het lijkt wellicht wat overdreven om een stylesheet te maken voor een aparte pagina, maar naarmate je web groter wordt ga je ook daar veel plezier van krijgen. Sluit alle stylesheets nu af en zorg dat er tenminste één htm-bestand geopend is. 14 Klik in de menubalk op ‘Opmaak’. Het volgende uitklapmenu verschijnt.
Figuur 6.17a
Het uitklapmenu ‘Opmaak’
15 Klik op ‘Koppelingen’ in het opmaakmodel. Het venster ‘Opmaakmodel koppelen’ verschijnt. De eerste keer dat je dit venster opent, zal er niets onder URL staan. Figuur 6.18a
Het venster ‘Opmaakmodel koppelen’
16 Klik op ‘Toevoegen’. Er verschijnt een venster met de .css bestanden in het web. 17 Selecteer in de lijst het gewenste .css bestand (hier basisstijl.css.) en klik op de OKknop.
18 Selecteer de optie ‘Alle pagina’s’. Met ‘Alle pagina’s’ worden hier alle pagina’s van het web op dit moment bedoeld. Met ‘Geselecteerde pagina’ wordt de pagina bedoeld waar je op bezig bent op het moment dat je het opmaakmodel gaat koppelen. 19 Klik op de OK-knop. De stylesheet is nu aan alle pagina’s gekoppeld, waarmee deze in één keer allemaal opgemaakt zijn. Herhaal nu de deelstappen 14 tot en met 18 voor ‘navigatie.htm’ en ‘banner.htm’, waarbij je deze twee pagina's aan ‘navigatie.css’ en ‘banner.css’ koppelt door de optie ‘Geselecteerde pagina’ te kiezen in deelstap 17. De pagina’s vullen: tekst Over de tekst kunnen we kort zijn. Je bezoekers lezen van het beeldscherm dus houd het kort: gebruik korte kernachtige zinnen en weinig alinea’s per pagina. Voor de verdeling van de tekst over de pagina heb je een indelingscel op elk van de pagina’s gezet, die de breedte van de tekstkolom op 450px vasthouden. Daarmee krijg je prettig leesbare kolommen. Tekst invoegen werkt bij Frontpage en bij Dreamweaver bijna hetzelfde als bij Word. Er zijn eigenlijk maar een paar zaken waar je op moet letten: 1 Zet de tekst in de linker indelingscel, zodat de kolombreedte automatisch vastgelegd is. 2
Gebruik de opmaakelementen die je op de stylesheet hebt gedefinieerd.
Je zult zien dat de tekst dan automatisch verschijnt in de stijl die je in de stylesheet hebt gedefinieerd. Verder moet je rekening houden met het volgende: 3 Met de [enter]-toets op het toetsenbord start je een nieuwe alinea. Wil je naar de volgende regel, dan moet je de [Shift]-toets ingedrukt houden als je de [enter]-toets indrukt. 4 Uitlijnen met spaties is niet veilig. De meester browsers maken van een rij spaties één spatie. Gebruik liever een tabel om uit te lijnen. 5 Tot slot raden we je af stukken tekst uit Word zo in Dreamweaver of Frontpage te kopiëren, omdat er dan allerlei stijlkenmerken meekomen die je opmaak verstoren. Kopieer een dergelijk tekstblok eerst in het Notepad van Windows, om alle opmaak eruit te slopen en vervolgens in Dreamweaver of Frontpage. Dan gaat het altijd goed. 1
Open de pagina die je wilt bewerken.
2 Typ de tekst in de indelingscel waarbij je gebruikmaakt van de opmaakelementen in de werkbalk, als Kop1, Normaal, Lijst met opsommingtekens.
Figuur 6.19a
De opmaakelementen op de werkbalk
opmerking Gebruik alleen deze opmaakelementen om te voorkomen dat je de stylesheet overruled.
3
Sla de pagina op.
Meer hoef je niet te weten om tekst in te kunnen voeren. De pagina’s vullen: afbeeldingen Niet elke afbeelding is geschikt voor internetpagina’s. Dat heeft alles te maken met de downloadtijd die een afbeelding vergt. Waarschijnlijk heeft niet iedere bezoeker van je pagina de beschikking over breedband. Een goede manier om lange downloadtijden te voorkomen, is te werken met kleine aanklikbare afbeeldingen, die na aanklikken groter openen. Voordeel is dat de laadtijd beperkt blijft van de pagina met de kleine afbeeldingen en dat bezoekers zelf kunnen beslissen de grotere versie alsnog te openen. 1
Klik op de pagina waar je de foto op wilt hebben.
2
Klik op de afbeelding knop:
.
Het venster ‘Afbeelding’ verschijnt. 3 4
Dubbelklik op ‘images’ als het venster niet in de ‘images’ map opent. Klik op de afbeelding die je wilt plaatsen.
opmerking Nu zie je waarom je in een eerder stadium de te gebruiken afbeeldingen in de map [images] moest kopiëren. Browse nooit naar een map buiten de hoofdmap van het web waarin je werkt, omdat de afbeeldingen dan niet gevonden worden nadat je het web gepubliceerd hebt. De afbeelding staat nu op de pagina. Je kunt nu de kenmerken van afbeelding nog aanpassen. 5 Klik met de rechtermuisknop op de afbeelding en kies ‘Eigenschappen van de afbeelding’ in het pop-upmenu. Het venster ‘Eigenschappen Afbeelding’ verschijnt.
Figuur 6.20a
6
Het venster ‘Eigenschappen afbeelding’
Kies de gewenste terugloopstijl.
7 Kies de gewenste getallen bij ‘Indeling’. De horizontale en verticale afstand bepalen de afstand tussen de foto en de tekst eromheen. 8
Klik op de OK-knop.
Schroom niet wat te spelen met de verschillende instellingen en te kijken wat er vervolgens gebeurt. Navigatie- en bannerpagina maken Als alle tekstpagina’s af zijn, maak je de navigatiepagina en de bannerpagina, die je straks nodig hebt om de framespagina te maken. Navigatie- en bannerpagina’s gaat natuurlijk precies hetzelfde als tekstpagina’s maken in Frontpage of Dreamweaver. Je kunt dus de instructies hierboven erbij nemen als je er niet uit komt. We beginnen met de navigatiepagina. Hierop komen de links naar de pagina’s. Voorlopig zet je hier slechts de termen die de bezoeker naar de juiste pagina moeten leiden. In geval van een digitaal portfolio kun je dan denken aan termen als: persoonsgegevens, opleiding, werkervaring, persoonlijke SWOT, leerstijl, kwaliteiten, vaardigheden en competenties. Je kunt er ook voor kiezen hier knoppen te maken. Bijvoorbeeld door afbeeldingen te gebruiken die je als link laat werken. Maak nog geen links naar de verschillende pagina’s. Doe dat nadat de framespagina gemaakt is, omdat de links naar het juiste deel van het frame moeten verwijzen. Een navigatiepagina maken gaat als in de volgende deelstappen. Als je niet precies meer weet hoe je een van de deelstappen uit moet voeren, blader dan terug naar de beschrijving bij het programma dat je gebruikt.
1 2 3
Maak een nieuwe pagina en sla deze op in het web als ‘navigatie.htm’. Koppel de pagina aan de stylesheet ‘navigatie.css’, die je eerder gemaakt hebt. Typ de woorden voor de navigatie of plaats de knoppen.
tip Zet je navigatie items in een tabel, zodat ze mooi uitgelijnd zijn.
4
Sla de pagina nogmaals op.
Nu moet je de banner maken. Deze pagina komt in het bovenste frame en vormt de vaste kop van de webpagina. Een banner maken gaat als in de volgende deelstappen. 1 2 3
Maak een nieuwe pagina en sla deze op in het web als ‘banner.htm’. Koppel de pagina aan de stylesheet ‘banner.css’, die je eerder gemaakt hebt. Typ de tekst of plaats de afbeelding.
tip Als je wilt dat een afbeelding naadloos sluit tegen bovenkant en linkerkant van de browser, kun je die afbeelding als achtergrond invoeren. Zorg dan wel dat de afbeelding breed genoeg is om te voorkomen dat de afbeelding zich een aantal keer herhaald. Minimaal 800px, beter is 1600px waarvan er minimaal 800 een zinnige afbeelding vormen. 4
Sla de pagina nogmaals op.
De framespagina Wij gebruiken frames, omdat dat voor de beginnende webbouwer de eenvoudigste methode is om een goed navigerend web te bouwen. Wij gebruiken een framespagina met drie frames: - vaandel: de titelbalk van de pagina, - inhoudsopgave: de navigatie van het web - content: de inhoud van de pagina (de tekst en de afbeeldingen) 1 2 3
Open het menu ‘Nieuw’ in de workspace op de gebruikelijke manier. Klik op ‘Meer Paginasjablonen’. Klik op de tab ‘Framespagina’s’.
Het volgende tabblad verschijnt.
Figuur 6.21a
4
Indeling framespagina
Dubbelklik op ‘Vaandel en Inhoudsopgave’.
De framespagina verschijnt in de workspace. Figuur 6.22a
Framespagina leeg
5 Klik nu op de knop ‘Beginpagina instellen’ en kies de gewenste pagina uit de lijst op het venster dat verschijnt. Bovenin komt banner.htm, linksonder kies je voor navigatie.htm en rechtsonder voor de pagina die je als eerste wilt laten zien, gewoonlijk de pagina die als eerste op navigatie.htm wordt genoemd Wanneer je dit voor de drie frames gedaan hebt, zie je zoiets als in figuur 6.24a. Figuur 6.23a
De niet opgemaakte framespagina met de startbestanden
Nu moet je de eigenschappen van de framespagina instellen. 6
Klik met de rechtermuisknop in een van de frames.
7
Kies ‘Frame-eigenschappen’ in het pop-upmenu.
Het venster voor de frame-eigenschappen verschijnt.
Figuur 6.24a
8
Frame-eigenschappen
Haal het vinkje bij ‘Grootte verstelbaar in browser’ weg.
9 Zorg dat ‘Indien nodig’ is geselecteerd bij ‘Schuifbalken weergeven’. Dat voorkomt onnodige scrollbars op de webpagina. 10 Klik op de knop ‘Framespagina’. Het venster ‘Eigenschappen van pagina’ verschijnt in het framestabblad.
Figuur 6.25a
Eigenschappen van pagina
11 Haal het vinkje weg bij ‘Randen weergeven’ en zet de ruimte tussen de frames op ‘0’. 12 Klik op de OK-knop. Figuur 6.26a
De opgemaakte framespagina
13 Sla de pagina op als ‘index.htm’. Deze naam is verplicht, omdat het de pagina is waar je web mee opent. Nu de framespagina af is, moet je de links op de navigatiepagina maken. 14 Selecteer het woord dat link moet worden op de navigatiepagina en klik op de rechtermuisknop. 15 Kies ‘Hyperlink’ in het pop-upmenu. Het venster ‘Hyperlink invoegen’ verschijnt. Figuur 6.27a
Hyperlink invoegen
16 Selecteer de pagina die de link moet openen. 17 Klik op de knop ‘Doelframe’. Het venster ‘Doelframe’ verschijnt.
Figuur 6.28a
Doelframe
18 Klik op het frame waarin de pagina moet verschijnen en klik op de OK-knop. Wanneer zoals in de afbeelding (hoofd) de standaard van de pagina is, kun je op de OKknop klikken. Dan hoef je de deelstappen 16 en 17 verder niet te herhalen. 19 Herhaal de deelstappen 13, 14 en 15 voor elke link en de deelstappen 16 en 17 indien nodig. 20 Sla ‘navigatie.htm’ op. Gefeliciteerd, het web is af. Vanaf nu begint een andere taak: het web publiceren en actueel houden.