Advertisement
  1. Photo & Video
  2. Compression
Photography

Kako napraviti izvoz slika za Web u JPG formatu iz Adobe Photoshop Lightroom-a

by
Difficulty:BeginnerLength:MediumLanguages:

Croatian (Hrvatski) translation by Maja Petek (you can also view the original English article)

Možda najbolja stvar kod fotografiranja je dijeljenje i prezentiranje vaših radova sa drugima. Međutim, put do objavljivanja fotografije online može biti kompliciran. U ovom tutorijalu pokazat ću Vam kako uz najbolje rezultate napraviti izvoz slika obrađenih za web.

Ples kompresije

Bez obzira objavljujete li slike na web sajtu ili ih šaljete mailom obitelji i prijateljima, kompresija je neophodna. Izrada slika za web sa ograničenim kapacitetima znači da morate vagati između kvalitete i veličine slike. Kako se kvaliteta slike povećava, tako se povećava i veličina.

Jedan ključni dio dizajniranja za web je korisničko iskustvo (Tuts+ ima fantastičan kurs o UX dizajnu ako ste zainteresirani), ili da se na prvo mjesto stavi sposobnost da gledatelj ugodno pregledava i navigira kroz sajt. Brzo otvaranje stranice, koje je dijelom određeno veličinom dokumenta same web stranice, je velikim dijelom važno za korisničko iskustvo. Slike sada zauzimaju 62% ukupnog web prostora. Slike čija je veličina dokumenta mala, u velikoj mjeri pomaže da se stranice brzo učitavaju.

Kao fotografi, stalno pomičemo te granice. Želimo velike, veličanstvene fotografije. I premda želimo da nam slike izgledaju odlično na webu, ne želimo forsirati sporo učitavanje stranica nijednom korisniku. Ključ je u balansiranju.

Kada izvozimo slike za web iz Adobe Photoshop Lightrooma, moramo uzeti u obzir dva ključna aspekta: veličinu i kvalitetu.

Izvoz u Lightroomu

Prije nego što se bacimo na optimizaciju naših izvoznih dokumenata, pogledajmo malo osnove izvoza u Lightroomu.

Izaberite sliku

Kako bismo započeli izvoz, odaberite sliku ili nekoliko njih. Slike koje želim za izvoz, osobno preferiram odabrati sa filmske trake. Nakon što odaberete slike za izvoz, desnim klikom miša na Windows, ili ctrl + klik na Mac-u, odaberite Export > Export iz kotekstualnog izbornika.

Export export
Za izvoz slike, odaberite Export > Export iz kontekstualnog izbornika.

Nakon što započnete izvoz, pojaviti će se novi prozor sa raznim mogućnostima. Pogledajmo ključne postavke koje ćete odabrati za svaki izvoz.

Lokacija izvoza

Lokacija izvoza opisuje gdje će završene slike biti spremljene. Ukoliko želite sve slike spremljene u istoj mapi, možete odabrati mapu iz padajućeg izbornika i označiti "Put in the Subfolder" (stavi u podmapu).

Dodjeljivanje imena datoteci

Svaki izvoz može uključivati svoje reimenovane postavke. Ako se držite zadanih opcija, vaše će slike biti istog imena kao i originalne datoteke, ali spremljene kao standardni tip slike, odnosno kao JPEG. Također, možete označiti "rename to" ("preimenuj u") prozorčić i odabrati jedan od mnogih predložaka za preimenovanje koje Lightroom nudi za prilagodbu izvezenih slika.

File naming

Postavke datoteka

O panelu za postavke datoteka ćemo malo podrobnije diskutirati kada ćemo prilagođavati balans između kvalitete i veličine datoteke. Na ovdje prikazanom zaslonu su moji prijedlozi za svaku opciju:

  • Image format: gotovo uvijek JPEG, posebno ako ako su slike namijenjene za web
  • Color space: uvijek sRGB
  • Quality: ovaj vam slajder omogućuje da birate kvalitetu slike koja je izvezena; Nizak broj je niska kvaliteta, mala datoteka; povlačenje slajdera u desnu stranu povećava kvalitetu i veličinu datoteke
  • Limit file size to: Možemo također i odabrati "limit file size" opciju kako bismo spremljenoj slici odredili limit veličine datoteke
File settings

Određivanje veličine slike

Image sizing (određivanje veličine) je još jedan panel koji kontrolira veličinu naših slika. Izvezenim slikama možete odrediti dimenzije, baš kao što im možete odrediti i DPI.

Image sizing

Izvoz za Web

Kada se radi o ugađanju ravnoteže između veličine datoteke i kvalitete slike, ovo su ključne stvari o kojima treba voditi računa:

Veličina

Prvi korak efikasnog izvoza je uzeti u obzir veličinu slike na webu. Veličina slike je dimenzija piksela slike.

Kada vaše slike tek izađu iz fotoaparata, njihove su dimenzije ogromne. Na primjer, slike snimljene sa Canon 5D Mark III imaju do 5760 x 3840 piksela. Zaslon mojeg laptopa je samo 1440 x 900 piksela. Vidite li problem? Faktor je u činjenici da su web slike opet manje od širine naših monitora i potreba za promjenom veličine je savršeno jasna.

Image size
Možete prikazati izvorne dimenzije slike u Lightroomu pritiskom na "i" na tipkovnici. Prikazat će dimenziju piksela slike koju smo snimili. Možete ovdje vidjeti da će slike koje tek izađu iz kamere biti mnogo veće nego što je potrebno za web, gdje su slike najčešće 1000 pixsela širine ili manje.

Za tutorijale na Tuts+, naše su slike promijenjene u 600 piksela i maksimalna veličina datoteke je 200 kb. Time smo osigurali brzo učitavanje i, za većinu korisnika, to funkcionira sasvim u redu. Ako čitate ovu stranicu na smartphone-u, šanse su velike da se učitava prilično brzo, čak i ako imate sporu internet vezu.

Export - Long Edge
Meni najdraži način za izvoz slika iz Lightrooma je odabirom na "Resize to fit > Long Edge" opciju u dijaloškom okviru. To će smanjiti sve slike na 600 piksela na njihovoj najdužoj strani, neovisno o tome radi li se o portretu ili pejzažu. Druga je strana automatski izračunata. Ovo je odlična opcija kada radim izvoz za Tuts+, gdje su sve slike 600 piksela na najdužoj strani.

Kvaliteta

U savršenom svijetu, uvijek bismo imali mogućnost izvoziti slike u maksimalnoj kvaliteti. U stvarnosti, otkrivamo da izvoz slike maksimalne kvalitete nije uvijek poželjan. Na web stranicama, razlike u kvaliteti je često teško primjetiti, i to znači da možemo smanjiti kvalitetu malo, i veličinu datoteke povećati mnogo.

. Razlika u kvaliteti namještenoj između 90 i 100 je teško vidljiva, ali značajno povećava veličinu datoteke.

Web Quality Comparison
Gornja slika prikazuje razliku u kvaliteti kod različitih postavki na slajderu. Na najniže namještenoj kvaliteti, definitivno možete vidjeti neke linije. Što je veća kvaliteta, to je veća razina detalja na drveću i kući, ali na račun veće veličine datoteke kao što je vidljivo ispod.
Postavke kvalitete u Lightroom-u Veličina datoteke slike kod izvoza
25 91kb
50 122kb
75 168kb
100 366kb

Od gore ponuđenih rezultata, osobno bih vjerojatno odabrao postavke za izvoz od 75. Pravilno je pogođena ravnoteža između kvalitete i limita od 200kb veličine slike koje Tuts+ podržava.

Ulaganje profila za Web

Bitan korak kod provjere izvoza slika za Web je pravilan profil boja. Daniel Sone ima odličan članak na Tuts+ o opsegu boja, ali za potrebe izvoza u Lightroom-u, moramo se pobrinuti da uložimo sRGB profil boje.

Export with sRGB
Kada izvozim na Web, uvijek provjerim jesam li odabrao opseg boja "sRGB" kako bih dobio najbolji rezultat.

Unaprijed postavljene postavke za izvoz

Čak i kada izvozimo za web, postoji mnogo različitih scenarija koji utječu na postavke. Iako najčešće težimo tome da optimiziramo veličinu datoteke, postoje situacije kada su potrebne veća kvaliteta i veća rezolucija slike. Zato nam već unaprijed postavljene postavke (presets) mogu biti nevjerojatno korisne; možete napraviti nekoliko različitih opcija i koristiti ih za različite veličine.

U prozoru za izvoz (export), snimanje vaših trenutnih postavki za izvoz datoteke je vrlo lagano. Nakon što ste odabrali sve postavke za izvoz, kliknite "+" gumb i spremite vaše unaprijed postavljene postavke za slike koje su već spremne za web.

Save Export Preset
Nakon što ste dodali resize (promjenu veličine) i postavke kvalitete, ne zaboravite snimiti "Export Presets" klikom na Add. Snimiti će se sve vaše postavke; preporučam da ih napravite nekoliko za različite mete na webu.

Zaključak

U ovom tutorijalu naučili ste ono što se najviše prakticira i dobili uvid u najefikasniji način za izvoz slika na web. Komprimiranje slika za web omogućuje korisnicima da ih brzo učitaju. Uz pravilne postavke možemo postići visoku kvalitetu.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.