Webdesign 101 » Navigation » Grundlæggende

Grundlæggende navigation

Næstefter overførselstiden for dine websider er dit navigationssystem det, der bør optage dig mest.

Dit navigationssystem er din grænseflade til brugeren. Det er din mulighed for at gøre det let eller besværligt, spændende eller kedeligt for gæsten at finde frem til de informationer på dit websted, som gæsten har brug for.

Uanset al din snilde og eftertænksomhed er der i sidste ende kun én dommer - din bruger. Læg derfor vel mærke til, hvad han/hun siger eller skriver om dit websted.

Tilrettelæggelsen af dit navigationssystem starter allerede, når du undfanger ideen om dit websted:

Skal det omfatte mange eller få sider? mange eller få sektioner? hvor meget forudser du, det skal udvides og hvor hurtigt? hvordan gør du rigdommen af information tydelig uden at overlæsse gæsten med information i det allerførste skærmbillede? rammer eller uden rammer? + mange mange flere spørgsmål af lignende art.

Navigation på siden

Lad os tage det lette først: Navigation på den enkelte side.

Hvis et webdokument er så langt, at der skal scrolles for at læse det fra begyndelsen til slutningen, skal der i det mindste i bunden af dokumentet være et link til toppen af siden. Eksempel:

Gå til toppen af siden

Dette link ser således ud:

  <a href="navigation-1.php#toppen">
  Gå til toppen af siden
  </a>

Bemærk, at der refereres til HTML-filens navn (navigation-1.php er denne side (Du skal ikke tage dig af den "forkerte endelse"; der ku' lisså godt ha' stået .html)), hvilket strengt taget kun er nødvendigt, når der refereres til et anker (bogmærke) i en anden HTML-fil, efterfulgt af hash-tegnet # efterfulgt af ankerets navn (toppen).

Ankeret ser således ud:

<a name="toppen"></a>

Navigation mellem siderne

Et navigationssystem er i grunden ikke andet end den måde, hvorpå du præsenterer dit websteds interne referencer, altså links fra side til side.

Site map

Den simpleste måde at gøre dette på er at lave et site map, en oversigt over siderne, stillet op på en overskuelig måde.

Et eksempel på et sådant site map ser du på dette website: Webdesign 101 Site Map

Der er jo ikke noget fancy ved en sådan oversigt, tværtimod kan enhver nogenlunde kompetent websmed lave sådan én på et kvarter.

Men fordi det er let at lave, behøver det jo ikke være dårligt! Faktisk er sådan en oversigt meget god, fordi den netop giver den, der er inde i emnet (og det her er jo et websted for webkonstruktører, og ikke for akvariefiskeopdrættere eller orkidédyrkere) en idé om, hvad der er at finde på dette websted og giver mulighed for hurtigt at åbne den eller de sider, der har interesse.

Der er ikke nogen ulemper ved denne model, men den er ikke tilstrækkelig.

I det øjeblik, en side åbnes v.h.a. et link i oversigten, forsvinder denne (medmindre der åbnes et nyt browservindue, og det bør kun gøres, når det er nødvendigt) og gæsten taber derfor overblikket.

Dette overblik skal derfor helt eller delvist genskabes på den side, der åbnes.

Minioversigter i de enkelte dokumenter

Det gøres ved at indsætte menuer eller minioversigter i top og bund af de enkelte dokumenter, f.eks.

[ Generelt ] [ Design ] [ Stylesheets ] [ JavaScript ] [ Navigation ] [ DHTML ]

Denne minioversigt omfatter links til dette sites 7 sektioner.

Koden til denne ser således ud:

[ <a href="/gen/index.php">Generelt</a> ]
[ <a href="/design/index.php">Design</a> ]
[ <a href="/css/index.php">Stylesheets</a> ] 
[ <a href="/javascript/index.php">JavaScript</a> ] 
[ <a href="/navigation/index.php">Navigation</a> ] 
[ <a href="/dhtml/index.php">DHTML</a>   ] 

Nu omfatter den undersektion, vi er i, Navigation, flere sider, så det kan være nødvendigt for os at supplere den information, vi giver i navigationsbjælken, med noget information på den enkelte side.

Her sker dette gennem den logiske sti, der står lige over overskriften. Sidste led i denne svarer til sidens overskfit. Det foregående led svarer til en oversigtsside, der fortæller om hver enkelt side og/eller undersektion i sektionen Navigation på webstedet Webdesign 101.

I andre tilfælde kan du nummerere siderne og linke fra en nummerrække, der f.eks. kan se således ud:

Navigation side [ 1 ] [ 2 ] [ 3 ] [ 4 ] [ 5 ] [ 6 ] [ 7 ] [ 8 ]

Men hyppigt er det nødvendigt at være lidt mere meddelsom, som f.eks. ved at lave en menu med titlerne på undersiderne.

Der er et par sider mere om dette konkrete emne, dvs. navigationssystemer integreret i de enkelte websider. Bl.a. skal vi kigge på en noget smartere måde at lave netop det, vi har gjort på denne side: Minioversigt med JavaScript eller Sideindlejrede navigationsbjælker.

E-mail nyhedsbrev

Vælg normal præsentation

Vis siden som den ser ud i udskrift Send siden til udskrift.