Høgskolen i Oslo Lage nettsider Temaperiode 3 – FLU 2.år Eli Gjølstad - Mai 2007

Presentasjon om: "Høgskolen i Oslo Lage nettsider Temaperiode 3 – FLU 2.år Eli Gjølstad - Mai 2007"— Utskrift av presentasjonen:

1 Høgskolen i Oslo Lage nettsider Temaperiode 3 – FLU 2.år Eli Gjølstad - Mai 2007 eli.gjolstad@lu.hio.no

2 Høgskolen i Oslo Del 1 – Lage nettside

3 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).

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

5 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) l Enklere enn å skrive html-koder; har likhetstrekk med en tekstbehandler

6 Å 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

7 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).

8 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

9 Lage hypertekstlenker forts. C) Absolutte (eksterne) lenker=Lenker til sider på andre maskiner l Forsikre deg om at du vet nøyaktig URL til nettsiden du skal lage en lenke til. l Velg Insert – Link…… D) E-post- lenker l Forsikre deg om at du vet nøyaktig epost-adresse du skal lage kobling til l 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

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

11 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)

12 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

13 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)

14 Høgskolen i Oslo Del 2 – Publisere nettsider på HiO-nettet

15 Ditt publiseringsområde l For publisering på HiO må du kunne orientere deg i HiOs filområder l Publiseringsområde = webserver Webserveren på HiO: www.stud.hio.no l Alle filer som hører til nettsiden må ligge på denne webserveren.

16 Hvordan koble til HiOs web-server? l Koble til web-serveren: Start - "koble til www stud” l På HiO er bokstaven P: knyttet til web- serveren. l På HiO fjernes koblingen til web-serveren ved utlogging l 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

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

18 Regler for filnavn Filnavn tolkes av nettlesere på mange språk: Bruk aldri æ, ø, å, mellomrom, spesialtegn i filnavnet. Hjemmesiden (hovedsiden) skal hete index.html (evt. index.htm) og ligge på P:/public_html/index.html

19 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

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

21 Unngå vanlige problemer l Det skal være en fil som heter index.html (ikke en mappe). (Filen skal ikke hete indeks!!!) l Filen index.html må eksistere for at nettstedet ditt skal bli registrert i HiOs liste over studenter på studentnettet med hjemmeside. l Web-serveren skiller mellom store og små bokstaver. l Ikke bruk æ, ø, å, mellomrom eller spesialtegn i filer som skal ligge på web-serveren!

22 Oppsummering; en nettside på P-området ditt kan inneholde: l Intern lenke (bokmerke) l Bilde l Ekstern lenke l E-post-lenke l (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 Send meg en e-post! Les mer om HiO her

23

24 Høgskolen i Oslo Del 3 – Tillegg; Kildekritikk

25 Nettressurser - kildekritikk l På Internett kan hvem som helst publisere nær sagt hva som helst –Side om side finnes: Vitenskapelig stoff, reklame, personlige meningsytringer og propaganda. l 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!

26 Sjekk nettstedets troverdighet: l Bruk emnekataloger som utgangspunkt for søket. Undersøk flere kilder l Når ble nettsiden sist oppdatert? l Hvem er forfatter (sjekk domenenavn)? Kan man nå nettstedets ansvarlige via e-post? l Hvem står bak nettstedet? Hvorfor er siden laget? Er siden privat eller offentlig? l Vurdere adressen/URL via: –Whois-tjenesten for norske nettsteder –Check domain for internasjonale nettsteder http://www.checkdomain.com (http://www.whois.org http://www.checkdomain.comhttp://www.whois.org

27 Kommersielle versus reklamefrie ressurser l Fører lenkene deg dit du skal? Sier de tydelig hvor du havner? l Er lenkene relevante ressurssider for elevene/barna? l Er det mye reklame på sidene barna kommer til?

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