Preskoči na sadržaj
BeoHosting
BeoHosting

10 min

Kako optimizirati slike za web

WebP, AVIF, lazy loading, CDN i srcset.

BeoHosting tim

10+ godina iskustva — Stručnjaci za web hosting i infrastrukturu

Posljednje ažuriranje:

Slike čine 60-80 % težine stranice. Njihova optimizacija je najveći jedan dobitak u performansama. WebP i AVIF smanjuju veličinu 25-50 % naspram JPEG/PNG bez vidljivog gubitka kvalitete, lazy loading odgađa nevidljive slike, srcset isporučuje pravu veličinu po uređaju.

Kako optimizirati slike za web

1

Pravi format — WebP/AVIF

WebP: 25-35 % manji od JPEG, podržan svugdje. AVIF: 30-50 % manji od WebP-a ali djelomično podržan — s WebP/JPEG fallbackom. PNG samo za transparentnost. SVG za logotipe i ikone.

2

Smanjite prije uploada

Nikad ne uploadajte 6000x4000 px DSLR za prikaz na 800 px. Smanjite na stvarnu × 2 za retina. Batch-skaliranje s FastStone Photo Resizer.

3

Komprimirajte pametnim alatima

WordPress: ShortPixel, Imagify, Smush, EWWW. Izvan: TinyPNG, Squoosh. Ciljajte 70-85 % JPEG kvalitete — vizualno identično kao 100 %.

4

Omogucite lazy loading

Native: <img loading="lazy">. WordPress 5.5+ dodaje automatski. Za starije preglednike Lazysizes JS. Lazy load odgađa nevidljive slike — veliki Core Web Vitals boost.

5

srcset za responzivne slike

<img srcset="img-400.jpg 400w, img-800.jpg 800w, img-1600.jpg 1600w" sizes="(max-width: 600px) 400px, 800px"> — preglednik bira veličinu. WordPress generira srcset automatski.

6

Isporuka preko CDN-a

CDN (Cloudflare, BunnyCDN) isporučuje slike s najbližeg servera — minus 50-200 ms latencije. Cloudflare Polish konvertira u WebP/AVIF u letu. BeoHosting integrira s QUIC.cloud za LSCache.

Spremni za pokretanje svoje stranice?

SSL zaštita
Brzina
24/7 podrška

Pridružite se 4.000+ zadovoljnih korisnika. Besplatna migracija i 15 dana jamstva povrata novca.

15 dana jamstva povrata novca
Besplatna migracija15 dana jamstva24/7 podrška

FAQ

Odgovori na najčešća pitanja o našim uslugama.

WebP je univerzalno podržan i smanjuje 25-35 %. AVIF je još manji (30-50 %) ali fali u starijim preglednicima. Optimalno: AVIF s WebP fallbackom, JPEG/PNG kao zadnja opcija.

Tipično: JPEG → WebP 30 %, PNG → WebP 40 %, WebP → AVIF 30 %. Uz skaliranje, 2 MB DSLR postaje 150-300 KB istog izgleda.

Ne — Google razumije native lazy loading. Samo pazite da above-the-fold slike NISU lazy load (treba ih učitati odmah za LCP).

ShortPixel za najbolji odnos kompresija/kvaliteta. Imagify drugi. Smush besplatan za osnovne. EWWW drži datoteke lokalno bez vanjskog API-ja.

Core Web Vitals su Googleovi pokazatelji korisničkog iskustva: LCP (Largest Contentful Paint — vrijeme učitavanja najvećeg elementa), CLS (Cumulative Layout Shift — vizualna stabilnost) i INP (Interaction to Next Paint — interaktivnost). Slike izravno utječu na LCP jer je najveći element na stranici najčešće upravo slika. Optimizirane slike s definiranim width/height atributima poboljšavaju i LCP i CLS.

Naša jamstva za vaš mir

Zaštićeni ste sa svake strane

15 dana jamstva

Vraćamo novac bez pitanja u prvih 15 dana.

Besplatna migracija

Mi prebacujemo vašu stranicu bez prekida — vi ne radite ništa.

24/7 podrška

Naši stručnjaci su tu 24/7 putem tiketa i live chata.