Trošku netradiční článek, v kterém se zamyslím nad zrychlováním stránek. Zkusím tu popsat proč mě to baví a proč si myslím, že má něco takového smysl. Uvedu i pár, snad zajímavých čísel.

Nač nechat lidi čekat, když to není nutné?

Dalo by se říct, že tato věta je stěžejní v mém uvažování. Proč zkrátka nechat návštěvníky čekat, když stačí trochu snahy a stránky můžete mít rychlejší klidně o polovinu. Já jsem tento weblog podle měření zrychlil o 40 %. Slušný výsledek, ne? Skutečně není problém mít stránky rychlé jako blesk.

Navíc s rozmachem mobilního internetu, který běží většinou na 3G a dalších „pomalých“ sítích to jen zesiluje. Jsou i dokonce studie, které dokazují, že lidé toho (kupodivu) na rychlém webu stihnou více a tím tržby stoupají. I zde mám z dotazníku velmi dobré ohlasy, co se týče rychlosti této stránky.

Rychlý web má lepší pozice ve vyhledávačích

Tohle je něco, co bych tu chtěl uvést na správnou míru. Google před lety uvedl zprávu, že rychlost načítání stránek bude mít vlil na řazení ve výsledcích. Hned se objevilo plno článků a webů, které na tom chtěly těžit. Jenže to, že zlepšíte rychlost načítání stránky vám nezaručí dobré pozice. Je to něco, co by se mělo dělat pro návštěvníky, aby jim prohlížení webu bylo příjemnějším prožitkem. Stejně jako dobrý obsah či cokoliv jiného.

Neříkám, že snížení času potřebného pro načtení určité stránky nemá vliv na vyhledávaní. Jenže, když vezmu v potaz, že Google má takových pravidel třeba 230… dosáhnete zlepšení možná tak půl procenta, což není nic.

Jak začít, když chci zrychlit své stránky?

Rychlost načítání webové stránky je vždy určena tou nejpomalejší částí.

V prvním kroku bude nejlepší si o tématu něco přečíst. Zjistit požadavky (zda server podporuje potřebné moduly) a ujasnit si svá očekávání. Mé doporučené postupy jsou využívat gzip kompresi kde to jen jde, u neměnných souborů aktivovat kešování a až potom se zaměřit na obrázky a problémová místa. Jestli chcete optimalizovat obrázky ihned, pak určitě vyzkoušejte polský nástroj Kraken.

Posléze přichází na řadu hromada doporučení. K takovým patří třeba odebrání řetězce dotazu z CSS a JS, správné uspořádání souborů v kódu, zadávání rozměrů u obrázků a třeba asynchronní načítání skriptů, které stránka nepotřebuje k vykreslování. Takových článků typu „10 doporučení, jak udělat stránky rychlejší“ najdete na internetu tuny…

Nejčastěji opomíjené praktiky pro urychlení webu

Už dlouho jsem si chtěl udělat takový průzkum rychlosti stránek v praxi. Například kolik mých oblíbených stránek používá kompresi a tak podobně. A na to se v téhle části článku podíváme. Vzal jsem svých 30 nejčastěji navštěvovaných stránek a hodil jsem je do nejrůznějších online nástrojů, abych zjistil, jak si stojí. Níže si můžete prohlédnout, jak to dopadlo.

Četnost využívání gzip a kešování na stránkách mě prvně zklamala, ale je třeba brát v potaz, že ne každý své stránce v tomto ohledu věnuje pozornost. V podstatě mě to utvrdilo v tom, že nemá smysl vymýšlet pokročilé postupy, jak urychlit nějaké stránky, když většina webmasterů nevyužívá ani gzip.

Ukázalo se, že webové stránky nejsou v oblasti optimalizace obrázků tak pozadu a většina by šla optimalizovat „jen“ o několik desítek procent. Druhý graf už jen ukázal to, co se dalo čekat. Průměrné stránky by nebylo problém zrychlit i o 40 a více procent. Něco takového by bylo sakra znát, ale číslům se nedivím. Pro úplnost, k testování jsem použil tento srovnávací test.

Z posledního grafu je pak patrné, že datový objem je u více jak poloviny testovaných stránek mezi 200 a 800 kB. Což je v dnešní době cirka jedna vteřina stahování. To beru dost pozitivně a jsem s tím velmi spokojený.

Zajímavé nástroje pro komfortnější práci

Pokud se už rozhodnete na stránkách něco měnit, určitě těmito nástroji nebudete opovrhovat. Na internetu je podobných sice celá řada, ale snažil jsem se vyzdvihnout jen ty nejlepší.

• GIDZipTest je příjemný nástroj na rychlé otestování, zda stránka využívá gzip a kešování pomocí čtení z HTTP hlavičky.
• CSS Compressor vám pomůže snížit velikost CSS souborů smazáním mezer. Pro znovu čitelný kód můžete použít například PSPad.
• Smush.it je šikovný nástroj pro bezztrátovou kompresi obrázků. Velice s ním doporučuji optimalizovat veškeré webové obrázky.
• Pingdom Tools zobrazí pomocí sloupcového grafu analyzované stránky a seskupí o nich vše důležité do pár tabulek.

Jestli používáte i jiné nástroje, zkuste mi o tom dát vědět. Myslím ovšem, že tyto pro většinu prací budou stačit. Alespoň pro začátek.

A jaký byl záměr tohohle článku?

Chtěl jsem ukázat, že řešit rychlost stránek má i v dnešní době smysl, že to nemusí být vůbec těžké a jde bez obtíží dosáhnout znatelného zrychlení. Často lidi trápí, že jim jejich web přijde zoufale pomalý a neví, jak stránky zrychlit. Nebo netuší jaká část stránky vykreslování brzdí. Pokud tedy chcete s něčím podobným poradit, klidně napište do komentářů.

Doufám, že vám článek v něčem pomohl a přinejmenším ho budete brát jako takový zajímavý průzkum, jak si v současné době stojí stránky v oblasti zrychlování a kde mají ještě prostor na zlepšení.