Intern side: Dataressurser | Andre fysikk-institutsjoner | E-print-arkiver | Information om WWW

Hvordan lage en webside

Å lage en webside er lettere enn du tror! Hvis du vil, kan du bruke f.eks. Netscape til å redigere websider i "WYSIWYG" (What-You-See-Is-What-You-Get) modus, dvs. at du redigerer siden slik den vil se ut i nettleseren. For å bruke denne funksjonen, velg "New -> Blank Page" i Netscapes meny.

Imidlertid er det anbefalt å skrive HTML-koden manuelt i de fleste tilfeller. Dette vil både være raskere og gi et bedre resultat for sider som består hovedsaklig av tekst. Å lære seg HTML er ingen kunst! Les videre for alt du trenger å kunne for å lage dine egne websider:

Her er et eksempel på et minimalt HTML-dokument. Kopier teksten over i en teksteditor (f.eks. Emacs for unix-brukere, wordpad/notepad for Windows.) og lagre den som "www_docs/index.html" på ditt hjemmeområde ("M:\www_docs\index.html" for Windows-brukere). Du må lage mappen www_docs først hvis den ikke allerede eksisterer. Forklaring på alt som står i fet skrift kommer under.

<HTML>

<HEAD>
  <TITLE>Tittel på siden din</TITLE>
</HEAD>

<BODY>

<A HREF="http://www.fys.uio.no/">Fysisk institutt</A> -
<A HREF="http://www.fys.uio.no/teori/">Teoretisk fysikk</A>

<H1>Overskrift</H1>

Her kan du skrive det du vil. For eksempel en kort tekst om deg selv.
<P>
Dette er neste avsnitt. Du kan også legge inn bilder: 
<IMG SRC="/images/uiologo_small.gif">


</BODY>
</HTML>

Siden du har laget blir tilgjengelig på nettet med adresse http://www.fys.uio.no/~brukernavn/index.html - der brukernavnet er brukernavnet du bruker for å logge deg inn. (Dersom du får beskjed om at siden ikke er tilgjengelig, må du bruke unix-kommandoene "chmod go+rx www_docs" og "chmod go+r www_docs/index.html" for å gi alle tilgang til siden.)

Forklaring

Det første du kan legge merke til er:

• Alle HTML-kommandoer står mellom < og >.
• De fleste HTML-kommandoer starter med <kommando> og avsluttes med </kommando>.

Her kommer en oversikt over kommandoene brukt i teksten over:

• <HTML>(Hele dokumentet kommer her)</HTML>
  Hele HTML-dokumentet ditt "rammes inn" i en <HTML>-kommando. Denne skal alltid være med.
• <HEAD>(Spesielle kommandoer)</HEAD>
  En del spesielle kommandoer rammes inn i en <HEAD>-blokk. Litt mer om dette kommer nedenfor, her tar jeg bare med den viktigste kommandoen som kan stå mellom <HEAD> og </HEAD>:
• <TITLE>(Tittel)</TITLE>
  Tittelen på siden din, som vises i rammen rundt nettleser-vinduet, skriver du inn her.
• <BODY>(Selve brødteksten til siden)</BODY>
  Det viktigste i dokumentet ditt, "brødteksten" står i "BODY"-blokken.
• <A HREF="(link)">(tekst)</A>
  Teksten mellom <A> og </A>-kommandoene blir til en link til en annen side. Linken skriver du inn som et "argument" til <A>-kommandoen kalt "HREF".
• <H1>(Overskrift)</H1>
  <H1>, <H2>, <H3> osv. brukes til å lage (mindre og mindre) overskrifter.
• <P>
  Kommandoen <P> starter et nytt avsnitt.
• <IMG SRC="(link)">
  Du kan legge inn bilder i teksten ved hjelp av <IMG>-kommandoen. Argumentet "SRC" er en link til bildet, eller filnavnet.

Oversikt over alle HTML-kommandoer definert i standarden HTML 3.2, finner du på en nyttig side hos htmlhelp.com.

Grafisk profil etc.

Alle offisielle universitetssider skal bruke universitetes "grafiske profil". Dette kan du få ved å legge inn spesielle "meta"-kommandoer i <HEAD>-blokken i dokumentet. Resultatet er at nettsiden får den velkjente profilen med universitetslogo osv.

NB: Grafisk profil får du ikke på personlige hjemmesider under "www_docs". Dette virker bare på instituttsider (f.eks. kurssidene), som kan finnes/lagres under "/websider" på Fysisk institutt.

Alle "meta"-kommandoene har strukturen

• <META name="(kommando)" content="(verdi)">

Her er noen ting du setter inn for "kommando" og "verdi":

Kommando	Verdi
redaksjon.navn	Ditt navn
redaksjon.epost	Din epost-adresse
spraak	Språkkode, vanligvis no-bok (bokmål) eller en (engelsk).
enhet.id	For oss skal denne være fys
dato.opprettet	Dato dokumentet er opprettet - på formatet år-måned-dag. (f.eks. 2002-02-20)
dato.verifisert	Dato dokumentet er "verifisert"
dato.endret	Dato dokumentet sist ble endret

Eksempel på hele <HEAD>-blokken for dette dokumentet:

<HEAD>
        <TITLE>Lage websider, Teoretisk Fysikk, UiO</TITLE>

        <META name="redaksjon.navn" content="Håkon Enger">
        <META name="redaksjon.epost" content="hakon.enger@fys.uio.no">
        <META name="tema" content="it">
        <META name="spraak" content="no-bok">
        <META name="enhet.id" content="fys">
        <META name="dato.opprettet" content="2002-02-21">
</HEAD>

Mer informasjon

• A Beginners Guide to HTML
• Overview of all HTML elements
• W3C Home page