websidene

Arbeidet med de nåværende Internett-sidene til Kragerø videregående skole ble startet sommeren 2001 av Arvid Henriksen, assistert av mange bidragsytere, særlig som fotografer. En slik Internett-presentasjon skal nå folk utenfor denne skolen: framtidige elever, foreldre, andre lærere - og andre interesserte for den saks skyld. Dessuten skal Internett-sidene kunne brukes i den interne informasjonen ved skolen, i forhold til både elever, lærere og andre ansatte, og noen av sidene er også laget for å kunne brukes i undervisningen.
Internett-sider er normalt i HTML-format (HyperText Mark-up Language). Det fins verktøy for å lage HTML-filer for de som ikke kan HTML-koding: Frontpage, GoLive, Dreamweaver osv., til og med skrive i Word og lagre som HTML-dokument. Skriv koden til høyre i f.eks. Notisblokk (Notepad), pass på å lagre den som HTML-fil og åpne den i f.eks. Internet Explorer. Resultatet bør være "Dette er en test!" med blå skrift på gul bakgrunn. (For ordens skyld bør det sies at små eller store bokstaver ikke spiller noen rolle i HTML.)

Fargesystemet for skjermgjengivelse, både for PC og TV, tar utgangspunkt i verdiene for mengden av rød, grønn og blå (RGB-systemet). Standardverdiene for tekst er sort, for bakgrunn hvit, og de som er fornøyd med det, trenger ikke spesifisere fargene. For de andre er det 16.777.216 (256x256x256) å velge mellom! De to første sifrene står for rød, de to neste for grønn og de to siste for blå. 00 er laveste verdi, FF den høyeste: 00, 01, 02, 03, 04, 05, 06, 07, 08, 09, 0A, 0B, 0C, 0D, 0E, 0F, 10, 11 osv. Studer systemet, så skjønner du hvordan det virker. Andre rad, gul-azur-lilla, representerer et annet fargesystem (CMY: cyan-magenta-yellow), som blant annet fins i blekkpatronene (kassettene) på skriveren. Vil du prøve å skremme bort eventuelle lesere, skal du prøve grønn skrift på rød bakgrunn (eller omvendt)!

En fordel (eller ulempe?) med HTML-koding er at alle kan se kildekoden. Slik er det selvfølgelig også med http://www.kragero.vgs.no, men så mye klokere blir en kanskje ikke. Kildekoden til en fil som heter "index.html" forteller at dokumentet er sammensatt av to filer, "innhold.html", den faste menyen til venstre, og "info.asp" til høyre (alt som har blå bakgrunn, men det forteller ikke denne koden noe om). Videre er det mulig å se at "info.asp" ligger på en egen mappe, "db". Som sagt vil "innhold.html" alltid vises, mens "info.asp" vil byttes ut med andre filer - avhengig av hvilke lenker vi klikker på. Merk kodeord som "noresize" og scrolling="no". De hindrer at det uestetiske rullefeltet dukker opp mellom menyen til vestre og resten av innholdet på skjermen. Det forutsetter selvfølgelig at det ikke fins noe informasjon (noe som her vil si lenker) som så langt nede at det skjules for for en bruker med liten skjerm og lav oppløsning. Fylkets grafiske profil passer godt som bakgrunn for å skape inntrykk av at det er et slags innhold også under lenkene.
Fylkets grafiske profil fungerer også bra ved at fargen skal gi assosiasjoner til skolens teglsteinbygning (selv om det nok er lett å se forskjell). Opprinnelig hadde hovedmenyen en imitasjon av en murvegg i ulike røde nyanser som bakgrunn. Fylkets grafiske profil er også bakgrunn i aktive undermenyer. Bagrunnsfargen på de andre sidene er i hovedsak lys blå (med litt azur eller cyan), noe som ikke var et tilfeldig valg. Det er en fin kontrast til rød meny, samtidig som Kragerø preges av blå himmel og blått hav. Blåfargen passer derfor som bakgrunnsfarge for de mange bildene fra aktiviter utendørs, og i tillegg som bakgrunnsfarge for mørk blå skrift, som er standard. Og selvfølgelig er oppslagstavla mørk grønn - som de gamle krittavlene!

For å organisere innholdet er det vanlig å bruke tabeller, for plassering av både tekst og bilder. Det kan f.eks. være tekst i cellene til venstre og bilder i cellene til høyre - eller omvendt. En annen mulighet er å selvfølgelig å plassere teksten under bildene, i samme celle eller i egne celler. Illustrasjonen til høyre viser et enkelt HTML-dokument med fire bilder, og plasseringen går fram av den ledsagende bildeteksten under hvert bilde. Koden "br" betyr ikke overraskende "break". Alle bildene må her ligge lagret på en mappe som heter "images". Navnet på bildene er selvfølgelig "bilde1.jpg", "bilde2.jpg" osv., der "jpg" er et vanlig format for bilder, særlig fotografier som er behandlet og komprimert for Internett. Nederst under bildene (og tabellen) ligger det en lenke til et HTML-dokument "flerebilder.html", der teksten "Flere bilder" fungerer som synlig lenke. Bakgrunnsfargen "#99CCFF" er den samme son den vanlige bakgrunnsfargen på KVS' hjemmeside. Skriftfargen "#000066" er også standard for hjemmesida, mørk blå. Bildetekstene blir derimot sorte siden fargen ikke er spesifisert. Selvfølgelig er denne presentasjonen laget ved bruk av tabeller...
Et godt tips når det gjelder bilder, er at de som ligger under hverandre, bør ha identisk bredde. Ellers ser det lett noe rotete ut. Hvis bilder ligger ved siden av hverandre, bør de følgelig også ha samme høyde. Det er for øvrig best å bestemme størrelsen i bildebehandlingsprogrammet og la være å angi størrelsen i HTML-koden. I en tidligere fase av Internett-alderen var det svært viktig å passe på filstørrelsen, slik at det ikke tok for lang tid for brukeren å laste ned en side. Fortsatt bør en imidlertid ha dette i bakhodet. Det er ikke alle som har like gode nettressurser og like god kapasitet på datautstyret. Pass for all del på å beholde riktig forhold mellom bredde og høyde på bildet, uansett om størrelsen fastsettes i bildebehandlingsprogrammet eller i HTML-koden! Ellers kan det bli mange rare bilder - og ikke minst mange rare mennesker på bildene...
"Stumtjeneren" på menyen til venstre er faktisk laget ved hjelp av tabeller. Her er HTML-kode kombinert med CSS (cascading style sheets), en metode for å bestemme utseendet på Internett-dokumenter helt nøyaktig. Det fungerer her slik at det kan være rammer rundt tabellceller eller ikke, over, under, til høyre eller til venstre. Dessuten kan utseendet på på eventuelle rammer (eller grenser) bestemmes. Da gjelder det å sette det hele sammen med hensyn til rammer eller ikke rammer, slik at ser ut som en ønsker det. Noen grafiske elementer er plassert inne i tabellcellene, og disse fungerer som lenker, bl.a. øksa, fylkesvåpenet, som naturligvis er lenket til Telemark fylkes hjemmeside.
Helt til høyre er strekene mellom "nyhetssakene" definert som "dashed", og de forsvinner gradvis mot høyre fordi bakgrunnen dannes av en grafisk fil som går gradvis over fra lys blå til hvit.

Datateknologi og programmering hører sammen, og på Internett er det slik at en programkode kan kjøres på brukerens PC når dokumentet lastes ned, eller på serveren der dokumentet ligger lagret (og bare resultatet lastes ned). Felles for begge systemer er at programkoden i regelen skrives i en programkode som i større eller mindre grad er mulig å forstå. I tradisjonelle dataspråk er det derimot slik at den skrevne programkoden først må gjøres om til en maskinkode (som er komplett umulig å forstå for vanlige mennesker) før programmet kan kjøres. For Internett foregår dette som én prosess, uten at brukeren legger merke til det, noe som gjør det enklere også for programmereren.
Programkoder som kjøres på brukerens PC, er gjerne laget i JavaScript. Til høyre er det et eksempel på dette. Det er deler av den programkoden som gjør at tidspunktet med ukedag, dato og klokkeslett dukker opp i en rulletekst når KVS' hjemmeside åpnes. Det illustrerer jo også hvor enkelt det er å endre de norske til engelske, tyske, franske og spanske navn på dagene i uka, og resultatet vises lett når en klikker på ulike flagg på "stumtjeneren". JavaScript er integrert i HTML-koden og må ikke forveksles med det generelle programmeringsspråket Java (men selve programkoden kan på mange måter se nokså lik ut). Legg for øvrig merke til at det er tidspunktet på egen PC som gjelder, og dette tidspunktet endres ikke før en selv klikker og oppdaterer det.
JavaScript er også en grei løsning for pedagogiske oppgaver som øvinger i tysk grammatikk, historiske quiz osv. Ulempen er da selvfølgelig at det er mulig å "jukse" ved å gå inn i programkoden for å finne det rette svaret...

For å programmere webtjeneren er det vanlig å bruke f.eks. JSP (også en slags Java-variant), PHP og ASP. ASP står for Active Server Pages og er en blanding av HTML, det generelle programmeringsspråket Visual Basic og databasespråket SQL (Structured Quary Language). Koden til høyre viser eksempler på alt dette - i tillegg til at CSS er lagt inn i HTML ("style" osv.). "Do While Not" og "Loop" er typiske datakoder og viser at dette er en såkalt løkke. Den kjøres til den har kommet til slutten av fila ("EOF": End of FIle), og det som hentes ut her, stammer fra en database. I dette tilfellet er det "nyhetssakene" til høyre på KVS' hjemmeside. Hver av disse sakene har en dato (objR("Dato")), en tekst som forteller hva saken gjelder (objR("Melding")) osv., og alt annet kan mer eller mindre gjenkjennes som HTML-koder som forteller hvordan alt dette skal presenteres, f.eks. datoen med kursiv ("i" for "italics"). Denne datakoden kan ikke leses av brukeren, bare HTML-koden som viser resultatet av kjøringen: datoer, meldinger osv. og hvordan de presenteres.
Mye av informasjonen på hjemmesida er organisert og presentert på samme måte: f.eks. meldingene på oppslagstavla, prøver osv. i aktivitetsplanene, boklistene og innleggene i gjesteboka.

Arbeidet med de nåværende Internett-sidene til Kragerø videregående skole ble startet sommeren 2001 av Arvid Henriksen, assistert av mange bidragsytere, særlig som fotografer. En slik Internett-presentasjon skal nå folk utenfor denne skolen: framtidige elever, foreldre, andre lærere - og andre interesserte for den saks skyld. Dessuten skal Internett-sidene kunne brukes i den interne informasjonen ved skolen, i forhold til både elever, lærere og andre ansatte, og noen av sidene er også laget for å kunne brukes i undervisningen. Internett-sider er normalt i HTML-format (HyperText Mark-up Language). Det fins verktøy for å lage HTML-filer for de som ikke kan HTML-koding: Frontpage, GoLive, Dreamweaver osv., til og med skrive i Word og lagre som HTML-dokument. Skriv koden til høyre i f.eks. Notisblokk (Notepad), pass på å lagre den som HTML-fil og åpne den i f.eks. Internet Explorer. Resultatet bør være "Dette er en test!" med blå skrift på gul bakgrunn. (For ordens skyld bør det sies at små eller store bokstaver ikke spiller noen rolle i HTML.)
Fargesystemet for skjermgjengivelse, både for PC og TV, tar utgangspunkt i verdiene for mengden av rød, grønn og blå (RGB-systemet). Standardverdiene for tekst er sort, for bakgrunn hvit, og de som er fornøyd med det, trenger ikke spesifisere fargene. For de andre er det 16.777.216 (256x256x256) å velge mellom! De to første sifrene står for rød, de to neste for grønn og de to siste for blå. 00 er laveste verdi, FF den høyeste: 00, 01, 02, 03, 04, 05, 06, 07, 08, 09, 0A, 0B, 0C, 0D, 0E, 0F, 10, 11 osv. Studer systemet, så skjønner du hvordan det virker. Andre rad, gul-azur-lilla, representerer et annet fargesystem (CMY: cyan-magenta-yellow), som blant annet fins i blekkpatronene (kassettene) på skriveren. Vil du prøve å skremme bort eventuelle lesere, skal du prøve grønn skrift på rød bakgrunn (eller omvendt)!
En fordel (eller ulempe?) med HTML-koding er at alle kan se kildekoden. Slik er det selvfølgelig også med http://www.kragero.vgs.no, men så mye klokere blir en kanskje ikke. Kildekoden til en fil som heter "index.html" forteller at dokumentet er sammensatt av to filer, "innhold.html", den faste menyen til venstre, og "info.asp" til høyre (alt som har blå bakgrunn, men det forteller ikke denne koden noe om). Videre er det mulig å se at "info.asp" ligger på en egen mappe, "db". Som sagt vil "innhold.html" alltid vises, mens "info.asp" vil byttes ut med andre filer - avhengig av hvilke lenker vi klikker på. Merk kodeord som "noresize" og scrolling="no". De hindrer at det uestetiske rullefeltet dukker opp mellom menyen til vestre og resten av innholdet på skjermen. Det forutsetter selvfølgelig at det ikke fins noe informasjon (noe som her vil si lenker) som så langt nede at det skjules for for en bruker med liten skjerm og lav oppløsning. Fylkets grafiske profil passer godt som bakgrunn for å skape inntrykk av at det er et slags innhold også under lenkene. Fylkets grafiske profil fungerer også bra ved at fargen skal gi assosiasjoner til skolens teglsteinbygning (selv om det nok er lett å se forskjell). Opprinnelig hadde hovedmenyen en imitasjon av en murvegg i ulike røde nyanser som bakgrunn. Fylkets grafiske profil er også bakgrunn i aktive undermenyer. Bagrunnsfargen på de andre sidene er i hovedsak lys blå (med litt azur eller cyan), noe som ikke var et tilfeldig valg. Det er en fin kontrast til rød meny, samtidig som Kragerø preges av blå himmel og blått hav. Blåfargen passer derfor som bakgrunnsfarge for de mange bildene fra aktiviter utendørs, og i tillegg som bakgrunnsfarge for mørk blå skrift, som er standard. Og selvfølgelig er oppslagstavla mørk grønn - som de gamle krittavlene!
For å organisere innholdet er det vanlig å bruke tabeller, for plassering av både tekst og bilder. Det kan f.eks. være tekst i cellene til venstre og bilder i cellene til høyre - eller omvendt. En annen mulighet er å selvfølgelig å plassere teksten under bildene, i samme celle eller i egne celler. Illustrasjonen til høyre viser et enkelt HTML-dokument med fire bilder, og plasseringen går fram av den ledsagende bildeteksten under hvert bilde. Koden "br" betyr ikke overraskende "break". Alle bildene må her ligge lagret på en mappe som heter "images". Navnet på bildene er selvfølgelig "bilde1.jpg", "bilde2.jpg" osv., der "jpg" er et vanlig format for bilder, særlig fotografier som er behandlet og komprimert for Internett. Nederst under bildene (og tabellen) ligger det en lenke til et HTML-dokument "flerebilder.html", der teksten "Flere bilder" fungerer som synlig lenke. Bakgrunnsfargen "#99CCFF" er den samme son den vanlige bakgrunnsfargen på KVS' hjemmeside. Skriftfargen "#000066" er også standard for hjemmesida, mørk blå. Bildetekstene blir derimot sorte siden fargen ikke er spesifisert. Selvfølgelig er denne presentasjonen laget ved bruk av tabeller... Et godt tips når det gjelder bilder, er at de som ligger under hverandre, bør ha identisk bredde. Ellers ser det lett noe rotete ut. Hvis bilder ligger ved siden av hverandre, bør de følgelig også ha samme høyde. Det er for øvrig best å bestemme størrelsen i bildebehandlingsprogrammet og la være å angi størrelsen i HTML-koden. I en tidligere fase av Internett-alderen var det svært viktig å passe på filstørrelsen, slik at det ikke tok for lang tid for brukeren å laste ned en side. Fortsatt bør en imidlertid ha dette i bakhodet. Det er ikke alle som har like gode nettressurser og like god kapasitet på datautstyret. Pass for all del på å beholde riktig forhold mellom bredde og høyde på bildet, uansett om størrelsen fastsettes i bildebehandlingsprogrammet eller i HTML-koden! Ellers kan det bli mange rare bilder - og ikke minst mange rare mennesker på bildene... "Stumtjeneren" på menyen til venstre er faktisk laget ved hjelp av tabeller. Her er HTML-kode kombinert med CSS (cascading style sheets), en metode for å bestemme utseendet på Internett-dokumenter helt nøyaktig. Det fungerer her slik at det kan være rammer rundt tabellceller eller ikke, over, under, til høyre eller til venstre. Dessuten kan utseendet på på eventuelle rammer (eller grenser) bestemmes. Da gjelder det å sette det hele sammen med hensyn til rammer eller ikke rammer, slik at ser ut som en ønsker det. Noen grafiske elementer er plassert inne i tabellcellene, og disse fungerer som lenker, bl.a. øksa, fylkesvåpenet, som naturligvis er lenket til Telemark fylkes hjemmeside. Helt til høyre er strekene mellom "nyhetssakene" definert som "dashed", og de forsvinner gradvis mot høyre fordi bakgrunnen dannes av en grafisk fil som går gradvis over fra lys blå til hvit.
Datateknologi og programmering hører sammen, og på Internett er det slik at en programkode kan kjøres på brukerens PC når dokumentet lastes ned, eller på serveren der dokumentet ligger lagret (og bare resultatet lastes ned). Felles for begge systemer er at programkoden i regelen skrives i en programkode som i større eller mindre grad er mulig å forstå. I tradisjonelle dataspråk er det derimot slik at den skrevne programkoden først må gjøres om til en maskinkode (som er komplett umulig å forstå for vanlige mennesker) før programmet kan kjøres. For Internett foregår dette som én prosess, uten at brukeren legger merke til det, noe som gjør det enklere også for programmereren. Programkoder som kjøres på brukerens PC, er gjerne laget i JavaScript. Til høyre er det et eksempel på dette. Det er deler av den programkoden som gjør at tidspunktet med ukedag, dato og klokkeslett dukker opp i en rulletekst når KVS' hjemmeside åpnes. Det illustrerer jo også hvor enkelt det er å endre de norske til engelske, tyske, franske og spanske navn på dagene i uka, og resultatet vises lett når en klikker på ulike flagg på "stumtjeneren". JavaScript er integrert i HTML-koden og må ikke forveksles med det generelle programmeringsspråket Java (men selve programkoden kan på mange måter se nokså lik ut). Legg for øvrig merke til at det er tidspunktet på egen PC som gjelder, og dette tidspunktet endres ikke før en selv klikker og oppdaterer det. JavaScript er også en grei løsning for pedagogiske oppgaver som øvinger i tysk grammatikk, historiske quiz osv. Ulempen er da selvfølgelig at det er mulig å "jukse" ved å gå inn i programkoden for å finne det rette svaret...
For å programmere webtjeneren er det vanlig å bruke f.eks. JSP (også en slags Java-variant), PHP og ASP. ASP står for Active Server Pages og er en blanding av HTML, det generelle programmeringsspråket Visual Basic og databasespråket SQL (Structured Quary Language). Koden til høyre viser eksempler på alt dette - i tillegg til at CSS er lagt inn i HTML ("style" osv.). "Do While Not" og "Loop" er typiske datakoder og viser at dette er en såkalt løkke. Den kjøres til den har kommet til slutten av fila ("EOF": End of FIle), og det som hentes ut her, stammer fra en database. I dette tilfellet er det "nyhetssakene" til høyre på KVS' hjemmeside. Hver av disse sakene har en dato (objR("Dato")), en tekst som forteller hva saken gjelder (objR("Melding")) osv., og alt annet kan mer eller mindre gjenkjennes som HTML-koder som forteller hvordan alt dette skal presenteres, f.eks. datoen med kursiv ("i" for "italics"). Denne datakoden kan ikke leses av brukeren, bare HTML-koden som viser resultatet av kjøringen: datoer, meldinger osv. og hvordan de presenteres. Mye av informasjonen på hjemmesida er organisert og presentert på samme måte: f.eks. meldingene på oppslagstavla, prøver osv. i aktivitetsplanene, boklistene og innleggene i gjesteboka.