Optimalizace obrázků pro e-shop na platformě Upgates: Rychlost a kvalita v praxi
Obrázky na e-shopu nejsou jen hezká omáčka kolem produktu. Ovlivňují rychlost načítání webu, SEO, zážitek zákazníka i konverzní poměr. Na platformě Upgates máte k dispozici hned několik možností, jak s obrázky pracovat efektivně — a přitom bez složitých technických zásahů.
Pojďme se podívat, co znamená „optimalizovat obrázky“ a jak na to přímo v systému Upgates.
Správný formát: WebP a další možnosti
Na Upgates je možné používat běžné formáty jako JPG, PNG, SVG, GIF nebo WebP. Pro produktové fotografie je ideální formát JPG – nabízí dobrou kvalitu při nízké velikosti souboru. Pokud potřebujete obrázek s průhledností nebo ostrou grafikou, doporučujeme PNG. Formát SVG je vhodný zejména pro loga a ikony, protože zůstává ostrý při jakémkoli rozlišení. Moderní WebP spojuje výhody JPG a PNG – má menší velikost a zároveň si uchovává kvalitu, pokud je jeho podpora na platformě zajištěna. Naopak GIF dnes většinou nedává smysl a je vhodné se mu vyhnout. Jedna nevýhoda WebP zde ale je, a to, že jej nepodporují některé externí nástroje, jako je například srovnávač Heureka.
Výhoda pro vás: WebP sníží datovou velikost obrázků, aniž by to zákazník vizuálně poznal. Web se načítá rychleji a vy nemusíte nic nastavovat ručně.
Rozměry obrázků: Nahrajte tak akorát
Upgates zajišťuje automatické přepočítání velikostí obrázků max. 1000px na výšku nebo šířku. I přesto je dobré:
- Nenahrávat zbytečně velké fotky (např. 5000 px na šířku),
- Udržet velikost pod cca 500–1000 kB na obrázek,
- Před nahráním provést základní úpravy ve vašem editoru (např. Canva, Photoshop, Affinity).
K této kompresi nedochází, pokud přidáváte soubory do složky „Grafika“, která je určena přímo pro grafické prvky e-shopu, kde by byla komprese nežádána.
Komprese: Zmenšete bez ztráty kvality
Před nahráním do administrace doporučujeme obrázky zkomprimovat pomocí nástrojů jako:
Využijte hromadné úpravy obrázků (např. pomocí XnConvert), pokud máte rozsáhlý sortiment.
Alternativní texty (alt tagy) a názvy souborů
V Upgates můžete ke každému obrázku přiřadit alternativní popis, který slouží:
- pro SEO,
- pro přístupnost (např. čtečky),
- a jako náhrada při nenahrání obrázku.
Kde to najdete: V administraci produktu → záložka Obrázky → možnost Upravit název → Titulek
Doporučení:
Název souboru i alt text by měl popisovat produkt, např.
kozena-penezenka-hneda.jpg a alt="Kožená peněženka z pravé hovězí kůže, barva tmavě hnědá"
Lazy loading: Načítání jen toho, co zákazník vidí
Upgates implementuje tzv. lazy loading automaticky v šablonách. To znamená, že se obrázky načítají až ve chvíli, kdy se mají zobrazit — třeba při scrollování. Výsledkem je rychlejší načtení první obrazovky a lepší dojem pro zákazníka.
Rychlé načítání díky optimalizované infrastruktuře
Platforma Upgates zajišťuje, že se obrázky a další obsah načítají rychle napříč různými zařízeními i regiony. Pomáhá tomu optimalizované zpracování souborů na serverech a chytré cachování
Výsledek? E-shop je svižný a zákazníci nemusí čekat, než se jim načte produktová fotka nebo banner na úvodní stránce.
Testování rychlosti: Zkontrolujte si to
Občas se vyplatí ověřit, že vše funguje, jak má. Použijte nástroje jako:
- Google PageSpeed Insights
- GTmetrix
- WebPageTest
Pokud zjistíte, že váš web je pomalý, často za to mohou právě příliš velké nebo nekomprimované obrázky.
Závěrem
Optimalizace obrázků na e-shopu na Upgates je jednoduchá, když víte, co hledat. Mnoho věcí systém řeší automaticky — cache, formáty, lazy loading, načítání optimalizované podle zařízení. Ale pořád zůstává prostor, kde to máte ve svých rukou: velikost nahrávaných souborů, správný název, alt text nebo komprese před nahráním.
Pamatujte: rychlejší web znamená spokojenější zákazníky — a větší šanci, že dokončí objednávku.
