Format i veličina slike
- Croator
- 31/03/2022
- Digitalni marketing, Web development
- Facebook oglašavanje (Meta), WordPress
- 0 Komentari
Vizualni sadržaj je okosnica, vaše oružje u svijetu digitalnog marketinga kako bi se povezali sa vašom publikom. Bilo da gradite prekrasne web stranice, edukativne info grafike ili prodajete proizvode ili usluge online kvalitetna slika će biti temelj za gradnju vašeg uspjeha. Format i veličina slike će biti dio tog proces. Koji je problem u svemu tome? Izbor pravih veličina i formata slike može bit noćna mora. Ali bez brige, tu smo za tebe!
Format slike
Format i veličina slike su podjednako bitni, ali iz drugih razloga. Počnimo sa formatom slika pa ćemo se vratiti na veličinu kasnije u tekstu.
JPG/JPEG
JPG kratica stoji za “Joint Photographic Experts Group” i kreiran je davne 1986. Ovaj format zauzima jako malo mjesta, odnosno male je veličine stoga je idealna za brze upload i download procese. Primijetit će te da je velika veličina slika na društvenim mrežama upravo u .jpg formatu. Razlog za to je upravo relativno mala veličina datoteke. JPG podržava milijune boja i idealan je tip slike za fotkanje sa vašom kamerom ili mobitelom. Odlično rade na web stranicama, društvenim mrežama i većina uređaja s kojim kreirate fotografije ih spremaju upravo u .jpg formatu. JPG također ima “lossy” svojstvo. Za one koji nisu upoznati to znači da se slike mogu kompresirati što znači da su “nepotrebni” podatci zauvijek obrisani s fotografije prilikom konverzije u ovaj format ili kompresiranjem same slike. Prednost je manja veličina slike, ali nažalost to znaci da će fotografija izgubiti kvalitetu. Kada razmišljate o jpg formatu, možete si ga zamisliti kao osnovni format slika za “upload” na web. Osim ako trebate slike koje imaju prozirnu pozadinu, su animirane ili mogu mijenjati boju. Ali o tome dalje u tekstu.
GIF
GIF aka Graphics Interchange Format se pojavio na sceni 1987. U tim godinama nismo imali benefite optike, 4G i uskoro 5G tako da je slanje podataka znalo poprilično potrajati. GIF je u top vrijeme bio revolucija zbog male veličine i njegov transfer nije tražio puno “bandwith-a”. GIFovi su “lossles” što znači da se svo podatci zadržavaju u datoteci, ali su manji od JPGa, najčešće iz razloga što imaju do 256 boja. Jedna prednost GIFa je da se može animirati. Upravo iz tog razloga je vrlo korišten format na webu jer dodaje extra dimenziju i dinamičnost stranicama. Animirani GIFovi su relativno velike datoteka, ali se danas mogu kompresirati i dalje kvalitetno koristiti.
PNG
PNG ili ti ga Portable Network Graphic je izumljen nešto kasnije nego JPG i GIF. Star je samo 24 godine i izašao je na scenu 1995. godine. Ukoliko vam veličina datoteke nije primarna stvar i radite sa kompleksnijim slikama PNG je često najbolji izbor. Postoje dva formata PNG slika, PNG-8 i PNG-24. PNG-8 je sličan GIFu, u smislu da podržava samo 256 index boja, ali podržava i transparentnost slike. PNG-24 kao i JPG podržava do 16 milijuna boja. PNG se najčešće koristi kao statičke slike, kao recimo i JPG, ali podržavaju animaciju. Ranije sam spomenuo da PNG ima svojstvo transparentnosti. To znači da recimo možete imati sliku kojoj je pozadina bez boje, odnosno transparenta. Ukoliko ju postavite na obojanu pozadinu, vidjet će te tu pozadinu kroz PNG sliku. PNG je lossles, kao što smo rekli ne gubi podatke prilikom kompresije. Idealni su za deteljne grafike. Jedini je “raster” format koji podržava transparentnost od “velike četvorke”. Raster znači da veličinu slika možete mijenjati, laički rečeno razvlačiti. Negativna posljedica toga je degradacija pixela što znači da ukoliko “razvlačite” sliku ona gubi kvalitetu i postaje zamućena.
SVG
Zadnji format iz velike četvorke je SVG (Scalable Vector Graphics). SVG je format baziran na vektorima koji objavljen 2001. Najmoćniji je format i idealan je za web. Od ova četiri formata, SVG je jedini baziran na vektorima dok su prethodna 3 “raster” formati. Za razliku od “raster” formata SVG možete povećavati, smanjivati i prilagođavati koliko želite i uvijek će biti iste kvalitete. Razlog ovome su vektori, odnosno matematički deklarirani oblici, a ne pixeli. SVG uz to mogu biti animirani, podržavaju transparentnost i kombinacije boja, takozvane “gradients”. SVG je “lossles” i ovisno o kompleksnosti može biti manji ili veći od prethodnih formata.
I koji format odabrati? Pa kao što smo rekli na početku članka, to će ovisiti što je vaš cilj. Ukoliko radite uplaod slika na Facebook, Twitter ili Instagram, JPG je očiti pobjednik. Želite animiranu sliku na instagramu? GIF je taj. PNG će bit vrhunski izbor ako postavljaš kvalitetnu fotografiju u portfolio na web i uz to mora imati transparentnu pozadinu. Trebaš ikonu na webu koja će se morat prikazat u raznim veličinama. Onda je SVG tvoj izbor.
Tu je naravno i mnoštvo drugi formata. Više o njima ćemo u budućim postovima, ali evo kratak popis i razlozi korištenja.
TIFF (.tiff) Visoko kvalitetne slike koje se najčešće koriste prilikom printanja.
PSD (.psd) Svi koji rade sa photoshopom će biti dobro upoznati sa ovim formatom. U njemu su spremljene sve promjene koju su napravljene na slici tako da se uvijek možete vratiti, ponovno editirati ili vratiti na izvorni format.
Camera Raw ( .raw i .dmg ) Format najčešće korišten na fotoaparatima sa svim uhvaćenim podatcima. Idealan za profesionalce koji editiraju visokokvalitetne fotografije.
webP Novi format za web i idealan za web stranice. Zadržava kvalitetu fotografije i drastično manji od jpg i png formata. 26% manji od png lossles formata i 25%-34% manji od jpg lossy formata.
Veličina je bitna!
Uz format i veličina slike je važna kategorija. Veličina slika je izuzetno važna komponenta prilikom uploada vaših fotografija. Kada pričamo o web stranicama, izuzetno je važno da postavite točne veličine koje će te i prikazivati. Ukoliko recimo imate prevelike fotografije te će učiniti stranicu većom, što znači i sporijom. Isto tako, ukoliko se veličina slike mora prilagođavati u browseru, to negativno utječe na SEO te produžuje “load time” stranica. Sve to prednosti negativno na iskustvo korisnika, kao i na SEO vaše stranice. S druge strane, ukoliko koristite online platforme kao što su društvene mreže, OTA kanali, oni najčešće imaju specifičan format i veličinu koju smijete uploadat. Ukoliko se slika ne pridržava tih veličina, oni će ju sami kompresirati. Pitate se što je loše u tome. Pa prosječnom korisniku ništa, no ukoliko vodite poslovanje, važno vam je da su vaše fotografije najbolje moguće kvalitete. Ukoliko dopuštate Facebooku da vam kompresira slike, gubite kvalitetu nad verzijom slike koja će biti “postana” i postoji dobra šansa da će kvaliteta slike neadekvatna. Dalje u tekstu donosimo koje su veličine i formati koje najpopularnije online platforme koriste.
Web stranice
Po pitanju web stranica nema jednog točnog odgovora. Format i veličina slike koje će vam biti potrebna ovisit će o dizajnu i funkciji mjesta gdje ju koristite. Važno je da veličina odgovara onome što će browser pokazivati korisnicima kako bi se smanjio potreban promet za prikaz stranice i dodatni rad u pozadini koji usporavaju brzinu stranice. Najčešće će web stranice imati nekoliko verzija i veličina iste slike kako bi koristile optimalnu ovisno o veličini uređaja s kojeg se stranica gleda (Mobitel, desktop). Ovo je nešto o čemu najčešće vaš web developer vodi računa.
Sa preko 1.1 milijarde mjesečno aktivnih korisnika Facebook je najveća društvena mreža na svijetu. U RH Facebook je i najpopularnija i najkorištenija društvena mreža. Pretpostavljam da ste i sami korisnici i znate koliki potencijal ima kvalitetno uređena Facebook stranica pa se ajmo bacit na posao.
Instagram je jedna od najpopularnijih platformi za dijeljenje slika sa preko 600 milijuna korisnika. Najbolje je mjesto za prikazati svoju vizualnu kreativnost.
LinkedIn je najveća profesionalna društvena mreža sa preko 467 milijuna korisnika. Odlično je mjesto za pronaći odlične zaposlenike, prilike za zapošljavanje i povezati se s ljudima koji dijele tvoje interese.
Ako koristite ove smjernice, slike koje uplaodate na ove platforme će izgledati puno bolje i imat će te kontrolu nad krajnjim rezultatom..
Gdje pronaći kvalitetne slike?
Bilo za privatnu ili poslovnu upotrebu, najbolje je koristite vlastite visokokvalitetne slike. Uz to što osobno imamo mogućnost kontroliranja točno kako će slike ispasti imamo i benefit da su jedinstvene i da korisnici neće naići na iste fotografije na drugim web stranicama. Ipak, ako ste ikad imali obavezu kreirati fotografije za određena događanja ili vođenja društvenih mreža, znate i sami da kreiranje vlastitih visokokvalitetnih slika može uzeti dosta vremena, a ponekad i one same ne ispadnu na razini koju očekujemo. Stoga evo kratki vodič gdje možete naći odlične fotografije raznih formata i veličina koje su licencirane za korištenje, a koje i mi u Croator Web Studio koristimo.
Envato elements
Na Envatu možete pronaći mnoštvo sadržaja i digitalnih projekata. Uz to sve je i ogromna zbirka kvalitetnih fotografija.
Pixabay
Pexels je velika zbirka visoko kvalitetnih fotografija. Slike su često besplatne za korištenje.
Pexels
Uz ogromnu zbirku fotografija, na pixabayu možete pronaći i kvalitetne ilustracije, vektorske radove i videa.
Canva
Canva je primarno online platforma za uređivanje slika koju koristi uistinu velik broj korisnika. Jedan je od naših omiljenih alata za brzo kreiranje postova i ima ogromnu bazu slika, ikona itd…
Unsplash
Unsplash je besplatna zbirka visoko kvalitetnih fotografija.
Alati za editiranje
Sada kada imamo bazu, znamo sve o formatima slika, veličinama koje su nam potrebne te lokacije gdje nabavit te slike, vrijeme je da saznamo koje alate možemo koristiti za editiranje i optimiziranje slika. S ovima alatima možete mijenjati i format i veličinu slike. Mi u Croator Web Studio uz prijašnje navedenu Canvu koristimo Photoshop i Illustrator. Za ono što je nama potrebno, ovi alati su više nego dovoljni. Isto tako smo svjesni da si ne može svatko priuštiti korištenje skupih software stoga ćemo dalje navesti i besplatne kako bi vam bilo lakše započeti.
Canva
Ranije smo spomenuli da je Canva platforma sa zbirkom fotografija. E pa uz sve to, Canva je i vrhunski alata za rad na fotografijama, laka je za korištenje i dolazi i u besplatnoj i plaćenoj verziji. Stvarno vrhunski alat i za početnike i profesionalce.
Photoshop
Photoshop je alat profesionalaca i izuzetno je moćan software. Uz to nije baš najednostavniji alat za korištenje početnicima stoga ako se odlučite na njega, uđite u to sa puno strpljenja. Photoshop je plaćeni alat, možete dobiti besplatnu trial verziju na 7 dana da vidite jeste li za to.
Lightroom
Lightroom je, ajmo se tako izrazit, pojednostavljena verzija Photoshopa. Vrlo je moćan, brz, nešto lakši za korištenje i dolazi sa mnoštvom “presetsa” za brzo editiranje slika. Kao photoshop, možete se okušati sa trial verzijom prije nego krenete na pravu stvar.
Gimp
Gimp je besplatan software, i što je najvažnije pokriva sve 3 velike platforme. Gimp možete instalirati na Windows, Mac i Linux i početi editirati fotografije.
Paint
Ukoliko koristite Windows, sigurno ste naletjeli na Paint. Iako ograničen sa mogućnostima i dalje može poslužiti za osnovno uređivanje.
Mobilne aplikacije
Pixlr editor
Zaključak
Format i veličina slike su važne komponente u optimiziranju vaše online prisutnosti. Nadam se da ste izdržali s nama do kraja i da ste nešto naučili. Želja nam je Croator Web Studio pretvoriti u mjesto učenja i dijeljenja znanja i iskustava kako bi svima olakšali život u poduzetničkim vodama i online poslovanju.
Nadam se da će te nas nastaviti pratiti i ukoliko imate bilo kakvih pitanja i nejasnoća, ostavite ih u komentarima ili nas kontaktirajte osobno i rado ćemo vam pomoći.
Preporučujemo za čitanje
Ostavite komentar