.

.
.

[Basisheader]


(Index-)side uten rammer
Index-side med rammer


Jeg har skrevet taggene du finner i bildene med en Notisblokk-klone som viser farger på HTML-kommandoene for å lettere illustrere de forskjellige elementene. Denne heter «NoteTab Pro». Om kommandoene skrives med små eller store bokstaver har ingen praktisk betydning. De fleste HTML-editorer setter dem inn med store bokstaver.

De blå kodene inni klammer < > er HTML-kommandoene, det som står med rødt er elementene jeg setter inn i tillegg, så som bilder, farger osv. Vanlig tekst, og alt det som blir synlig i nettleseren ellers, står med svart. En hyperlink/URL vises med lilla farge.

Som du ser, så avviker start- og slutt-taggene kun med en skråstrek «/» inni klammene til slutt-taggen. Bortsett fra dette skal de ha lik kommando. Unntak er kommandoer for å sette inn e-mail, hyperlinker, bilde, lyd, horisontal linje, linjeskift og paragraf. Disse skal vi komme tilbake til siden.

Start-tagg for <HTML>, <HEAD>, <TITLE>Tittel</TITLE>, </HEAD>, og <BODY> skal alltid starte HTML-dokumentet, og slutt-tagg for </BODY> og </HTML> skal avslutte dokumentet. Innimellom de to <BODY>-taggene skal teksten og bildene dine befinne seg.

Ønsker du å laste ned maler for sider med eller uten rammer i stedet for å kopiere teksten fra figurene mine, finner du link til txt-filer nederst på denne siden. Disse to døper du om fra *.txt til *.html og gir dem de navnene du måtte ønske. Frames-fila hete index.html, den andre kan du kalle hva du vil så lenge du husker på at førstesiden din skal hete index.html. Verdiene i malene kan du bytte ut etter eget ønske.

Figur 2.

[Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp]

(Index-)side uten rammer.

Figur 1: Alle sider skal inneholde visse elementer, slik som «Figur 1» viser. Dette kan sies å være skjelettet til hjemmesiden. Titteltaggen skal vise navnet slik det viser i tittelinjen på nettleseren. Jeg har vist til at bakgrunnsfargen «BGCOLOR» er samme som hjemmesideskolens, teksten er hvit. Linker «LINK» er gule og besøkte linker «VLINK» lysegule slik som her. Definerer du ikke «LINK» og «VLINK» vises disse med standard linkfarger i nettleseren (rød for link, blå for besøkt link og lilla for aktiv link).

[Skjelettet]
Figur 1.

[Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp]

Figur 2: Nå har jeg i stedet for bakgrunnsfarge satt inn en bakgrunn som heter «bakgrunn.jpg». Bakgrunner bør være små filer, og skal være i *.jpg eller *.gif-format. Navnet på bakgrunnen, samt fargene kan du bytte ut og navngi med de filnavnene og verdiene du har valgt selv.

[Skjelettet versjon 2]
Figur 2.

[Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp]

Index-side med rammer.

Figur 3: Nedenfor står en kopi av index.html med rammer. Nettleser-vinduet blir først delt inn i to horisontale rammer, der den øverste inneholder overskriften på hjemmesiden, eller navnet om du vil. Som du ser så viser den delen av rammen til et HTML-dokument som heter «s3.htm», dette er overskriften. Denne delen oppdateres ikke, men blir stående uforandret mens du navigerer rundt på hjemmesiden.

Den nederste horisontale rammen blir så delt opp i to vertikale rammer, der den venstre er minst og inneholder menyen til hjemmesiden, f.eks. «meny.html», eller som her «s2.html». Denne oppdateres ikke, men forblir uforandret.

Den største vertikale rammen viser innholdet på de forskjellige sidene hjemmesiden består av. Etter hvert som du trykker på knappene i menyrammen ledes du til hver enkelt side oppdatert i høyre, vertikale ramme. Denne rammen kalles «main», som noe fritt kan oversettes med hovedramme.

På index-siden heter dokumentet du finner i «main»: «hoved.html». Det er altså denne siden som viser når noen kommer inn på hjemmesiden, gjerne det som på en rammeløs hjemmeside ville hett «index.html». Når du bruker rammer kan «s2.html», «s3.html» og «hoved.html» hete hva som helst.

Nederst står en melding til dem som har nettleser som ikke støtter rammer. Denne meldingen vil komme opp i nettleseren deres i stedet for hjemmesiden din. (Om du vil se hvordan denne typen rammer fungerer i praksis, kan du gå til min hjemmeside. Du finner link til denne på kontakt-siden.)

[Hovedside med rammer]
Figur 3.

[Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp] [Knapp]

Om du kopierer innholdet i enten «Figur 1» eller «Figur 2» til Notisblokk (pass på at du skriver det hele nøyaktig som det står!), så har du utgangspunktet for hjemmesidene dine, skjelettet du skal bruke til alle sidene. Skal index bestå av rammer, skal kun index-siden se ut som «Figur 3». De øvrige sidene skal se ut som «Figur 1» eller «Figur 2».

Bytt ut <TITLE>Velkommen til hjemmesideskolen</TITLE> og de røde elementene med egne verdier og eget bakgrunnsbilde. Lagre denne som mal.html eller mal.htm. Selv foretrekker jeg *.html.

Alle ting siden din skal inneholde skal altså settes inn mellom <BODY>-taggene. Dette være seg bilder, hyperlinker eller tekst. Den første <BODY>-taggen kan nok ved første øyekast virke noe forvirrende da den inneholder mye informasjon, men dette skal du ikke bry deg med. Det er den blå teksten som er selve kommandoen.

Når du har laget ferdig det som skal være førstesiden din, skal du lagre denne som index.html eller index.htm i www-mappa di. Dette er en standard du ikke kan vike fra. De øvrige sidene kan du kalle hva du vil, men unngå bruk av norske tegn (æ, ø og å). Du kan heller ikke ha mellomrom i navnene.

Førstesiden bør ikke inneholde alt for mye informasjon, kun en introduksjon som forteller hva dette er for noe. Fordel heller det du har lyst å si over flere sider, delt opp etter tema.


Laste ned maler.

Høyreklikk txt-filene for å lagre dem til disken din. Klikker du html-versjonen, kan du åpne dem her og kopiere innholdet i dem.

Standard side uten rammer, html - Last ned txt-fila.

Indexside med rammer, html - Last ned txt-fila.


Lill Berg Nordheim, 20©00