Kako optimizirati slike za WordPress?
Slike so eden najpomembnejših delov vsake spletne strani. Spadajo tudi med elemente, ki zasedejo največ prostora na strežniku in posledično lahko upočasnjujejo delovanje spletne strani. Če svojo stran preverite z orodjem, kot je na primer PageSpeed Insights, obstaja velika možnost, da boste po opravljeni analizi zagledali sporočilo:
“Optimizirajte naslednje slike, da zmanjšate njihovo velikost za 240 kb (zmanjšanje za 85 %).”
Sporočilo vas opozarja, da na spletni strani uporabljate slike, ki imajo drugačno dimenzijo, kot je predvideno za vašo grafično predlogo. Do tega pride, ker se velikost slike prilagodi predlogi, tako da se poveča ali zmanjšana.
Za primer vzemimo, da vaša grafična predloga na podstrani zahteva naslovno sliko v velikosti 800 x 450 slikovnih pik, vi pa naložite sliko v velikosti 1600 x 900 slikovnih pik. Posledično bo iskalnik naložil sliko v polni velikosti in jo potem naknadno zmanjšal na velikost, ki jo uporablja vaša grafična predloga. Ta proces zahteva dodatne strežniške vire, da se posamezna slika naloži. Rezultat je počasnejše delovanje spletne strani.
Težavo predstavljajo tudi prevelike slike, ki na strežniku zasedejo več prostora, kot bi ga, če bi bile ustrezno stisnjene. Tudi to je razlog za počasnejšo spletno stran. Slike lahko stisnete z orodjem kraken.io ali tinyjpg.com.
Prilagodite slike
WordPress ima prednastavljene velikosti za prikazovanje ikon, srednjih in velikih slik ter slik v polni velikosti. Večina grafičnih predlog ima prednastavljene naslednje velikosti:
- ikone: 150 x 150 px,
- srednje velike slike: 300 x 300 px,
- velike slike: 1024 x 1024 px.
V kolikor želite prilagoditi svoje slike zgoraj omenjenim velikostim, to lahko naredite v nekaj korakih:
1. Najprej se vpišite v svoj WordPress uporabniški račun.
2. Poiščite rubriko Mediji (ang. Media) in izberite Knjižnica (ang. Library).
3. Označite sliko, ki jo želite urediti, in kliknite na Uredi sliko (ang. Edit Image)
4. V novo odprtem oknu lahko prilagodite velikost slike, da bo ustrezala vaši grafični predlogi.
Dodatno lahko nastavite tudi razmerje slike (ang. Aspect ratio), na primer 1:1, 4:3 ali 16:9.
Ko uredite velikost in razmerje slike, izberite, ali sprememba velja za ikone, srednje ali velike slike, ali vse našteto. Na koncu kliknite na gumb Shrani (ang. Save).
In kaj narediš čez 3 leta, ko bodo popularni UltraHD ekrani in bodo slike premale? Vse slike naložiš ponovno v večji resoluciji?
Žal je res tako, kot ste napisali. Članek bazira na tem, da ima stran težave s prikazovanjem prevelikih fotografij. Pravilna rešitev bi bila sprememba v temi, da bi le-ta uporabljala “predefined” velikosti (thumbnail, medium ali celo po svoje določeno velikost). A ker večina WP uporabnikov nima zadostnega znanja za take posege, je to začasna rešitev. Z uporabo “predefined” velikosti preprečimo, da se povozi originalna slika. Poleg tega prepustimo WP-ju, da sam upravlja srcset atribut. Ta omogoča, da brskalnik sam določi, katera velikost slike mu najbolj ustreza.