
Alla bilder du ska lägga på en hemsida måste anpassas för webben. För stora bildfiler ger långa nedladdningstider (dvs tiden det tar för en besökare att få upp sidan i sin webbläsare). Därför måste alla bilder redigeras och sparas om i Photoshop. Tänk på att om du bygger ett bildgalleri på en hemsida måste du spara två varianter av bilden, en s.k. "thumbnail" och en större bild.
Alla bilder på en hemsida måste ha rätt upplösning (=hur många pixlar som ryms inom en viss yta) och storlek (bredd gånger höjd, angett i pixlar). Upplösningen ska anpassas för skärmvisning, 72-96 pixlar/tum, och storleken beror såklart på din design.
Bildens storlek i pixlar ska skrivas in i img-taggen, så att webbläsaren bereder plats för bilden medan den laddas ned. Ett exempel:
<img src="bild.jpg" width="200" height="300" />
Läs mer:
Gå in på Webdesignskolan och leta reda på Photoshopskolan och avsnittet om Vektor- och Bitmappbilder.
Det finns två färglägen för digitala färgbilder; RGB och CMYK. CMYK är till för bilder i tryck och RGB för visning på skärm, och därför ska alla bilder på en webbsida vara i RGB-läge. Glömmer du detta kan det hända att bilden inte kan visas i webbläsaren.
För att kontrollera eller ändra färgläge öppnar du bilden i Photoshop och går in på Image -> Mode (Bild -> Läge).
För att webbläsaren ska kunna visa dina bilder måste de sparas i formaten .jpg, .gif eller .png. Jpg är vanligaste formatet för foton. Gif används till enklare bilder med få färger (typ tecknade figurer) och till gif-animationer. En gif-bild kan bara innehålla 256 färger. Png är ett alternativ till gif, som kan visa fler färger men som inte kan animeras.
När du sparar en bild för webben ska du tänka på att alla tre bildformaten komprimerar bilden (förenklar den så att filstorleken blir mindre), vilket försämrar kvaliteten på bilden. Sparar man om bilden flera gånger i t.ex. jpg-format försämras bildens kvalitet för varje gång du trycker Spara. Jobba därför med bilden i Photoshopformat (.psd) tills den är klar, och spara sen om den till det webbformat du vill använda.
Läs mer:
Gå in på Webdesignskolan och vidare till Photoshopskolan och avsnittet Spara för webb.