Een website

Een website bestaat in het algemeen uit meerdere pagina's. We willen dat die pagina's er nagenoeg hetzelfde uitzien, dus dezelfde 'stijl' hebben. Om daarin te voorzien kunnen we in elke pagina dezelfde CSS-style definities opnemen, maar dat is onhandig. Als we iets willen veranderen aan de layout moeten we die veranderingen op iedere pagina afzonderlijk toepassen. Het is beter om dan gebruik te maken van externe CSS-style files, die dan in iedere pagina als link worden meegenomen.

Dat is hier toegepast. Deze voorbeeld-website heeft verschillende pagina's en alle pagina's hebben dezelfde opmaak. In de CSS-file mybody.css staan de algemene eigenschappen gedefinieerd.

Zoals te zien is gebruiken we een navigatiebalk om door de website te navigeren.

Navigatiebalk

Een navigatiebalk kan op verschillende plaatsen staan. Dat wordt geregeld met CSS-klassen. Omdat we voor meerdere pagina's dezelfde 'style' willen gebruiken, zijn de CSS-klassen in aparte files geplaatst. In de file mynavbar.css kunnen diverse keuzes worden gemaakt door met een editor de gewenste css-file te selecteren.

De pagina's

De pagina's van een website worden geselecteerd met 'links'. Die staan in de tekst of kunnen in een lijst staan, die dan als een soort menu fungeert.

Het is belangrijk om de website overzichtelijk te houden, d.w.z. de gebruiker moet altijd terug kunnen keren naar een vast punt. Dat zal in veel gevallen de hoofdpagine zijn (hier: Home). De navigatiebalk is dus een belangrijk item op veel pagina's.

Het is handig om bij het maken van nieuwe pagina's uit te gaan van een template en die te 'vullen' met inhoud. (Kijk eens naar deze template en keer dan hier terug.) Op deze manier bevat elke pagina dus de inhoud en de code voor de navigatiebalk.

Als we in de navigatiebalk een link willen toevoegen, moeten we dat in elke pagina doen. Het is dus zaak om, opnieuw, vooraf goed te bedenken wat er in de navigatiebalk moet staan.

We kunnen er ook voor kiezen om pagina's te maken zonder navigatiebalk (en zelfs zonder body-CSS-file) maar dan wel met een link aan het begin van de pagina om terug te keren naar een vast punt, bijvoorbeeld de inhoudspagina of de hoofdpagina. Dat wordt dan zoiets als dit.

Inhoud in kolommen

We kunnen de inhoud van een pagina in twee kolommen zetten met behulp van een tabel. De eerste kolom is dan bijvoorbeeld tekst en de tweede kolom bavat figuren, foto's of een menu met links. Hier is een voorbeeld.

Het is ook mogelijk om tekst direkt in kolommen te zetten, zoals hier te zien is.

Pagination

Soms is het handig om een pagina-selector te plaatsen waarmee naar bepaalde pagina's (nummers) gesprongen kan worden, zoals op deze pagina's te zien is.