Bildoptimering för webben



Relevanta dokument
ICC-profiler och färginställningar

bilder för användning

Grundredigering i Photoshop Elements. Innehåll. Lennart Elg Grundredigering i Elements Version 2, uppdaterad

En grund i bildbearbetning för webben i Photoshop Elements 11

1. Beskär bilden och räta eventuellt upp bilden med beskärningsverktyget

Prioritet. Varför digitalisera? Apparater; i allmänhet. Datorn

En grund i bildbearbetning för webben i Photoshop CS5

Bildredigering i EPiServer & Gimp

Bilder för tryck med Photoshop

Kort lektion i skannerteknik

ICC-profiler & färginställningar FÖR DAGSPRESS

Från raw till print. Grundläggande genomgång av arbetsflöde och bildoptimering i

Optimala bildinställningar för leverans TEORIHÄFTE TILL KURSEN

Från foto till bildskärm och tryck med bästa kvalitet Ulrik Södergren

John S. Webb 2006 (text citat från Adobe)

Utskrifter steg-för-steg och färghantering

Format. Problem. Andra format. Digital redigering. JPG för fotografier. Photoshop. GIF lämplig för ritad grafik

Exponera mera AV STEFAN OHLSSON I PRAKTISK TEKNIK

Lär dig grunderna i Photoshop Elements 4.0

Adobe Photoshop CC Jan Johansson 2014

Photoshopskolan, retro-look

Arbeta smart med fyrfärgsvarta bilder

Grundredigering i Photoshop Elements

Adobe. Photoshop CS3. Fortsättningskurs.

Kravspecifikationer för digitalisering Svenska litteratursällskapet i Finland Digitaliseringstjänster

Kort lektion i Scannerteknik

Photoshop Skapa bilder för webben

Så här använder du de enklaste funktionerna i programmet: Starta programmet. Programmet startas från ikonen på skrivbordet.

Så skapas färgbilder i datorn

EIZOs guide till en djupare förståelse av digital fotografi

HDR den enkla vägen. Råkonverteraren Det första vi gör i råkonverteraren är att öppna våra tre bilder. av Kristoffer Ingemansson

All färg i Photoshop skapas via två system, RGB och CMY (se nedan).

Så får du perfekt skärpa i dina bilder del 1

Perfekt skärpa i Photoshop

Guide till tryckfärdigt original

1.1 Verktygslådan översikt

Digital bildhantering

Blickfång proffsen litar på

Bildbehandling 6 proffsiga verktyg i Photoshop Elements

Photoshop Elements 7. Adobe. Grundkurs

Photoshopskolan, skärpa upp en bild

Labfärg paradiset i Photoshop

Effektiv fotoproduktion Ulrik Södergren - ulrik@digitalfotografen.se

SUPPORT I PDF FORMAT. Navigera dig fram bland informationen med hjälp av bokmärkena på vänster sida

Allt om HDR. Reglagen i Photomatix. Tone Compressor

Filformat / bildformat

Du hittar manualen på.

1 Kursmaterialets uppläggning Kursmaterialets utformning Installation av övningsfiler... 6

Torstens Digitalbildguide

Skola: Photoshop och Elements Redigering för äkta bilder

Moderskeppet.se. Anteckningsmaterial till kursen Photoshop för naturfotografer. Med Patrik Larsson. Se fler kurser på Moderskeppet.

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

Fotohantering Digitalisera

Egenskaper och inställningar för QuickScan och förhandsgranskningsfönstret

Snabbguide för HP Photo Printing

Photoshop CS4. Adobe. Fortsättningskurs

Den blå texten representerar verktyg i programmet och den röda representerar olika flikar.

Inställningar för Adobe InDesign

Lägg till bilder i Disgen

Kung Päron. Efter finjusteringen är det bara att klicka Ctrl+J och friläggningen återfinns på ett eget lager och flyttat över den till arbetsbilden

Bilduppladdning i Järnvägshistoriskt forum (gäller MS Windows för PC)

Raw Hide. hantera camera raw-bilder

Innehållsförteckning:

Att använda bildhanteringsprogram, del 2

Kamera&Bild Nr Skola, Färgumpf

Bildbehandling Photoshop för naturfotografer

Photoshop: Photoshop World Världens bästa tips från experterna på mässan

Arbeta med bilder. Lathund kring hur du fixar till bilder från digitalkamera eller Internet så att de går att använda i ett kommunikationsprogram.

Redigera bilder snabbt och enkelt!

Adobe PHOTOSHOP. CS6 Fördjupning

There s more to the picture

Fånga och redigera bilder

Nya funktioner. Version 3.00

Utdrag FULL KOLL PÅ PHOTOSHOP. Gör dina bilder så mycket bättre med Photoshop (CS/CC) och Camera Raw. bosse kinnås

Att göra en modern släktbok för CD och webb med Disgen

Kurs i Lightroom 5. Thommy Andersen & Björn Kärf

9 Avancerad redigering

Photoshop - Kanaler. Den översta raden motsvarar de sammanslagna kanalerna RGB.

Photoshop CS4. Adobe. Fortsättningskurs

Adobe PHO SHOP CC. Fördjupning

digital UV-FOTO När man nu äger den utrustning eller hyrt den digital UV-FOTO från idé till bild för amatörer Del 1. Grunderna

Eizo Bildskärmar för Foto

Att bevara historiska bilder. Digitalisera, beskriva, söka, visa, långtidslagra

Arbetsuppgifter. JPEG-filerna/kopiorna skall döpas om efter projektets mall: ÅÅ-MM-DD bildtitel Fotograf

A3-scanner. Svenska. Användarhandbok

Öppna bilden C:\Photoshop5-kurs\Bananer 96ppi.psd. Aktivera verktyget Färgpyts i verktygslådan.

Retuschering inkl Skönhetsretusch. Kalle Prorok Okt 2010

Scanner Användarhandledning

SNABBT OCH SNYGGT MER KONTROLL FÖR DIG MED PHOTOSHOP CS3 SMIDIGT MED BRA KONTROLL. photoshop Trendiga bilder med Photoshop sid 61

Brusreducering och Skärpning av bilder. Kalle Prorok Okt 2010


Profiler för kameror och skannrar (del 2 av 4)

1 Bildhantering i MS Word

Två sorters bilder - högfrekvent och lågfrekvent. Bilden ovan räknas som högfrekvent bild, vilket betyder att den är detaljrik

SNABBGUIDE. Skanning Ricoh flerfunktion/hybrid

Uppgift. Laboration. Sidan 1 av 7

Det första du behöver göra är att ta reda på vilken storlek bilden har. Öppna en bild i Photoshop. Välj Bild; Bildstorlek i övre menyn

Användarguide för bildredigering i det webbaserade gratisprogrammet: Hur du klipper in ett objekt i en annan bild

Transkript:

Bildoptimering för webben Av Stefan Isaksson och Jonas Andersson För att få en så hög och så jämn teknisk kvalitet på webben som möjligt krävs att man behandlar bildfilen på rätt sätt. Denna artikel ger tips om hur man åstadkommer detta. Vi utgår ifrån att bilderna antingen skannas in eller kommer direkt från digitalkameran. Att ha en kalibrerad skärm är ett måste när man arbetar bilder i datormiljö. Det räcker ofta inte att göra en mjukvarukalibrering i t.ex. Adobe Gamma utan en hårdvarukalibrering är att rekommendera. Det finns flera produkter på marknaden som är bra, t.ex. Gretag Macbeths Eye One och ColorVisions Spyder. Om ni ändå väljer att endast ställa in skärmen med Adobe Gamma så hänvisar vi till en artikel på fotosidan skriven av Mikael Pertmann. Färginställningar Nästa steg är att ställa in Photoshops färginställning så att man arbetar i rätt färgrymd. För att bilden ska kunna användas till fler användningsområden än visning på webben bör man arbeta i färgrymden Adobe RGB så länge som möjligt. Ska bilden laddas upp på webben konverteras bilden till färgrymden srgb. Mer om detta senare i artikeln. Skanning Skanna bilden i största möjliga färgrymd (Adobe RGB) helst i 16 bitar. Lär er hur ni använder skannerns programvara på bästa sätt för att redan här uppnå maximal bildkvalitet. Se till att ha teckning i hela bilden, från skuggor till högdagrar. Undvik för hög kontrast. Bilden bör inte skärpas i skannerprogramvaran utan görs i stället i Photoshop. Se till att inte få med något svart ifrån filmramen när ni markerar skanningsområdet i skannerprogrammet. Filer från digitalkamera För att ha störst utrymme för färgjustering bör man fotografera i RAW-format och i färgrymden Adobe RGB. Digitalkameror kräver att man exponerar rätt. Det är lätt att högdagrarna fräter ut. Lär er använda histogrammet i kameran!

Arbetsflöde Se till att Photoshop är inställt i rätt arbetsfärgrymd. Det hittar ni under Färginställningar (Color Settings). Se dessa inställningar som en grundinställning. Bilder som redan har arbetsfärgrymden Adobe RGB kommer att öppnas i Photoshop utan dialogrutor. När bilder med färgrymden srgb öppnas kommer följande dialogruta att visas. Använd i detta fall den inbäddade profilen som redan har rätt färgrymd för webben, alltså srgb, se ovan.

Ställ nu in svart och vitpunkt. Ett sätt att göra detta är med verktyget Bild-Justeringar-Nivåer (Image-Adjustments-Levels [CTRL+L] ) I exemplet ovan sätts svart och vitpunkt där histogrammet börjar och slutar. Se nedan. Det går också att använda pipetterna för er som känner er säkra på detta. Mittreglaget justerar ljusheten på mellandagrarna. Var försiktig med för stora förändringar. Vill man nu höja kontrasten ytterligare kan man använda Bild-Justeringar-Kurvor (Image- Adjustment- Curves [Ctrl+M]) och här göra en svag S-kurva. Se nedan. (För er som har den senaste versionen av Photoshop kan ni använda verktyget Bild-Justeringar-Skugga/Högdagrar (Image- Adjustment- Shadow/Highlight/) om kontrasten är för hög och t.ex. de mörka partierna blivit för mörka.)

För att ta bort eventuella färgstick i bilden kan man i första hand prova Bild-Justeringar-Automatisk färg (Image- Adjust- Auto Color). Den fungerar ibland bra, men inte alltid. Om inte annat får man här en ganska bra uppfattning om man har färgstick i bilden eller inte. Ibland vill man ju faktiskt ha kvar ett färgstick i bilden och då fungerar inte denna metod. Annars är Bild-Justeringar-Nyans/Mättnad (Image- Adjustment- Hue/Saturation [Ctrl+U]) ett av de mest användbara verktygen för att justera färger. Här kan man välja att gå in i varje färg (rullgardinsmenyn, Edit:) och justera nyans och mättnad. Se nedan. Bild-Justeringar-Färgbalans (Image-Adjustment-Color Balance [Ctrl+B]) kan också användas för att justera färgstick. När färgjusteringen är gjord kan man nu konvertera till 8 bitar/kanal om bilden togs in i 16 bitar, Bild-Läge-8 Bits/Kanal (Image- Mode- 8 Bits/Channel). Detta för att inte filen ska bli för tung. Nu är ett bra tillfälle att spara bilden högupplöst och oskärpt i exempelvis Tiff format. Denna fil kan man sedan göra mindre bilder av till webben. Nu är det dags att storleksförändra bilden så att den passar på Picturo. Bildens längsta sida skall vara 600 pixlar. Ingen ram. Detta gör man i Bild- Bildstorlek (Image- Image Size)

Nästva steg är skärpning. Här använder ni Filter- Skärpa- Oskarp Mask (Filter- SharpenUnsharp Mask) Se nedan. Det är svårt att säga exakt vilket värde ni ska ha eftersom det beror på motivet, samt storlek på bilden. Mängden; Mängd (Amount) avgör hur mycket skärpa ni lägger på bilden och inställning för radien; Radie (Radius) beror mycket på hur stor bilden är samt hur fina detaljer den innehåller. Tröskelvärdet; Tröskelvärde (Threshold) längst ned kan oftast hållas mellan 0 och 2. Exempel på riktvärden för radien: Bild 600 pixlar hög (web 72 ppi): 0.3-0.7 Bild 3500 pixlar hög (utskrift 250 ppi) 0.7-1.0 Ett vanligt fel är att man använder för hög radie när man gör bilder till webben. Då får man ofta vita linjer runt skarpa kanter som inte är att föredra. I exemplet nedan har vi överdrivit för att visa effekten Radie (Radius) 1.9 Mängd (Amount) 200 Tröskelvärde (Threshold) 0 Radie (Radius) 0.4 Mängd (Amount) 220 Tröskelvärde (Threshold) 0 Man bör inte storleksförändra bilden efter den har skärpts. Spara hellre ut en högupplöst oskärpt kopia innan ni storleksförändrar och skärper.

Nu återstår bara att se till att bilden ligger i rätt färgrymd för ändamålet. För webben används srgb och för leverans till tryckerier etc så bör bilden ligga i arbetsfärgrymden Adobe RGB. Ligger bilden redan i rätt arbetsfärgrymd behöver den naturligtvis inte konverteras. För att konvertera, välj Bild- Läge- Konvertera till Profil (Image- Mode- Convert to Profile) Källfärgrymd (Source space): Det är här ni ser vilken arbetsfärgrymd ni arbetar i för tillfället. Målfärgrymd (Destination space): Det är här ni väljer vilken arbetsfärgrymd bilden ska konverteras till. Om bilden ligger i Adobe RGB och ni ska publicera denna bild på webben, välj då srgb i Destination Space. Då kommer bildens färger bli mycket lik den bild ni ser i Photoshop även när den visas i t.ex. Internet Explorer. Spara bilden i jpg format och komprimera lagom mycket så att den fortfarande ser bra ut, men blir så lätt som möjligt så att den laddar snabbt på webben. Nu är det bara att ladda upp bilden.