Najnoviji članci na blogu

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...

Objavljeno: Avg 06, 2020
Kako da optimizujete slike na svom sajtu
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/1200x634 1200w, //imesajta.com/700x370 700w, //imesajta.com/340x180 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" />

E-mail bilten *

Upišite vašu email adresu i dobijaćete najnovije informacije, savete i promocije u vaš email inbox.