Priprema slika za web – velika je i kompleksna tema kojom se bavi većina tekstova na blogu. U ovom tekstu pokušaću da dam uputstvo koje je maksimalno pojednostavljeno.
Podrazumeva se da slike već imate a ja ću predložiti alat i najjednostavnije korake da dođemo do solidnog rezultata.
Alat koji koristimo je odličan, besplatan i jednostavan za korišćenje. Radi na sva tri glavna operativna sistema (Windows, MacOS, Linux). Instalacija je standardna a pretpostaviću da je za prosečnog korisnika dovoljno da postavim link do stranice programa gde možete izabrati verziju za vaš operativni sistem.
Izgled stranice sa koje preuzimamo program, možete videti na slici ispod. Ovo je rezultat posle tri operacije opisane u tekstu ispod slike. Ova „finalna“ slika je velika svega 18 kB, rezolucija 920 x 504 pixela i sačuvana je kao .webp datoteka.
Priprema slika za web – Proces rada u tri koraka
Redosled poslova je:
- Kropovanje (Crop) – odsecanje viškova sa slike
- smanjivanje rezolucije (resize)
- Izvoz u novi grafički format – .webp
Sliku samog ekrana (Screenshot) sa stranicom ovog programa koristićemo kao sliku za primer u ovom uputstvu. Originalna slika ekrana je u HD rezoluciji (1920 x 1080), dataoteka je u .png formatu, velika 354 kB i ima malo „viška“ koji hoćemo da isečemo sa konačnog prikaza.
Korak 1 – odsecanje viškova
Na originalnoj fotografiji postoje delovi koji nam nisu potrebni. U ovom koraku upotrebom alata za isecanje (crop) označićemo deo koji želimo da sačuvamo. Deo izvan ovog okvira biće odbačen.
Korak 2 – smanjivanje rezolucije
Posle prvog koraka naša datoteka više nije u rezoluciji 1920×1080. Njena nova rezolucija je 1420 x 778 pixela. To je i dalje nešto više nego što nam je za željenu sliku potrebno.
Sada radimo u istom programu, drugi korak. Odmah pored dugmeta za kropovanje nalazi se dugme resize. Na slikama ispod to su prva dva dugmeta na vrhu levo.
Klik na dugme resize otvara nam prozor za dijalog (desno) gde treba da upišemo željenu novu rezoluciju. Pošto je podrazumevano uključeno da se zadržava odnos strana dovoljno je izabrati jednu stranicu a drugi broj podešava sam program. Ovde konkretno broj 1420 menjamo u željenu novu širinu 920 px.
Pritiskom na OK, završen je i ovaj korak. Ostaje nam samo još…
Korak 3 – export i čuvanje fajla u željenom formatu
Prečicom Ctrl+ Alt + S ili pritiskom na dugme export (file -> export) dobijamo sledeći prozor. Izborom kao na slici, dobićemo naš finalni rezultat. U ovoj fazi važno je i da ispravno imenujemo našu fotografiju. za imenovanje koristimo mala slova ošišane latinice sa crticama umesto razmaka.
Priprema slika za web – zaključak
Primenom ovog jednostavnog uputstva nećete postati ekspert za grafički dizajn, ali uz malo vežbe možete napredovati do sasvim korektnog kreatora sadržaja.
Najvažnije je da vaše slike posluže svojoj nameni a da pritom nisu izvor problema. Pravilna priprema slika čini korišćenje vašeg sajta ugodnim, posetioci ne napuštaju stranice zbog sporosti a pretraživači će znati da vrednuju svaku optimizaciju.