Bildhantering i OEW. Vi ska arbeta med följande bilder:

Transkript

1 Bildhantering i OEW Bilder på webben Bilder som man ser på olika hemsidor bör ha dessa egenskaper: 1 Klara färger 2 Skärpa 3 Snabbladdade 4 Rätt storlek för syftet Vi ska arbeta med följande bilder:

2 Program och korrigering Klara färger Vi har kanske alla misslyckats med ljuset i en bild? Se exemplet på bilden. Där är bakgrunden ljus medan flickans ansikte hamnat helt i skugga. Kanske är bilden en ögonblicksbild och det går helt enkelt inte att fotografera om. Vad kan man göra då? Bildhanteringsprogram Det finns en uppsjö av olika bildhanteringsprogram. Adobe Photoshop, Paint Shop Pro, PhotoImpact, Adobe PhotoDeluxe, Fractal Painter 5, Kai s Photo Soap, Micrografx Picture Publisher 8.0, Macromedia Xres 3.0, Corel Photopaint 8, JASC Paintshop Pro 5...o s v. Det är alltså omöjligt att försöka gissa vad var och en har hemma i just sin dator. Photoshop räknas dock som det mest proffesionella programet medan kanske Paint Shop Pro är det vanligaste på skolor. Exempel på korrigering: 1. Här har vi använt ett verktyg i Photoshop som kallas lasso 2. Ringa in området du vill förändra. 3. Här ska man nu helst lägga på ett ludd så kanten mellan det markerade området och det område som inte skall förändras, inte blir så markant. 4. Ljusa nu upp området. Detta går att göra på olika sätt. Intensitet, nyans, reducera svart o s v. Kontrollera och exprimentera hur just ditt program fungerar.

3 RGB och upplösning Vad är RGB? Jo, det är en förkortning på Rött, Grönt och Blått. När dessa färger läggs ihop lurar man ögat att se andra nyanser. Dataskärmen RGB är det färgsystem som en dataskärm använder sig av. Därför sparar man bilder för webben i det färgsystem som ögat kommer att se. I bildhanteringsprogrammet Titta på bildinformationen hur bilder är sparad. Oftast ligger bilder från en digitalkamera redan i RGB. Annars ändrar man färgläge i ditt befintliga bildhanteringsprogram. Upplösning Bilderna ska ha en upplösning om 72 dpi. Kontrollera detta i ditt bildhanteringsprogram. Storlek I OEW mäts detta i pixlar. 100 pixlar = 3,53 cm Upplösning + storlek = rätt resultat! Upplösningen, 72 dpi, och därefter den tänkta storleken man vill att bilden ska visas i, återger bäst resultat på hemsidan. Planera alltså din design! Vad är pixlar? Av engelskans PICture Element - alltså bildelement i datorn. En digital bilds eller bildskärms minsta visuella beståndsdel. Antalet pixlar per tum beskriver exempelvis bilders och skärmars upplösning. Förstora inte! Datorskärmen kan bara återge 72 dpi - därför blir inte bilderna bättre om upplösningen ökas. Det som händer är att bildern kräver mer lagringsutrymme och blir tyngre att laddas för den som besöker hemsidan....max 15-20% Måste du av någon anledning förstora en bild ändå? Ja, mer än 20% rekommenderas inte - därefter uppfattar ögat att bilden blir pixlig, grumlig och oskarp. Pixlar i bilden Pixlar är alltså små fyrkanter liggandes på linjer. Förstorar man en bild förstorar man alltså pixeln också. Den lilla fyrkanten blir alltså en STOR fyrkant och ögat börjar ny uppfatta dessa.

4 Bilden i OEW Mediamappen Här gissar vi att du redan kan hämta upp en bild i mediamappen. Läs lathunden för grunderna i OEW annars. 1. Visa bild Under denna fliken visas bilden så som den kommer att publiceras på hemsidan. 1

5 Bilden i OEW 2. Egenskaper Det är här man fixar till bilden så som man vill att den ska publiceras I arkiv Här ser du vilket mediarkiv bilden ligger i. För att hålla ordning på bilderna kan det vara bra att ha flera medimappar. Känner du för att flytta en bild till en annan mapp, så ändrar du här. 4. Filnamn Originalfilens namn visas här. Bra att veta om bilden ska uppdateras då namnet måste vara lika som här. 5. Storlek Bildens utrymme i kb. Denna siffra ändras om bredden, höjden eller kvaliteten ändras. 6. Bildstorlek Se till att bevara proportioner är i kryssad. Därefter kan du ändra bredden och höjden på bilden. Det kan bli snyggt om bilderna som ligger på samma sida har enhetlig storlek. Då är det lätt att fixa detta här. 7. Kvalitet Här kan du skära ner bildens filstorlek ytterligare genom att ändra bildkvaliteten. Titta under nästa flik visa bild för att se resultatet.

6 Bilden i OEW 8. Uppdatera mediafil Bra att ha om man använt bilden på en eller flera sidor. Då kan man bara uppdatera med samma namn som originalet och då ändras bilden automatiskt på de sidor där den finns Används i Här ser man vilka sidor som bilden ligger på. 8

7 Beskärning 10. Att beskära en bild Det finns ganska många bilder som skulle vinna på att beskäras. Detta gör man i sitt bildhanteringsprogram. 9. Enkla beskärningar gör bilden proffsigare Den här bilden är ganska typisk. Båtens kant finns med nertill. Den tar vi bor genom att beskära. Nu blev det ganska mycket himmel istället... Så! Snyggt!