Kako da optimizujete slike na svom sajtu
Tihi ubica sajtova – tako bismo danas mogli da opišemo grafičke elemente na sajtovima i to, pre svega iz najvažnijeg razloga, zbog drastičnog uticaja na brzinu učitavanja sajtova. Još ukoliko grafika nije optimizovana…
Današnja izrada sajtova, portala i internet prodavnica uključuje korišćenje značajne količine grafičkih elemenata i na internet developerima je da pronađu najefektivniji odnos količine slika i brzine učitavanja samog sajta.
Rangiranje sajtova na pretraživačima značajno danas zavisi od brzine učitavanja sajta i, ukoliko znamo da grafički sadržaji čine 66% ukupne “težine“ web stranice (Google) i da sporijim učitavanjem internet stranice od samo 1s kompanija izgubi na godišnjem nivou i do 16 milijardi $ prihoda (Amazon), optimizacija slika na sajtu dobija na ogromnoj važnosti.
Zašto izvršiti optimizaciju slika
Najvažnije prednosti optimizacije:
- Poboljšaće brzinu učitavanja stranice – ukoliko se vaša internet stranica predugo učitava, posetioci će izgubiti strpljenje i preći na nešto drugo.
- Poboljšaće celokupnu optimizaciju sajta za pretraživače (SEO) i vaša web lokacija biće rangirana značajno više u rezultatima pretraživanja. Velike datoteke usporavaju učitavanje stranica, a pretraživači jednostavno ne vole spore sajtove. Google će gotovo sigurno brže indeksirati i vaše slike za svoju Google Images pretragu slika.
- Zauzimaće manje prostora na vašem serveru ili u okviru vašeg web hosting paketa
- Trošiće manje saobraćaja na stranicama, što će mreža i internet pregledači dodatno ceniti
- Stvaranje rezervnih kopija biće brže
Formati slika za web
Prilikom postavljanja slika na vaš sajt, veoma su važni formati koji su najefikasniji na Internetu:
- JPG – najkorišćeniji format na Internetu, daje najbolji odnos kvaliteta i brzine učitavanja
- PNG – odličan kvalitet slika, ali u isto vreme i značajno veće datoteke.
- GIF – praktično, zastareli format fotografija, danas se koristi uglavnom za kratke animacije
Pojavili su se i napredniji formati slika – JPEG XR i WebP, ali trenutno se ne preporučuju jer ih (još) ne prihvataju svi internet pregledači.
Optimizacija uz pomoć web servisa i programa
Pre postavljanja bilo kog grafičkog elementa na sajt, preporučljivo je izvršiti optimizaciju uz pomoć nekog od profesionalnih alata i programa koje možete pronaći na Internetu. Lista programa:
- GIMP
- Adobe Photoshop
- Affinity Photo
- JPEG Optimizer
- Optimizilla
- FileOptimizer
- ImageOptim
- Kraken.io
- ImageRecycle
- CompressNow
- Trimage
- PicMonkey
Optimizacija na samoj stranici uz pomoć srcset atributa
Jedan veoma koristan atribut koji se koristi prilikom samog programiranja (kodiranja) sajtova je srcset. Korisnici WordPress-a imaju mogućnost korišćenja od verzije 4.4 i ovaj atribut predstavlja automatsko kreiranje nekoliko verzija (veličina) slika i u zavisnosti od dostupnih veličina u okviru srcset atributa, internet pregledači samostalno prikazuju najefikasniju sliku za trenutnu rezoluciju ekrana.
srcset=“//imesajta.com/1200×634 1200w, //imesajta.com/700×370 700w, //imesajta.com/340×180 340w“
Osnovni korak optimizacije
Naravno, osnovni korak optimizacije predstavlja upisivanje ALT taga u okviru slika na vašem sajtu – ovim tagom govorite Google-u šta se nalazi u okviru IMG taga
<img src=“/slike/ime.jpg“ alt=“opis slike – upišite što detaljniji opis u cilju optimizacije“ />