Pomalý web nahnevá návštevníka skôr, než si prečíta prvú vetu. Mnohí odídu a nikdy sa nedozviete, že ste ich stratili. Dobrá správa je, že príčin je len niekoľko a väčšina sa dá nájsť a opraviť bez veľkých nákladov. Tu je poradie, v akom ich hľadám.
Najprv zmerajte, potom opravujte
Odhad nestačí. Rýchlosť sa dá merať zadarmo a trvá to minútu. Najčastejšie sa používa PageSpeed Insights od Googlu, kde vložíte adresu a dostanete výsledok pre mobil aj počítač. Podobné údaje ukáže Lighthouse v prehliadači Chrome (F12 a karta Lighthouse) a aj nástroje ako GTmetrix alebo WebPageTest.
Pri čítaní výsledkov sa nezameriavajte na jedno číslo. Dôležitejší je zoznam konkrétnych odporúčaní, ktorý nástroj ukáže: čo sa načítava dlho, čo je príliš veľké a čo blokuje zobrazenie. Merajte radšej viackrát a na mobile, lebo tam sú výsledky horšie a návštevníkov z mobilu je veľa. Výsledky sa môžu medzi meraniami mierne líšiť, to je normálne.
Obrázky
Najčastejší vinník. Fotka priamo z mobilu alebo z fotobanky má často niekoľko megabajtov, hoci na webe sa zobrazí v malom okne. Čo s tým:
- zmenšite rozmery na veľkosť, v akej sa naozaj zobrazujú,
- použite moderné formáty ako WebP alebo AVIF,
- zapnite lenivé načítanie, aby sa obrázky mimo prvej obrazovky načítali až pri posúvaní stránky,
- zadajte rozmery obrázkov, aby sa stránka pri načítaní neposúvala.
Hosting
Ak je server preťažený alebo ďaleko od návštevníkov, každá stránka sa načíta dlhšie, nech je web zhora nadol akokoľvek dobrý. Lacný zdieľaný hosting, na ktorom sú stovky iných webov, môže byť pomalý najmä vo vyťažených hodinách. Pri statických weboch je rýchle riešenie hosting cez službu s rozvodnou sieťou (CDN), ako je Cloudflare alebo Vercel, ktoré môžu byť aj zadarmo. Viac o cenách a možnostiach v článku koľko stojí hosting.
Doplnky a ťažká šablóna
Pri WordPresse sa web ľahko spomalí množstvom doplnkov. Každý pridá vlastné skripty a štýly a často sa načítajú na každej stránke, aj keď ich potrebuje len jedna. Ťažké univerzálne šablóny s desiatkami funkcií majú podobný efekt. Pomáha:
- odinštalovať doplnky, ktoré nepoužívate,
- nahradiť ťažký doplnok niekoľkými riadkami kódu, ak ide o malú funkciu,
- zvoliť jednoduchšiu šablónu alebo web na mieru.
Úplne jednoduchý web s vlastným kódom býva rýchly už preto, že nenesie nič navyše. Súvisí to aj s tým, ako sa spravuje, čo rozoberáme v článku admin panel pre web.
Skripty tretích strán
Meranie návštevnosti, reklamné pixely, chat, vložené videá, mapy, fonty z externých serverov a sociálne tlačidlá, to všetko sa sťahuje z cudzích serverov a nemáte to pod kontrolou. Jeden pomalý skript môže spomaliť celú stránku. Skúste ich vypísať a pre každý sa opýtať, či ho naozaj potrebujete. Video z YouTube sa dá načítať až po kliknutí, fonty uložiť priamo na svoj server a nepoužívané skripty vyhodiť.
Cache a stlačenie
Cache je pamäť, vďaka ktorej sa stránka nemusí pri každej návšteve skladať odznova. Serverová cache uloží hotovú stránku a prehliadačová cache nechá návštevníkovi súbory, ktoré už raz stiahol. Rovnako pomáha stlačenie súborov (gzip alebo Brotli) a zmenšenie kódu. Väčšina kvalitných hostingov to ponúka a pri WordPresse sa používa osobitný doplnok.
Fonty a animácie
Webové písma sa často podceňujú. Ak načítate päť rezov jedného písma z cudzieho servera, prehliadač čaká, kým ich dostane. Stačia zvyčajne dva alebo tri rezy a najlepšie uložené priamo na vašom serveri. Podobne ťažké animácie a veľké úvodné videá spomaľujú prvé zobrazenie, najmä na slabších telefónoch.
Odporúčaný postup
- Zmerajte aktuálny stav v PageSpeed Insights na mobile.
- Opravte to, čo nástroj označí ako najväčšie, spravidla obrázky.
- Skontrolujte doplnky a skripty tretích strán a odstráňte zbytočné.
- Zapnite cache a zvážte lepší hosting alebo CDN.
- Zmerajte znova a porovnajte.
Rýchlosť patrí aj medzi veci, ktoré treba skontrolovať pred spustením, pozrite kontrolný zoznam pred spustením webu. Rýchly web sa dobre číta na mobile aj vo vyhľadávaní, o čom je aj článok web na mobile.
Na čo si dať pozor
- Neopravujte naslepo, najprv zmerajte a opravte to, čo je naozaj najväčší problém.
- Nepreháňajte honbu za maximálnym skóre, dôležitý je pocit návštevníka z reálneho mobilu.
- Každý nový doplnok alebo skript sa po pridaní oplatí otestovať.
- Veľké obrázky zmenšujte vždy ešte pred nahratím na web.
- Ak neviete, kde je problém, pomôžeme vám. Servis existujúceho webu stojí 18 až 30 € za hodinu.