STUDIEMATERIAL. Webbpublicering. Ingrid Hallman, Merja Pikkuaho. Mars Folkbildningsnätets Pedagogiska resurser

Transkript

1 STUDIEMATERIAL Webbpublicering Ingrid Hallman, Merja Pikkuaho Mars 2001 Folkbildningsnätets Pedagogiska resurser Folkbildningsrådet, Box 730, Stockholm, Sweden. Det material som finns att hämta på denna webbplats får användas i undervisning och i studiegrupper av lärare, cirkelledare och andra inom folkhögskolor och studieförbund. Därutöver får materialet endast användas för enskilt bruk.

2 Innehållsförteckning 1. INLEDNING KURSUPPLÄGGNING FÖRKUNSKAPER KURSMÅL WEBBPUBLICERING - EN PEDAGOGISK MÖJLIGHET INTERNATIONALISERING - PROJEKT MELLAN SKOLORNA...5 TEORIDEL 2. INTERNET FOLKBILDNINGSNÄTET WWW WORLD WIDE WEB VAD ÄR EN WEBBSERVER? HTML HYPERTEXT MARKUP LANGUAGE DATORNS HÅRD- OCH MJUKVARA DATORNS HÅRDVARA DATORNS MJUKVARA DATASÄKERHET OCH SEKRETESS SKAPA DOKUMENT FÖR WEBBEN UPPHOVSRÄTTEN BILDER FÖR WEBBEN ATT FÅ IN BILDER I DATORN EN DIGITAL BILDS UPPBYGGNAD BILDUPPLÖSNINGEN BILDSTORLEK BILDSKÄRMENS UPPLÖSNING BILDFORMAT PÅ WEBBEN FÄRGER LÄGGA IN BILDER PÅ WEBBSIDAN GRUNDTIPS FÖR LAY-OUT PÅ EN WEBBSIDA STRUKTUR PÅ DIN WEBBPLATS EXEMPEL PÅ OLIKA STRUKTURER HÅLL ORDNING PÅ DINA FILER ARBETSGÅNG VID WEBBSIDESTILLVERKNING LÄNKNING ENHETLIGHET...22 PRAKTISKA ÖVNINGAR 10. GÖR DIN EGEN HEMSIDA VIA ANTECKNINGAR (WINDOWS) PUBLICERA DIN EGEN HEMSIDA PÅ FOLKBILDNINGSNÄTET ATT ANVÄNDA WORD 97 SOM WEBB-EDITOR...29

3 1. Inledning Detta kursmaterial ingår i Folkbildningsrådets (FBR) IT-projekt "Särskilda fortbildningsinsatser i IT-stött lärande för folkhögskolelärare". Kursdokumentet och kursplanen har utarbetats av Ingrid Hallman och Merja Pikkuaho. Erik Söderlund har bidragit med kapitel 3-5. Projektledare har varit Jens Bylund. Vi som har jobbat med kursen tycker att publicering på webben är en bra metod för en aktiv IT-användning för både lärare och elever. Hur man använder det skiljer sig från skola till skola och inom skolan mellan olika kurser. Men det öppnar nya möjligheter att dela med sig av kunskap mellan linjer, skolor och länder. Kursen är avsedd att användas på folkhögskolor. Den har ambitionen att ge en grund att stå på för alla lärare som vill använda webbpublicering som ett pedagogiskt instrument. Den kan givetvis användas i undervisningen för att ge elever samma möjlighet. Vi hoppas att kursen ska fungera som inspiration att sätta igång 1.1 Kursuppläggning Kursmaterialet ger en teoretisk grund för att ta de första stegen i att publicera text och bild på nätet. I teoridelen förklaras de basbegrepp som behövs för att förstå hur webben och webbpublicering fungerar. Vi har försökt att hålla de teoretiska avsnitten så korta som möjligt. Du får många litteratur- och länktips för att gå vidare efter kursen. Avsnittet praktiska övningar betår av enkla övningar där du tränar olika sätt att göra en hemsida. Kursen är tänkt som en grundkurs för att komma igång att publicera sidor som läggs ut på nätet. Alla delar av materialet kanske inte hinns med under en kurs, men det kan användas som uppslagsdel när du efter kursen försöker på egen hand. Det viktiga är att komma igång och upptäcka att det inte är speciellt krångligt eller svårt utan roligt och pedagogiskt användbart att producera egna webbsidor. Testkursens längd var två dagar. Under kursen varvades de teoretiska avsnitten med praktiska tillämpningar, men den mesta tiden gick åt till avsnittet Praktiska övningar Förkunskaper För att tillgodogöra sig kursen bör man framförallt vara nyfiken på hur webbpublicering fungerar. Att kunna enkel datorhantering och grundläggande begrepp underlättar arbetet. Eftersom vi använder Folkbildningsnätet är det bra om du är ansluten till detta Kursmål Att deltagarna ska kunna lägga ut text och bild på Internet Att kunna använda denna kunskap i ett vuxenpedagogiskt sammanhang Att kunna lära ut ovanstående i en elevgrupp Sida 3

4 1.4 Webbpublicering - en pedagogisk möjlighet Vad kan då webbpublicering som arbetsredskap tillföra folkhögskolans pedagogiska praxis? Utan att utlova en ny revolutionär metod tror vi att rätt tillämpad kan webbpublicering vara ett nytt och utvecklande sätt för eleverna att redovisa sina arbeten i text, bild, film och ljud - för varandra och andra intresserade. Att nå andra med sina arbeten stimulerar lusten att uttrycka sig. Genom att själv producera sidor på nätet i stället för att bara ta emot blir eleven en aktivare och mer kritisk användare av webben. Eleven/klassen/skolan kan genom att ha en egen webbplats dokumentera sitt skolarbete under året. Specialarbeten, uppsatser, dikter, bilder - allt kan sparas där och visas för andra. Det blir en slags loggbok över läsårsarbetet. Man kanske börjar i det lilla, i klassen och skolsamhället för att sedan öka ringarna. Läraren kan lägga ut arbetsmaterial, arbetsuppgifter och bakgrundsmaterial som eleverna lätt kan komma åt. Användbara länkar, ett länkbibliotek, kan publiceras för eleverna att leta vidare i. Vidare är det ett praktiskt sätt att hålla kontakt med andra folkhögskolekurser med t.ex. samma inriktning, eller med vänortsskolar och därigenom öka det internationella kontaktnätet. Läsa vidare Navigatören, Skolverket Skolverkets vägledning till pedagogiskt arbete med IT. En handledning som kan rekvireras gratis från Bra webbplats Skolverkets webbsatsning. En mötesplats för det pedagogiska IT-arbetet i skolan. Vänder sig främst till lärare. Här finns bl.a. en multimedia-skola och en HTMLskola. Sida 4

5 1.5 Internationalisering - projekt mellan skolorna Det pågår en livlig projektverksamhet inom folkbildningen i Sverige. Förutom de projekt som folkbildningsrådet bedriver i folkhögskolorna arbetar många skolor med transnationella projekt inom EU och bidrar på sätt till utvecklingen av folkbildningen. De projekt, som bedrivs i samarbete med andra skolor och institutioner i Europa har varierade mål och medel. Många har att göra med åtgärder för de vuxna kortutbildade arbetslösa, som vill förbättra sin ställning på arbetsmarknaden genom olika väglednings- och utbildningsinsatser. Bra webbplats Folkbildningsrådet: Här finns information om de pågående projekten som FBR står för. Axevalla folkhögskola: Om samarbete med Estland bl.a för att starta en folkhögskola där. Carlforska gymnasiet: Många olika projekt bl.a. en gemensam bok, material etc. Westerlundska gymnasiet: Elevutbyte, andra kontakter etc. Handikapporganisationer: Internationellt biståndsarbete och samarbete mellan handikapporganisationer Distum: Många olika projekt som Distum står för. Sida 5

6 Teoridel 2. Internet Internet är ett vildvuxet kommunikationssystem, ett nät av nätverk. Där kan du hitta konsumentupplysning, nynazistisk propaganda, akademiska avhandlingar, Ikeas försäljningssida mm. Där kan du "chatta" med nyfunna, okända människor världen över. Där kan du delta i en diskussion om demokratins kris i den nya ekonomin eller ladda hem den senaste hitlåten. Internet skapades för ungefär 30 år sedan av den amerikanska försvarsindustrin för att skydda sina datacentraler från att slås ut av en kärnvapenattack. Man länkade samman sina datorer i ett nätverk. Brast en länk fanns det alltid någon kvar. Det skulle inte finnas någon central dator utan datatrafiken skulle kunna dirigera sig själv mellan de olika datorena i nätverket. Men först efter 1989 när den speciella HTML-koden utvecklades, blev nätet mer spritt och använt utanför dataexperternas grupp. Internet erbjuder sina användare ett antal tjänster. De mest använda är: WWW, world wide web E-post FTP (File Transfer Protocol), filöverföring Nyhetsgrupper, diskussionsgrupper (news groups) Chat Internet utvecklas hela tiden för att göras mer användarvänligt och mer attraktivt. Att skicka e-post blev tidigt ett väl utnyttjat sätt att använda nätet och är idag den flitigast använda tjänsten. Från att ha varit ett kommunikationssystem för att överföra textdokument, kan man idag se film, ladda ner den senaste hitlåten, beställa flygbiljetten. Interaktiviteten har ökat, liksom antal användare var antalet 40 miljoner, miljoner och miljoner, av dessa bor hälften i USA och en fjärdedel i Europa. Liksom vid andra teknikskiften genom tiderna blir den nya tekniken både ett hot och ett löfte. Hotbilderna som tornar upp sig är risken för "storebror ser dig", övervakningssamhället, ökade klasskillnader och en global uppdelning där tredje världen halkar efter än mer i ekonomisk utveckling. Löftena vad gäller den nya tekniken har varit allt från lösning på skolans kris, en ny global gemenskap till en förenklad vardagstillvaro. Läsa vidare Internet för lärare, Göran Lindgren, Studentlitteratur Mycket användbar bok om den pedagogisk användning av Internet. Sida 6

7 Hur förändras våra livsvillkor? Emin Tengström En kritisk betraktelse av IT-samhället och kunskapssamhället. Lämpar sig bra för diskussioner i klassen. Net-wars, Ilshammar, Larsmo En rolig och intresseväckande debattbok om IT Sida 7

8 2.1 Folkbildningsnätet Internet är ett nät mellan miljoner av datorer i världen - men vad är då ett folkbildningsnät? Jo, det är ett konferenssystem och ett pedagogiskt verkstyg för folkbildare i Sverige. Det fungerar som en mötesplats, ett informationstorg, en konferensanläggning och ett studiecentrum för oss alla. Det nya jämfört med vanliga mötesplatser är att allt sker digitalt dvs. man ser endast symboler och text på dataskärmarna i landet. Tid och rum är inte viktigt, utan man kan när som helst på dygnet gå in och säga sin mening, sprida information och ta reda på vad andra har sagt. Man kopplar upp sig på Internet, söker fram Folkbildningsrådets hemsida; loggar in sig på folkbildningsnätet och klickar fram den konferens man vill delta i. De flesta folkhögskolor och studieförbund har egna konferenser som används dagligen. 2.2 WWW World Wide Web Web betyder spindelnät på engelska och WWW är som ett stort nät som kopplar ihop många mindre nät och miljontals enskilda datorer över hela världen. Egentligen är det inte ett nätverk av datorer som Internet utan ett nätverk av dokument. Dokumenten är sammankopplade med länkar som anger vilka andra dokument på webben som kan vara av intresse för läsaren. Webben använder sig av Internet för att överföra dokumenten. Det kan beskrivas som ett lager ovanpå Internet som gör det enklare att komma åt informationen på nätet. Framsidan av en tjänst - rotsidan t.ex. Torget eller Passagen kallas för en hemsida. Därifrån kommer man sedan vidare till innehållet och länkar. För att kunna använda webben måste man ha en webbläsare (browser) alltså ett program som kan förstå webbens språk. De mest använda är Internet Explorer eller Netscape. Bra webbplats Sidan är skriven av några studenter vid Umeå Universitet. 2.3 Vad är en webbserver? Vanligen är detta en kraftfull dator med snabb fast Internetanslutning. Den är utrustad med en speciell programvara för att skicka ut sidor på webben. Via något som heter DNS svarar servern på anrop till sin egen domän (till exempel Servrar hos stora organisationer och operatörer är dyra anläggningar som sköts av specialister. Om mindre kapacitet krävs kan man installera gratis serverprogramvara i en enkel PC och ansluta den som domänserver till Internet. På detta sätt kan en folkhögskola ha en egen webbserver med eget domännamn i sina lokaler. Ett annat sätt att få ut sidorna på nätet är att hyra in sig hos en operatör med servar som betjänar många kunder (s k. webbhotell). För privatpersoner och ideella organisationer finns gratis webbhotell. Sida 8

9 I privata Internetabonnemang ingår oftast rätten att publicera en mindre mängd sidor. Många Internetportaler erbjuder gratis publicering. Som framgår på annan plats erbjuder även folkbildningsnätet denna möjlighet. Nackdelen är att portalens eller operatörens domännamn måste finnas först i adressen (t ex Om trafiken skulle bli livlig får Du räkna med att bli utkastad. 2.4 HTML Hypertext Markup Language HTML är ett markeringsspråk eller sidbeskrivningsspråk, som används för att dokument/sidor på Internet skall kunna läsas av alla webbläsare (browsers) oavsett om användaren har en Mac eller en PC. Ett HTML-dokument är alltså en www-sida, som har gjorts/skrivits med hjälp av markeringar (tags/sv. taggar), texter och bilder. Exempel: Så här ser sidan ut på webben: min hemsida.html Detta är min hemsida Jag heter Kalle Karlsson och bor... Så här ser HTML- markeringen ut: <html> <head> <title> min hemsida</title> <body bgcolor= lightgrey > <b> Detta är min hemsida</b> Jag heter Kalle Karlsson och bor... <centre><img src:= syrsa.jpg > </body> </html> Läsa vidare Internet databoken, Erik Ronne, Docendo En lättfattlig handbok om Internet. Bra uppslagsdel, som förklarar alla termer man stöter på. Bra webbplats En bra sida om HTML En första introduktion till HTML-språket. Får kopieras fritt. Sida 9

10 3 Datorns hård- och mjukvara 3.1 Datorns hårdvara Vad behöver man för dator för att kunna arbeta med webbpublicering på enkel nivå? Svaret är att en vanlig modern standarddator räcker bra (prisklass i dag kr). Är din dator mer än tre år gammal eller äldre måste Du räkna med att vissa saker inte går att göra snabbt och enkelt. Extra internminne är bra att ha om man vill kunna jobba med flera program och dokument samtidigt. Det underlättar om bildskärmen har bra kvalitet och är åtminstone 17. En bläckstråleskrivare som skriver färg hyfsat bör finnas tillgänglig. (Pris kr och uppåt) En CD-brännare (ca kr) är bra att ha för arkivering och för att skicka större datamängder till andra. En bildläsare/skanner bör finnas tillgänglig ( kr) Hemma behöver du ett modem för att komma ut på Internet. På skolan har du normalt en fast Internetanslutning via det lokala datanätet. 3.2 Datorns mjukvara Operativsystemet (OS) är en basprogramvara som krävs för att datorn ska fungera på avsett vis. Mac eller PC kan diskuteras länge men för webbpublicering spelar det ingen större roll vilket du väljer. Det är stora fördelar med att ha ett modernt operativsystem, eftersom dessa på olika sätt är bättre anpassade för Internet. (OS ingår normalt i köpet av datorn) Du bör ha flera webbläsare installerade och se till att dessa är relativt moderna. Det behövs för att Du ska kunna testa att Dina sidor fungerar. Webbläsarna är sedan några år gratis att installera och använda. I Netscape ingår en modul som heter Composer där man skriver HTML-kod i något som liknar en ordbehandlare. Du har en enkel texteditor (Skriv text/anteckningar) bland tillbehörsprogrammen som levereras med datorn. Lär dig att använda den. Ett modernt ordbehandlingsprogram är bra att ha när du författar dina texter. Där ingår bland annat en modul för stavningskontroll. Word 2000 kan spara texter som webbsidor på ett ganska bra sätt. Om Du använder Word 97 bör Du ladda hem och installera ett förbättrat tillägg för att spara som HTML. Ett program för bildbehandling är nödvändigt för att du ska kunna anpassa dina bilder till webben. Ett sådant program ingår när du köper bildläsare. En stor mängd specialprogram finns för webbdesigners. Frontpage och Dreamweaver är de vanligaste. Dessa är inte nödvändiga för att kunna göra enklare sidor. Sida 10

11 4 Datasäkerhet och sekretess Detta ämne är stort och i sig en världsindustri med många tals anställda. Vi vill här ta upp några punkter som kan vara relevanta för en lärare som vill publicera sig på nätet i ett pedagogiskt sammanhang. En aspekt av datasäkerhet är att man bör lagra sina dokument på ett säkert sätt. Att skriva en bok och bara ha den lagrad på sin lokala hårddisk är rent ut sagt olämpligt. Listan över fatala händelser som kan inträffa börjar med: hårddiskhaveri, datorhaveri, virusangrepp, radering av misstag, brand i hemmet, stöld osv. Lösningarna är ganska enkla; att lära sig och även att utföra: säkerhetskopia på diskett, på CD (via CD-brännare) e-posta dokumentet till dig själv på folkbildningsnätet eller skolan. Förlust på grund av brand eller stöld kan man bara säkra sig mot genom att förvara säkerhetskopior på annan plats. En form av säkerhet är faktiskt att skriva ut på laserskrivare och förvara utskriften i arkiv. Det finns inget skydd som är helt fullkomligt för data som sparas på datorer i nätverk eller Internet. Däremot finns en rik skala av skydd som många gånger räcker mer än väl: Lagra data i en dator med säker inloggning och möjlighet till exklusiv åtkomst till kataloger efter användare (T ex Windows NT och 2000). Använd skydda dokument i Word (Officepaketet). Skaffa en speciell krypteringsprogramvara och använd den. Använd bra lösenord och se till att de inte råkar i händerna på obehöriga. Om du vill skydda en publicerad hemsida mot åverkan måste du lita på den operatör som sköter Webbservern. Internet och sekretess är på sätt och vis två motsatta begrepp. Om man vill att bara en begränsad krets ska kunna läsa en hemsida är detta fullt möjligt att genomföra. Du bör dock ta hjälp av någon som kan din webbservers programvara. Till sist Utgå från att det du lägger ut på Internet kommer att kopieras och användas av andra (om det är bra). Om du absolut inte vill bli utnyttjad på det viset bör du nog avstå från publicering. Sida 11

12 5. Skapa dokument för webben För att skapa dokument som ska visas i en webbläsare (Explorer eller Navigator) kan man gå till väga på många olika sätt. Vilken metod man väljer beror på syftet med hemsidan och hur mycket tid man vill lägga ner på produktionen. De egna kunskaperna spelar givetvis en avgörande betydelse. En yrkesverksam webbredaktör använder en hel uppsättning dyra och avancerade program för att skapa professionella sidor. I ett pedagogiskt sammanhang på en folkhögskola har man en begränsad tid och budget till sitt förfogande. Målgruppen är liten och känd och behöver inte övertygas med en massa grafik och andra "trix". Några lämpliga program och metoder: 1. Manuell HTML-kod Alla som har Windows 95/98 eller NT har ett litet program för textredigering som heter "anteckningar" (Start - program - tillbehör - anteckningar. Detta program skiljer sig från ett ordbehandlingsprogram genom att det inte sparar en massa styrtecken utan bara det man skriver in. Det passar därför bra för att skriva eller redigera programkod som t ex HTML-kod. Programmet finns normalt i alla datorer och kostar således ingenting extra. Nackdelen med detta sätt att skriva in koden är att man måste lära sig ett antal HTML-taggar utantill. Om man lägger in större textmassor blir det ganska omständigt att arbeta på detta sätt. Alla specialtecken måste skrivas in på ett speciellt sätt. 2. "Spara som HTML" Vi räknar med att alla skolor har tillgång till datorer med Microsoft Office 97 eller 2000 installerade. Efter att ha redigerat klart sitt dokument i Word går man till Arkiv - spara som HTML. Programmet skapar då automatiskt HTML-kod och man bestämmer dokumentnamn och lagringsplats. Detta sker mycket snabbt och enkelt. Nackdelen är att särskilt Word 97 inte klarar av att återge sidan i HTML på avsett sätt. 3. HTML-kod via en gratis HTML-editor (t ex Netscape Composer) 4. Avancerad hemsidekonstruktion (t ex Frontpage eller Dreamweaver) 5. Spara som HTML" i ett grafiskt program (t ex Indesign) För nybörjaren som producerar för en begränsad grupp motiverade läsare och som inte kan lägga ner mycket tid på utformningen eller sin egen utbildning är någon av de tre första metoderna att föredra. Sida 12

13 6. Upphovsrätten Nya medier för med sig nya etiska och juridiska frågeställningar. Lättheten att kopiera text och bild från nätet har gjort att många nätanvändare kopierar material från nätet. Om man arbetar med webbpublicering inom undervisning är det viktigt att känna till hur lagen om upphovsrätt fungerar på Internet. Grunden i Upphovsrättslagen är att upphovsmannen, dvs. författaren, tecknaren, kompositören eller fotografen har rätten till sina verk. Upphovsrätten gäller femtio år efter upphovsmannens död. Lagen om rätt till fotografisk bild reglerar fotografers rätt till sina bilder. Alla fotografiska bilder skyddas av lagen, alltså även amatörbilder. Här gäller ett skydd på femtio år efter att bilden framställdes. En enkel regel gäller: Allt material (text, bild, musik, grafik etc.) som är publicerat är upphovsrättsskyddat, oavsett om det uttryckligen står eller ej. Så fort du lägger ut något på nätet är det likställt med att publicera. Det betyder att du inte utan tillstånd får vidareanvända material från nätet annat än för personligt bruk. Man får t.ex. inte ladda ner en bild man hittar på nätet och sen lägga ut den på sin egen hemsida. Lärarnas kopieringsavtal, som reglerar tryckta medier gäller inte material på nätet. Men mycket material på nätet är utlagt för att informera och för att spridas. Det brukar vara tydligt angivet, ofta med tillägget att källan eller upphovsmannen måste anges. Det finns t.ex. undervisningsmaterial som fritt får användas. Citaträtt Ingen regel utan undantag, Du får använda dig av korta citat ur skyddade verk för att förtydliga delar i ditt eget verk. Du måste då ange källan. Att läsa vidare Internetpublicering, en juridisk vägledning, Malin Edmar, Kulturnät Sverige Bra webbplats Här kan du läsa om olika juridiska frågor runt nätet, och även fritt ladda hem "Internetpublicering, en juridisk vägledning" se ovan. Sida 13

14 7. Bilder för webben Bilder på en webbsida lättar upp en textmassa och kan ibland även ersätta text. Möjligheten att visa bilder är en av anledningarna till varför webben har blivit så populär. Men bilder ställer lätt till problem. De kan ta lång tid att ladda ner och irritera besökaren. Att få bilder att fungera på webben. kräver en hel del hel kunskap om hur den digitala bilden fungerar. 7.1 Att få in bilder i datorn Bildinläsning i en skanner. De flesta bilder som används idag är fotograferade med en vanlig kamera och måste omvandlas till digital form i en skanner (bildläsare) för att kunna visas i en dator. De vanligaste kallas flatbäddsskanner och där kan du läsa in en färdig bild. Det finns även negativskanner, där du kan läsa in negativ eller diabild. Digitalkameror. Bilden kan läsas in direkt i datorn utan framkallning och kopiering. I stället för film används ett bildkort där bilderna lagras digitalt. Det finns enkla kameror, typ kompaktkameror, som lämpar sig bra för webbilder. De är i dag inte dyrare än en bra kompaktkamera. Fotoaffären kan föra över bilder till en diskett eller CD. Att föra över sina bilder till diskett samtidigt som du lämnar din filmrulle för kopiering är idag ett billigt sätt att digitalisera dina bilder. CD är en dyrare lagring men ger flera varianter på samma bild (olika bildupplösningar) Egna bilder kan skapas i ett bildprogram som Paint Shop Pro eller Illustrator. Du kan ladda ner bilder som är fria att använda från webben. Speciella bildskivor finns att köpa med "fria" bilder.. De är ofta indelade efter olika motiv. Sida 14

15 7.2 En digital bilds uppbyggnad En starkt uppförstorad pixelbild, För att få in en bild i datorn måste den alltså digitaliseras, dvs göras om till ettor och nollor. Det innebär oftast att bilden kommer att bestå av små fyrkanter som kallas pixlar, vi säger då att bilden är punktupplöst. Det betyder alltså att bildens information är en mängd små punkter i olika färger. Pixlarna är olika stora beroende på vilken upplösning bilden har. Ju mer du förstorar en bild uppbyggd av pixlar desto tydligare syns fyrkanterna och desto taggigare blir bilden. En bild med hög upplösning kan du förstora mycket innan den uppfattas som taggig. Högupplösta bilder har fler och mindre pixlar och kvaliteten är därför bättre. Bilden på hunden är inläst i mycket låg upplösning på 16 dpi för att pixlarna ska synas tydligt. 7.3 Bildupplösningen Bildens upplösning, bildkvaliteten, anges punkter per tum, dpi (dot per inch). När du läser in en bild med en skanner eller redigerar bilden i ett bildbehandlingsprogram, så kan du välja vilken upplösning bilden ska ha. Ju högre upplösning, desto fler pixlar och desto mer datorminne krävs. Bilder för webben behöver inte högre upplösning än 72 dpi, vilket ungefär motsvarar bildskärmens upplösning. 7.4 Bildstorlek Det bästa är att bilden är i rätt storlek när du tar in den på webbsidan. Såväl en förstoring som en förminskning resulterar oftast i en försämrad bildkvalitet. En bilds storlek anges i Kb. Du ska försöka få ner vikten på bilden utan att förstöra bildkvaliteten. Ju tyngre bild desto längre tid tar nedladdningen av sidan. Du kan t.ex. ta bort information som är onödig i bilden genom att beskära den. Om du vill visa många bilder, en fotoutställning eller visa bilder från skolans temadag kan du minska bildens fysiska storlek, bara göra små tumnagelbilder. Du länkar sedan bilderna till samma bild fast i originalstorlek. OBS! Även bilder kan göras till länkar. Skriv på sidan att genom att klicka på bilderna kan man få se bilderna större. Det går då mycket snabbare att ladda hem sidan. Sida 15

16 7.5 Bildskärmens upplösning När man talar om en bildskärms upplösning menar man hur många pixlar som visas på hela skärmen, i sid- och höjdled. Vanliga skärmupplösningar är 640 x 480, 800 x 600, 1024 x 768 skärmpunkter. Beroende av vad ditt grafikkort till skärmen klarar kan du ställa in bildskärmens upplösning. Högre upplösning ger bättre kvalité, men bilder och text visas mindre. Det här är viktigt att tänka på när du skapar dokument för att lägga ut på nätet. Hur ska dokumentet visas? Du har själv inget inflytande hur över vilken storlek användarna har på sina skärmar, (här finns allt från 14 till 21-tum). Du vet inte heller vilken skärmupplösning de har ställt in. Så här visas bilden beroende på vilken upplösning som bildskärmen har Sida 16

17 7.6 Bildformat på webben GIF Det är ett av de vanligaste formaten som används för att visa bilder i HTMLdokument på webben. Bilder i GIF-format är starkt komprimerade för att snabbt kunna laddas ner på bildskärmen. Formatet klarar maximalt 256 färger. JPEG Formatet JPEG(.jpg) används främst för att visa fotografier på webben. Formatet komprimerar bilden och gör att bilderna laddas snabbare. Bildinformation tas bort som inte är så viktig för bilden. Om du arbetar med JPEG-bilder undvik att spara om bilden flera gånger eftersom bilden då tappar i kvalitet. Detta format kan hantera flera färger jämfört med GIF. Bilden varierar beroende på antal färger, filstorlek och hur lång nedladdningstiden är. Sida 17

18 7.7 Färger Varje pixel på skärmen kan visa de tre grundfärgerna rött, grönt och blått eller en blandning av dessa tre, RGB-färg. Maximalt kan ca 16,8 miljoner färger visas på bildskärmen. Bildens färgdjup anger hur många nyanser den kan visa. 8 bitars färgdjup ger 256 olika kombinationer. Läser du in en svartvit bild får du automatiskt 8 bitar per bildpunkt. För färgfotografier är 24 bitars färgdjup det maximala. Men ju fler färger du väljer att spara din bild med desto tyngre blir den. Om du har ett bildbehandlingsprogram kan du ta bort de färger som inte är nödvändiga för bilden. Om du gör om en färgbild till en svartvit bild minskas storleken med en tredjedel av den ursprungliga. Kom ihåg att alltid spara en kopia av den ursprungliga bilden när du gör om den. Illustrationen ovan visar olika alternativ för samma bild, det är en funktion i Photoshop 5.5, Spara för webben. 7.8 Lägga in bilder på webbsidan Bild med 72 dpi Koden för att sätta in en bild är <IMG SRC= >. Det betyder image source. Efter likamedtecknet ska du ange korrekt namn på bilden och sökväg till bilden. Det är enklast att ha alla bilder i en mapp som du lägger på samma ställe som webbsidorna. I bilden på hunden blir koden <IMG SRC= "king.jpg"> Med attributen WIDTH och HEIGT ger du webbläsare måtten för bilden (antalet pixlar). Det underlättar för webbläsaren och nedladdningen går snabbare. Bilden ovan WIDTH="220" HEIGT="160" Alternativ text Med attributet ALT kan du ange en text som visas i en textruta när du för musen över bilden. Det är också den texten som visas om grafiken är avstängd. ALT= "min hund" Hela taggen för bilden <IMG SRC= "king.jpg" WIDTH="220" HEIGT="160" ALT= "min hund"> Läs vidare Under rubriken Praktiska övningar sid. 27 Sida 18

19 Läsa vidare Digital bildbehandling, Astrid Haugeland, Pagina En pedagogisk och grundlig bok. Den har ett särskilt kapitel om den digitala bilden. Den beskriver tre vanliga bildbehandlingsprogram; Photoshop. Paint Shop Pro och Photo-Paint Det finns många bra läroböcker för Photoshop. Några att rekommendera: Starta med Photoshop, KnowWare-serien Enkelt och billigt häfte För fulla segel med Photoshop, grundkurs i bildhantering, Björn Kläppe Många exempel och praktiska övningar Bra webbplats Här hittar du bra manualer till många program, som vi tar upp i det här materialet. Även praktiska övningar. Sida 19

20 8. Grundtips för lay-out på en webbsida När du presenterar text Använd inte för långa rader. Max 65 tecken på en rad. Det är svårare att läsa text på skärm än i tryckt form. Använd korta stycken. Det blir lättare att läsa Lägg ut långa texter på flera sidor med länkar emellan, i stället för ett långt dokument. Normalt ska en textsida aldrig vara längre än två skärmbilder, Mellanrubriker lättar upp Fet stil kan användas som rubrik i stället för att öka storleken på bokstäverna. Begränsa antalet storlekar på bokstäverna. Två stycken räcker gott. Begränsa även olika typsnitt. Använd t.ex. ett typsnitt för rubriker och ett för löpande text (brödtext) Använd kursiv text sparsamt. För att markera ord men inte flera rader. Använd aldrig funktionen blinkande text för att framhäva något. Grafik och bild Använd gärna bilder för att variera sidornas utformning och framhäva budskapet. Frilagda bilder kan ofta vara bra att använda. De ger ett luftigare, mer levande intryck samtidigt som de går lite snabbare att ladda ner. Undvik starka färger som bakgrund. Läsbarheten försämras. Vitt och ljusgrått är att föredra. Bilder som bakgrund tar ofta för mycket uppmärksamhet från innehållet. Använd endast ett minimum av animerade, rörliga, bilder. De drar till sig uppmärksamheten och stör om de visas hela tiden. Bilder ska vara tydliga och lätt avlästa. Använd så små bilder som möjligt, bilder tar lång tid att ladda ner och användare tycker inte om att vänta. Sida 20