2 Hľadáme nových kolegov. Pridajte sa k nám.

Na našich stránkach používame súbory cookies. Pomáhajú nám vylepšovať web a služby. Pokračovaním súhlasíte so zberom dát.

Ako zvýšiť rýchlosť načítania stránkyAko zvýšiť rýchlosť načítania stránky
Tipy a triky

Ako raketovo zlepšiť rýchlosť načítania vašej webstránky

Máte alebo spravujete niekomu webstránku? Pokiaľ chcete vašou stránkou osloviť svojich návštevníkov, je dôležité, aby sa im stránka načítala dostatočne rýchlo. Nechcete predsa nechať návštevníkov čakať, a riskovať tak ich odchod.

Ešte v roku 1999 by vám pomalú stránku návštevníci tolerovali. Štatistiky z tej doby ukazujú, že ľudia boli kedysi ochotní čakať až dlhých 8 sekúnd na načítanie stránky.

V dnešnej dobe to takto, žiaľ, nefunguje. Dobrý čas načítania stránky je do dvoch sekúnd a ideálne ešte menej.

Tri sekundy sú stále dobré, no pokiaľ je to dlhšie, potrebujete vedieť, čo spomaľuje vašu stránku.

Ak by ste to ignorovali, mohlo by vás to negatívne ovplyvniť.

Dajme tomu, že máte eshop. Pokiaľ načítanie vašej eshopovej stránky trvá 4 sekundy a viac, riskujete tak zvýšenie odchodu svojich potenciálnych zákazníkov o 87%. A to platí aj v prípade, že vaši potenciálni zákazníci mali už vo svojich košíkoch vložené produkty.

Podobne to platí aj v prípade firemných stránok alebo blogov. Ak sa vám stránka bude pomaly načítať, vaši návštevníci nebudú čakať a radšej pôjdu inam. Potenciálne tak môžete každý mesiac strácať niekoľko stoviek až tisíc návštev.

Aby ste sa vyhli tejto situácii, v tomto článku pre vás máme konkrétne tipy, ako zvýšiť rýchlosť načítania vašej stránky.

Ešte predtým si však treba zmerať, ako rýchlo sa vám web načíta.

 

Nástroje na zisťovanie a analýzu rýchlosti načítania vašej webstránky

 

GTMetrix

 

Prvým nástrojom, ktorý môžete použiť, je GTMetrix. Ide o bezplatný nástroj, ktorý vám dokáže odmerať rýchlosť načítania vašej stránky, ale zároveň vám poskytne aj 30 konkrétnych spôsobov, ktorými môžete zlepšiť rýchlosť a výkon webovej stránky.

 

PageSpeed Insights

 

Druhým užitočným nástrojom je PageSpeed Insights od Googlu. Ak chcete tento nástroj použiť, stačí do políčka zadať vašu webovú stránku a následne ju dať analyzovať. PageSpeed Insights vám vygeneruje skóre rýchlosti jej načítania, ako aj diagnostiku a príležitosti, ktorými viete zrýchliť načítanie stránky.

 

Pingdom

 

Funguje na rovnakom princípe ako predchádzajúce nástroje. Avšak pri zadávaní stránky je potrebné vybrať si oblasť, odkiaľ chcete test vykonať. Môžete si výsledky ukladať do histórie, porovnávať novšie a staršie testy.

Ak máte stránku na Slovensku pri použití tohto nástroja zvoľte v položke test from jednu z lokalít: Europe-United Kingdom-London alebo Europe-Germany-Frankfurt. S nimi budete mať najpresnejšie merania pre oblasť Slovenska.

 

Webpagetest

 

Na rovnakom princípe ako Pingdom analyzuje a vyhodnocuje webové stránky. Ponúka však dve odlišnosti oproti ostatným nástrojom. V prvom rade si viete vybrať zo širokej škály miest odkiaľ chcete test vykonať a taktiež aj na rôznych prehliadačoch.

Ak zistíte, že vaša webstránka sa načíta pomaly, pripravili sme pre vás tipy, ako zrýchliť rýchlosť načítania stránky.

 

Vplyv webhostingu na rýchlosť načítania stránky

 

Webhosting patrí k faktorom, ktoré najviac ovplyvňujú rýchlosť načítania stránky. Funguje tak, že keď zadáte webovú stránku do prehliadača, vyšlete príkaz vzdialenému počítaču (serveru), na ktorom je webová stránka umiestnená.

Takto dochádza k sprístupneniu a zobrazeniu požadovanej stránky. V tomto prípade platí, čím je server výkonnejší, tým rýchlejšie sa vám požadovaná stránka načíta.

 

Výkon servera ovplyvňujú:

  • Dedikované zdroje – každý server má svoj určitý výkon (RAM – pamäť; CPU – procesory). V prípade zdieľaného hostingu si výkon servera navzájom “zdieľa” viacero webstránok. Na virtuálnom serveri (VPS) si už môžete nakonfigurovať prostriedky servera podľa svojich potrieb a nemusíte sa o výkon servera s nikým deliť.
  • Prepojenie – aby sa vám akákoľvek stránka načítala, potrebuje prístup k databázam a ďalším zdrojom. Tieto zdroje by mali byť ideálne na jednom serveri, pretože tak dochádza k rýchlejšiemu prepojeniu a komunikácií medzi nimi. Ak sú rozdelené na viacerých serveroch, načítanie môže byť pomalšie, ak nie sú nastavenia správne.
  • Rýchly hardware – z novších SSD diskov sa dáta načítavajú oveľa rýchlejšie ako z klasických HDD.

 

Kompresia webovej stránky pomocou gzip

 

Nástroj gzip vám umožní kompresiu súborov stránky do zip súborov z vašej webovej stránky. Jeho použitím následne dôjde k rýchlejšiemu načítaniu webovej stránky.

 

Kompresia obrázkov

 

Obrázky sú prvkom, ktoré výrazne spomaľujú načítanie akejkoľvek stránky, pokiaľ ich je na webe príliš veľa a obrázky zaberajú niekoľko megabajtov. Je preto vhodné obrázky komprimovať – zmenšiť ich veľkosť. Využiť na to môžete napríklad nástroj Tinypng.

 

Opravte nefungujúce linky

 

Aj prítomnosť nefungujúcich linkov na vašom webe vám dokáže poriadne uškodiť. Opravte ich a neriskujte tak odchod svojich návštevníkov z vašich stránok. Ak chcete zistiť, ktoré linky na vašej stránke nefungujú, odporúčame vám používať tieto bezplatné nástroje.

Nástroje na identifikáciu nefungujúcich linkov

– Google Webmaster Tools (crawl errors tab)

– Screaming Frog SEO Spider

– Ahrefs

 

Odporúčame vám používať všetky tri nástroje, pretože niektoré z nich odhalia chyby len v povrchovej časti a iné aj v prehliadači. Takouto spoluprácou nástrojov získate kompletnú identifikáciu problému. Pokiaľ dosiahnete nefunkčnosť linkov v hodnote 0, verte, že ste postupovali správne a váš problém je vyriešený.

 

Embedujte videá

 

Namiesto toho, aby ste rozsiahly video súbor nahrávali k sebe na web, radšej ho nahrajte na YouTube alebo Vimeo a následne video vložte na svoju stránku prostredníctvom “embed kódu”.

 

ako zrýchliť načítanie stránky - embedovanie videa

 

Vhodne nakódovaná web stránka

 

Kód vašej webstránky vie takisto načítanie zrýchliť, ale aj výrazne spomaliť.

Ak si dávate stránku vytvoriť na mieru, dopredu sa uistite, že váš programátor sa vyzná v “best practices” ako stránku nakódovať tak, aby sa rýchlo načítala.

Napríklad, veľa webstránok využíva aj databázy, čo si môžete predstaviť ako tabuľku s rôznymi stĺpcami a veľa dátami. Ak sa pri načítaní stránky odošle príkaz typu nájdi x, tak by to trvalo dlhšie, ako príkaz nájdi x v stĺpci y.

Pokiaľ používate WordPress, zvoľte si šablónu optimalizovanú pre rýchlosť. Výber vhodnej témy je jedným z troch krokov pri tvorbe WordPress stránky. Pamätajte na to, že čím viac kódu sa na stránke nachádza, o to dlhšie sa bude načítavať.

Pokiaľ si chcete založiť svoju prvú webovú stránku alebo blog, môžete využiť zadarmo niektorú z tém na oficiálnej stránke WordPressu. Pokiaľ si ale chcete byť istý vysokou rýchlosťou jej načítania, je vhodnejšie zainvestovať do nejakej platenej šablóny.

 

Odporúčané čítanie: Ako a kde nájsť najlepšie WordPress šablóny

 

Vyčistite databázu svojho webu

 

Niektoré weby síce fungujú aj bez databáz, ale väčšina webov už je programovaná tak, že určité dáta načíta prostredníctvom databázy, ku ktorej sa pripája.

Pri webstránkach programovaných na mieru sa databáza až tak neplní, ale môže sa stať, že sa v nej časom vyskytnú zbytočné zápisy. V tom prípade je potrebné, aby ich programátor buď manuálne, alebo cez skript odstránil.

V prípade WordPress stránok je to trochu horšie. WordPress totižto do databázy ukladá veľmi veľa dát. Často úplne zbytočných. Napríklad sú to revízie stránok. V takomto prípade je možné databázu vyčistiť od prebytočných dát pluginmi ako WP-Optimize alebo WP-Sweep. Manuálne viete nastaviť aj maximálny počet revízií cez wp-config.php

 

Prejdite na PHP verziu 7

 

Ako ste sa už dočítali vyššie, kód stránky dokáže výrazne ovplyvniť rýchlosť vašej stránky. Veľa stránok je naprogramovaných v PHP, čo je skriptovací jazyk využívaný programátormi. Aktuálna verzia je PHP7, konkrétne 7.1. – 7.3.

Ak používate staršie, už nepodporované verzie, nielenže sa vystavujete možnému bezpečnostnému riziku napadnutia vašej stránky, ale aj spomaľujete jej načítanie. Podľa viacerých testov je verzia 7 oveľa rýchlejšia ako jej predošlé.

Ak využívate webhosting vo WY, všetko ľahko nastavíte pomocou WY Panelu. Stačí prejsť do sekcie Web -> PHP nastavenia a v rolovacej lište vybrať aktuálnu verziu.

 

Aktualizácia PHP cez WY Panel

 

Špecifikujte rozmery obrázkov

 

Pokiaľ chcete zvýšiť rýchlosť načítania vášho webu, ale zároveň na ňom máte veľké množstvo obrázkov, je potrebné sa popasovať s ich rozmermi. Je potrebné definovať rozmery obrázkov, pretože prehliadač musí zistiť ako je text okolo nich rozložený pred tým, ako sa vám zobrazí vaša webová stránka.

V kóde to vyzerá napr. takto:

 

Špecifikácia veľkosti obrázkov pre rýchle načítanie stránky

 

Odstráňte zo stránky objekty, ktoré sa dlho načítavajú

 

Ak ste zástancom tzv. sliderov na webových stránkach, pouvažujte, či vám naozaj stoja za to iba preto, lebo sa vám páčia.

Vizuálne sú zaujímavé, avšak znižujú rýchlosť načítania webu. Ľudia obvykle kliknú len na prvý z nich a ďalšie si ani nepozrú. Pouvažujte o ich vhodnejšej a rýchlejšej náhrade iným elementom na stránke, ktorý splní rovnakú úlohu.

Na zistenie dlho sa načítavajúcich objektov využite už vyššie spomenutý nástroj webpagetest.org. Okrem dĺžky načítania stránky vám aj na jednotlivých objektoch ukáže, ktorý sa koľko načíta.

 

„Horúci odkaz“ z inej webovej stránky

 

Súbory (najčastejšie sa to týka obrázkov) na webstránku môžete vložiť dvoma spôsobmi, buď sa načítavajú priamo zo servera, kde máte máte stránku, alebo môžete “odkazovať” na súbor, ktorý je na inom serveri.

To znamená, že ak napríklad máte na stránke veľa obrázkov, a niekto iný odkazuje na vaše obrázky, vysiela tým požiadavku na váš server. Čím viac týchto požiadaviek bude, tým viac bude váš server vyťažený, a tým pomalšie bude aj načítanie vašej stránky.

Nanešťastie, nemáte ako ovplyvniť, či niekto iný odkazuje na súbory na vašej stránke, ale môžete zabrániť cez jeden príkaz, aby to nespomaľovalo server.

Stačí pridať nasledovný kód do súboru .htaccess:

 

RewriteEngine on

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http(s)://(www\.)vasadomena.koncovka/.*$ [NC]

RewriteRule \.(gif|jpg|jpeg|bmp|zip|rar|mp3|flv|swf|xml|php|png|css|pdf)$ – [F]

 

Stačí zmeniť doménu, prípadne doplniť typy súborov, ktorých sa to týka.

 

Povoľte Keep-Alive

 

Funkcia Keep-Alive odkazuje na správu, ktorá je odoslaná medzi klientskym počítačom a webovým serverom a vyžaduje povolenie na sťahovanie súborov. Aktivácia Keep-Alive vám umožní stiahnuť naraz viac súborov bez toho, aby ste sťahovanie každého z nich museli odobriť samostatne.

 

Vypnite pingbacks a trackbacks vo WordPresse

 

Pingbacks a trackbacks v skutočnosti neponúkajú praktické využitie pre WordPress. Napriek tomu sú štandardne zapnuté. Preto vám odporúčame ich vypnúť, čím sa vyhnete zbytočnému prehlteniu webovej databázy.

 

Používajte vyrovnávaciu pamäť

 

Vyrovnávacia pamäť (cache), slúži na dočasné uloženie súborov, aby sa k nim nabudúce urýchlil prístup.

Ak máte stránku naprogramovanú na mieru, je úlohou programátora, aby vám cache naprogramoval a nastavil na serveri, kde máte webstránku uloženú.

Ak používate CMS WordPress, jedným z najrýchlejších a najjednoduchších spôsobov, ako znížiť rýchlosť načítania stránky, je inštalácia cacheovacích pluginov ako W3 Total Cache alebo WP Super Cache. Obidva vyššie spomenuté pluginy sú kvalitné a zadarmo na stiahnutie.

 

Aktualizujte sadu znakov v hlavičke HTML

 

Je užitočné špecifikovať sadu znakov v hlavičke HTML, aby tak prehliadač nestrávil veľké množstvo času presnou analýzou toho, aký znakový súbor na svojich stránkach používate. Tento krok docielite jednoduchým pridaním značky štítku znakov UTF-8 do vašej webovej sekcie.

 

Znížte počet presmerovaní na iné stránky

 

Zakaždým, keď stránka vyžaduje presmerovanie na inú stránku, váš návštevník čelí ďalšiemu čakaniu na dokončenie cyklu odpovede na žiadosť načítania súboru.

Napríklad, ak váš vzorec presmerovania na mobil vyzerá takto: stranka.sk -> www.stranka.sk -> m.stranka.sk, presmerovanie na www.stranka.sk zbytočne spomaľuje rýchlosť načítania stránky.

Ideálne by presmerovania mali vyzerať nasledovne:

 

stranka.sk -> m.stranka.sk

www.stranka.sk -> m.stranka.sk

 

Zmenšite rozsah CSS, JavaScript a HTML kódu

 

Optimalizáciou kódu (vrátane odstránenia medzery, čiar a ďalších nepotrebných znakov) môžete dramaticky zvýšiť rýchlosť stránky. Odstráňte tiež komentáre k kódom, formátovanie a nepoužívaný kód. Google odporúča používať CSSNano a UglifyJS.

 

Slovo na záver

 

Dúfame, že s našimi radami sa vám úspešne podarí vyriešiť pomalé načítanie a zvýšiť rýchlosť vašej stránky.

Nemusíte využiť všetky nami ponúkané rady a tipy. Bežne stačí komprimovať obrázky a využiť cache. Len tieto dve rady dokážu výrazne zrýchliť váš web.

 

Nezmeškajte ďalšie užitočné články
a buďte o nich informovaný