Lage nettsider

Temaperiode 3 – FLU 2.år

Eli Gjølstad - Mai 2007 [email protected]

Høgskolen i Oslo

Del 1 – Lage nettside

Høgskolen i Oslo

Hvordan lage hjemmeside?

(Prinsippene)

1. Lag en side med ønsket innhold, utseende og lenker.

2. Gjør den tilgjengelig for alle ved å legge den på en server som nettlesere har tilgang til. (= Siden lagres i en bestemt mappe).

En nettsides hovedelementer

   Tekst (Tabeller) (Grafikk) – bilder/animasjoner Lenker;  Absolutte (eksterne) lenker (=URL), f.eks til sider på andre web-servere    Relative lenker til andre sider på samme web-server Interne lenker i et dokument (=”Gå til toppen”) (Bokmerke) E-post-lenker

HTML-koder/Nettside-editor

Web-dokumenter kodes i HTML (=hypertext markup language). Internet Explorer, Firefox (eller andre nettlesere (=browsere) tolker og presenterer HTML-kodene. Vi bruker nettside-programmet NVU (står for New View, uttales N-view)  Enklere enn å skrive html-koder; har likhetstrekk med en tekstbehandler

Å lage nettsider

Html-tekstredigering kan oppleves som tekstredigering i Word, men er designet for skjermlayout, ikke papirlayout Ingen antagelser om visningsstørrelse; derfor: - Viktig å sjekke siden via nettleseren - Sjekke at lenker fungerer

Prinsippet bak hypertekstlenker

I prinsippet en kommando til nettleser, f.eks.

– ”hent, tolk, og vis en ny nettside” – ”vis annet sted på siden” – ”send epost til noen” Framgangsmåte: – marker teksten som skal bli ”klikkbar”, dvs. lenketekst. – oppgi hva som skal ligge ”under” lenken – hva skal skje etc. (I NVU gjøres dette ofte via Insert-menyen).

Lage hypertekstlenker

A) Interne lenker = Lenker til et annet sted på samme side (=bokmerke) – Lag mål for lenken først. Gi navn, f.eks. ”Toppen”.

– Marker lenketeksten, koble den til bokmerkets navn, ”Toppen” B) Relative lenker = Lenker til andre sider på eget område – Marker teksten som skal utgjøre lenken, koble til fil

Lage hypertekstlenker forts.

  C) Absolutte (eksterne) lenker =Lenker til sider på andre maskiner Forsikre deg om at du vet nøyaktig URL til nettsiden du skal lage en lenke til.

Velg Insert – Link…… D) E-post- lenker  Forsikre deg om at du vet nøyaktig epost-adresse du skal lage kobling til  Marker teksten som skal bli lenke; Velg Insert – Link – Skriv inn e-postadresse - Kryss av i ruten under ” The above is an email address ” – Klikk OK

Tekstredigering

Kjente tekstbehandlingsvalg: farge osv).

Strukturerte tekstformer (overskrift/normal osv), formateringsvalg (typestørrelser, fet/kursiv, NB : Forhåndsvis i en nettleser for å sjekke resultatene

Bilder

(Formater først bildet som du ønsker i et bildebehandlings-program) Sett inn bilde ved å koble et punkt i nettsida til en bildefil. (Insert – Image).

NB: Bildet fortsetter å være egen fil også etter at den er ”satt

inn” på nettsiden! (Et bilde kan også brukes som bakgrunn)

Hente bilde fra nettet

Prinsipp: Lagre fra nettet til eget område; gjør deretter som for andre bilder.

NB: Opphavsrett gjelder også på nettet!

Åpne en nettside som har et egnet bilde Klikk høyre musetast, Save as og lagre bildet på P://public_html

Lagring

…som vanlig, men vær ekstra nøye med: – Hvilken mappe legger du dokumentet i?

– Er filnavnet gyldig?

(Mer om dette og annet i del 2 – Publisere

nettsider)

Del 2 – Publisere nettsider på HiO-nettet

Høgskolen i Oslo

Ditt publiseringsområde

    For publisering på HiO

må

deg i HiOs filområder du kunne orientere Publiseringsområde = webserver Webserveren på HiO:

www.stud.hio.no

Alle filer som hører til nettsiden må denne webserveren.

ligge på

Hvordan koble til HiOs web-server?

    Koble til web-serveren: Start stud” "koble til www På HiO er bokstaven P: knyttet til web serveren.

På HiO fjernes koblingen til web-serveren ved utlogging NB: Alt innholdet på web-serveren (dvs. det vi på hio ser som P:\public_html) er synlig på nettet vha. en URL - selv om den kan være vanskelig for andre å finne

Hvor ligger filene?

 På HiO-nettet ses ditt web-område som mappen P:\public_html.  Her må alle filene som nettsidene dine bruker ligge!!!

Regler for filnavn

Filnavn tolkes av nettlesere på mange språk: Bruk aldri æ, ø, å, mellomrom, spesialtegn i filnavnet.

Hjemmesiden (hovedsiden) skal index.htm) og ligge på hete index.html (evt.

P:/public_html/index.html

Hvilken URL har siden min?

Adressen (URL) til nettsiden index.htm eller index.html: http://www.stud.hio.no/~s Adressen til annet på public_html følger mønsteret: www.stud.hio.no/~s/(mappe/undermappe/)filnavn (NB: Filnavn inkluderer ”etternavnet”)

www.stud.hio.no/~s1234567/side2.html

Sjekke at alt fungerer

  Filnavnet index.html må bokstaver være med små Sjekk alle lenker etter at filene er kopiert over på web-serveren. NB: Sjekk at nettlesers adressevindu viser URL! (ikke intern filbane)

Unngå vanlige problemer

    Det skal være en fil som heter index.html (ikke en mappe). (Filen skal ikke hete indeks!!!) Filen index.html må eksistere for at nettstedet ditt skal bli registrert i HiOs liste over studenter på studentnettet med hjemmeside.

Web-serveren skiller mellom store og små bokstaver.

Ikke bruk æ, ø, å, mellomrom eller spesialtegn i filer som skal ligge på web-serveren!

Oppsummering; en nettside på P-området ditt kan inneholde:

 Intern lenke (bokmerke)   Bilde Ekstern lenke Les mer om HiO her Send meg en e-post!

  E-post-lenke (Relativ lenke*) Relativ lenke krever at du lager en side til (side 2) eller at du har et dokument på P: som du lager en peker til.

Gå til toppen

Del 3 – Tillegg; Kildekritikk

Høgskolen i Oslo

Nettressurser - kildekritikk

 

På Internett kan hvem som helst publisere nær sagt hva som helst

– Side om side finnes: Vitenskapelig stoff, reklame, personlige meningsytringer og propaganda.

Hovedregelen: Ha alltid en kritisk holdning til den informasjonen du finner på nettet.

– Stemmer for eksempel informasjonen du har kommet over med det du vet fra før om emnet? Sjekk mot andre steder på nettet, leksikon, aviser, etc. Kort sagt, still spørsmål og tenk selv!

Sjekk nettstedets troverdighet:

     Bruk emnekataloger som utgangspunkt for søket. Undersøk flere kilder Når ble nettsiden sist oppdatert?

Hvem er forfatter (sjekk domenenavn)? Kan man nå nettstedets ansvarlige via e-post?

Hvem står bak nettstedet? Hvorfor er siden laget? Er siden privat eller offentlig? Vurdere adressen/URL via: – Whois-tjenesten for norske nettsteder – Check domain for internasjonale nettsteder http://www.checkdomain.com

( http://www.whois.org

Kommersielle versus reklamefrie ressurser

   Fører lenkene deg dit du skal? Sier de tydelig hvor du havner?

Er lenkene relevante ressurssider for elevene/barna?

Er det mye reklame på sidene barna kommer til?

Opplegg videre

 Dataundervisning med påmelding – Påmeldingsfrist: Fredag 18. mai Lister henges opp i vestibylen i 2.etg.   Se forelesningsplanen for å finne opplegget for datalab. – Gå inn via forelesningsplanen i Fronter  Se for øvrig studiehåndboka side 78 vedr. krav til nettside  Nettsiden skal lenkes opp i Fronter – egen brukerveiledning for dette vil bli lagt ut