Jak správně provozovat e-shop aneb na velikosti stránek záleží! I. díl

Jaká velikost stránek internetového obchodu je ta správná a proč na ní tolik záleží?

Celková velikost webové stránky by měla být co nejmenší, aby se rychle načítala a zobrazovala na předních pozicích ve vyhledávačích jako Seznam.cz, Google.com, Atlas.cz apod. V ideálním případě by neměla datová velikost stránky přesáhnout 650 kb. Mírný přesah rozměru stránek je tolerován, nicméně rozhodně by neměl přesáhnout hodnotu vyšší než 1000 kb, jelikož takovou stránku řadí vyhledávače na nižší pozice.

Ukázka správné velikosti jednotlivých souborů na webových stránkách

Na co je dobré dávat pozor

Nejčastějším problematickým prvkem bývají v tomto případě obrázky. Nezřídka kdy grafik webových stránek, popřípadě sám provozovatel e-shopu, zapomene na datové zmenšení neboli komprimaci obrázku. Obrázek velikosti několika set kilobajtů či jednotek megabajtů bývá vložen na web a k jeho úpravě dochází jen nastavením rozměrů (šířka a výška), aby byl zobrazován jako malý. V tomto okamžiku však nastává problém, jelikož se načítá plná velikost obrázků. Průměrná velikost obrázku vzhledem k barevnosti by u ikonek měla být cca 5 kb a u koláží cca 150 kb, mnohdy je však jejich skutečná velikost 10 krát i 100 krát větší! Proto je důležité upozornit grafika na to, aby při ukládání obrázků do kategorií či jinde do textu myslel na omezení jejich datové velikosti.

Kdy je potřeba obrázky komprimovat

E-shop systému FastCentrik komprimuje obrázky automaticky, nemusíte je tedy zmenšovat. Jiné je to však u obrázků vložených do administrace e-shopu prostřednictvím WYSIWYG editoru, kdy k automatické komprimaci nedochází (například koláž, logo a banner v hlavičce e-shopu nebo obrázky či fotografie vložené do těla článku apod.)! Je tedy nutné je před vložením do administrace datově zmenšit.

Ukázka správné datové velikosti obrázkových souborů na webové stránce

Nesprávné provádění změn CSS stylů může způsobovat další obtíže

Vytváříte si vlastní grafiku pro internetový obchod pomocí CSS stylů? V souvislosti se správnou velikostí stránek je potřeba dát si pozor na provádění změn v CSS souboru. Stává se, že provozovatel internetového obchodu upravuje CSS styly tak, že zkopíruje celý zdrojový CSS soubor a některá původní nadefinování stylů nahradí novými. To však s sebou přináší problém.

Ukázka nesprávně provedené úpravy stylů v CSS souboru

Jak správně provést úpravu stylů v CSS souboru

Pokud si vytváříte vlastní grafiku pomocí CSS stylů, nekopírujte obsah původního CSS souboru, ale vytvořte nový CSS soubor, který bude obsahovat pouze konkrétní úpravy stylů. Výsledná velikost datového souboru je tak mnohem menší, díky čemuž dochází i k rychlejšímu načítání stránky, což je důležité z hlediska zobrazování vašeho e-shopu na předních pozicích ve vyhledávačích typu Google.

Ukázka správně provedené úpravy stylů v CSS souboru

Tématu CSS souboru bude věnován také samostatný díl seriálu!

Jak zjistit velikost webové stránky

Existují nástroje určené pro každý prohlížeč, pomocí nichž je možné zjistit velikost stránek, většinou nainstalováním plug-inů. Takovýmto nástrojem pro prohlížeč Firefox je například Web Developer Toolbar, který si můžete si stáhnout na následující adrese: https://addons.mozilla.org/cs/firefox/addon/60. V záložce Informace se pak nachází možnost zobrazení velikosti dokumentu.

Ukázka možnosti zobrazení velikosti webové stránky

V příštím díle se dozvíte

Zaujal vás tento startovací díl našeho seriálu? Nenechte si tedy ujít druhý díl, ve kterém se již za týden zaměříme na tvorbu titulků stránek, popisky pro vyhledávače či klíčová slova.