3 jednoduché metódy na efektívnu optimalizáciu webových obrázkov
40% ľudí opúšťa web, ktorý sa načítava ťažšie ako 3 sekundy, a každá získaná sekunda zvyšuje konverzný pomer o 7% a lepší zážitok.
Chýbajúca optimalizácia obrazu je hlavným faktorom, pre ktorý sa stránka ťažko načítava. Naučte sa, ako efektívne optimalizovať svoje fotografie a zverejniť ich na svojom webe pomocou kompresie, zmeny veľkosti a optimalizácie SEO. Okrem toho môžete na serveri ušetriť až o 70% viac miesta.
# 1. Kompresia obrázkov - načítajte stránky až o 40 až 70% rýchlejšie
Je to najdôležitejší proces optimalizácie obrázkov s ešte vyššou hodnotou ako zmena veľkosti obrázkov. Ak je váš web navyše hlavne vizuálny, môžete ušetriť 50% miesta na serveri a šírku pásma spotrebovanú každý mesiac.
Čo je to kompresia/kompresia obrazu
Cieľom kompresie obrazu je vylúčiť informácie o type použitého fotoaparátu, objektíve, zaostrení, autorovi a mnohých ďalších detailoch. Súčasne existuje proces kompresie a optimalizácie kvality obrazu bez viditeľných strát kvality.
Po odstránení údajov, ktoré nepotrebujeme, sa kompresia obrázkov zameriava aj na optimalizáciu kvality obrazu bez výraznej straty kvality.
Prečo je užitočné komprimovať obrázky
Kompresia fotografií sa zníži až o 40% veľkosti už spracovaných fotografií. Napríklad ak pre svoj blog použijete Dreamstime.com alebo 12 ďalších bezplatných webových stránok s obrázkami, môžete z každého obrázka uložiť v priemere 30 - 40%.
V prípade fotografií z fotoaparátu kompresia ušetrí až 70%. Kompresia tak zmenšuje veľkosť obrázkov, čo je užitočné ako pre rýchlejšie načítanie stránok, tak pre úsporu miesta na serveri a môže byť pre vás obzvlášť zaujímavé, ak sú vaše stránky určené na turistiku, kulinárstvo, dizajn alebo väčšinou vizuálne.
Metódy kompresie
Existujú dve hlavné možnosti: keď používate platformu WordPress, môžete si nainštalovať doplnok TinyJPG, akýkoľvek nahraný obrázok sa automaticky komprimuje. Ak máte webové stránky úplne od začiatku alebo chcete iba komprimovať obrázky, môžete použiť online verziu tinyjpg.com.
Metóda 1: Komprimácia obrázkov pomocou adresy tinyjpg.com
39% kompresia pre 5 obrázkov na Dreamstime.com.
79% kompresia, pre 5 fotografií z fotoaparátu.
Môžete ťahať a pustiť až 20 obrázkov súčasne a za pár sekúnd sa ich veľkosť výrazne zmenší.
online stránka
drag and drop
Zníženie veľkosti obrazu o 40-80%
Momentálne vyskúšajte fotografiu, aby ste videli presné percento, ktoré môžete ušetriť.
Metóda 2: Automatická kompresia obrázkov pomocou pluginu WordPress TinyJPG
Doplnok WordPress
plne automatický proces
Zníženie veľkosti obrazu o 40-80%
Porovnávacia dátová verzia VS online verzie
Ukázalo sa, že doplnok WordPress je efektívnejší, a to jednak lepšou kompresiou, okrem online verzie aj úsporou niekoľkých kB, ako aj úsporou času, ktorý je automatický pri nahrávaní obrázkov na web:
Originál 325,5 kB: 142,2 kB - tinyjpg.com, 125 kB - WordPress
Originál 208 kB: 86,6 kB - tinyjpg.com, 85 kB - WordPress
133,7 kB pôvodných: 100,1 kB - tinyjpg.com, 98 kB - WordPress
162,4 kB pôvodných: 128,5 kB - tinyjpg.com, 119 kB - WordPress
Originál 256,2 kB: 208,4 kB - tinyjpg.com, 203 kB - WordPress
# 2. Zmeňte veľkosť obrázkov
Zmena veľkosti obrázka sa týka zmenšenia rozmerov vyjadrených v pixeloch, šírke a výške. To tiež vedie k zmenšeniu veľkosti obrázka v kB (kilo návnad). Po zmene veľkosti je nevyhnutná aj kompresia, čo vedie k výraznému zmenšeniu fotografie.
Zmeňte veľkosť obrázkov online
Svoje fotografie môžete meniť tak, ako sú nasnímané z fotoaparátu, na adrese picresize.com.
Zmeňte veľkosť offline fotografií
Na zmenu veľkosti offline fotografií môžete použiť bezplatný softvér PIXresizer
Aká je optimálna veľkosť pre môj blog?
Optimálna veľkosť sa líši podľa témy a stránky.
Ak chcete zistiť presnú veľkosť WordPress, prejdite na stránku, kde je obrázok zverejnený, a kliknite na Upraviť obrázok> Detaily obrázka> Veľkosť> Veľký.
Tu nájdete zadanú veľkosť, ktorá zodpovedá zvolenej téme a môže sa pohybovať od 600 do 1024 pixelov. Prístupom k analytickým údajom môžete vidieť špecifiká vašich návštevníkov vrátane rozlíšení, z ktorého pristupujú na vašu stránku. S najväčšou pravdepodobnosťou viac ako 55% používa mobilný telefón.
Ideálna veľkosť: 768 pixelov
Väčšina tém WordPress používa rámec Bootstrap. Rovnako tak sú aj prezentačné weby vyrobené po roku 2015. Bootstrap pomáha vytvárať responzívne weby a má bod prechodu z mobilu do tabletu so šírkou 768 pixelov.
Táto veľkosť je dostatočná na zobrazenie obrázkov blogu so štruktúrou dvoch stĺpcov a jedného, a to na mobilných zariadeniach aj tabletoch, laptopoch a počítačoch. Ak váš motív nemá obrázky na pracovnej ploche v plnej šírke alebo iné špeciálne požiadavky, potom veľkosť 768px predstavuje veľkosť, ktorá vám pomôže dosiahnuť maximálnu optimalizáciu.
# 3. Optimalizácia obrazu pre SEO
Pre každý zverejnený obrázok môžete prispieť k optimalizácii stránky a tiež k zobrazeniu v obrázkoch Google.
Dôležitosť obrázkov
Fotografie musia podporovať to, čo ste povedali v názve a obsahu stránky. Pre čitateľov aj pre Google, ktorý má v súčasnosti celkom dobrú predstavu o tom, čo je to fotografia.
Premenovanie obrázkov
Keď nájdete správny obrázok, je užitočné zmeniť jeho názov. Namiesto 38732145_IMG môžete dať slová, pre ktoré chcete byť optimalizovaní, napríklad optimizare_imagini_web.jpg v prípade tohto článku.
Atribút ALT
Je to atribút, ktorý Google oceňuje, ak obrázok nie je k dispozícii, zobrazí sa tento text. Zrakovo postihnutí ľudia sa navyše dozvedia viac informácií o obrázku.
Atribúty Názov, Zachytenie, Popis Ak používate platformu WordPress, môžete ľahko vyplniť tieto atribúty a poskytnúť tak viac podrobností o svojej fotografii.
Záver
Zvýšenie rýchlosti načítania stránky vedie k lepšiemu zážitku, zvýšeniu konverzného pomeru, retencii a návratu na stránku. Každá získaná sekunda zvyšuje konverzný pomer o 7% a lepší zážitok.
Fotografie pridávané na webové stránky sú často nespracované, čo je hlavným faktorom, prečo sa stránky ťažko načítajú. Aj pri použití už spracovaných fotografií môžete dosiahnuť výrazný pokles.
Efektívna optimalizácia obrazu má na pamäti 3 aspekty:
1. kompresia, prostredníctvom ktorej môžete dosiahnuť 40 - 70% zníženie veľkosti obrázka v KB.
2. Zmeňte veľkosť a poskytnite obrázky v rozmeroch svojej témy alebo webu v pixeloch.
3. SEO optimalizácia, pomocou ktorej môžete prilákať relevantnú návštevnosť.
Použitím týchto vecí, pre ktoré nepotrebujete technické znalosti, môžete výrazne zvýšiť rýchlosť načítania vášho webu, ušetriť miesto na serveri a rozšíriť vyhľadávanie Google. Príjemný zážitok z prehliadania navyše priťahuje spokojných návštevníkov.
Prihláste sa na odber noviniek, kurzov a zliav priamo do vašej doručenej pošty