Jak zrychlit web: 7 kroků, které opravdu fungují
Rychlý web udrží návštěvníky a pomáhá ve vyhledávání. Sedm kroků, jak ho zrychlit, a jak poznat, že se to povedlo.
Obsah článku
Pomalý web stojí firmy zákazníky dřív, než si stihnou přečíst, co nabízíte. Rychlost navíc patří mezi signály, které Google při hodnocení stránek bere v úvahu. Dobrá zpráva: většinu zpomalení lze odstranit několika konkrétními kroky.
Co přesně znamená „rychlý web“
Google rychlost popisuje třemi ukazateli, tzv. Core Web Vitals. Hodnota je „dobrá“, když ji splňuje většina návštěv (75. percentil):
| Ukazatel | Co měří | Dobrá hodnota |
|---|---|---|
| LCP | Za jak dlouho se zobrazí hlavní obsah stránky | do 2,5 s |
| INP | Jak rychle web reaguje na kliknutí a klepnutí | do 200 ms |
| CLS | Jestli se obsah při načítání „nepřeskakuje“ | do 0,1 |
1. Nejdřív změřte, pak optimalizujte
Otevřete si PageSpeed Insights a zadejte adresu webu. Výsledek má dvě části: laboratorní test (jedno měření v simulovaných podmínkách) a data od skutečných návštěvníků, pokud jich má Google dost. Optimalizujte to, co report označí jako největší zpomalení, ne to, co se zdá snadné.
2. Zmenšete a správně pojmenujte obrázky
Obrázky bývají nejtěžší částí stránky. Nahrávejte je ve formátu WebP, v rozměrech, ve kterých se skutečně zobrazují, a vždy s atributy width a height, aby se stránka při načítání neposouvala.
- Hlavní obrázek nad ohybem nenačítejte líně; dejte mu
fetchpriority="high". - Všechny ostatní obrázky načítejte s
loading="lazy".
3. Písma načítejte lokálně
Písma z cizích serverů znamenají další připojení a často i problém s ochranou osobních údajů. Uložte je na vlastní web ve formátu WOFF2, použijte jen potřebné řezy a nastavte font-display: swap, aby se text zobrazil hned.
4. Odstraňte zbytečné skripty a pluginy
Každý plugin, widget a měřicí skript něco stojí. Projděte, co web opravdu načítá, a vyhoďte všechno, co nepřináší poptávky. Čím méně kódu prohlížeč zpracovává, tím rychleji web reaguje.
5. Zapněte kompresi a cache
Server by měl textové soubory (HTML, CSS, JavaScript) posílat zkomprimované a statické soubory označit dlouhou dobou uložení v prohlížeči. Aby se po úpravě stáhla nová verze, přidává se k adrese souboru verze, například style.css?v=1234.
6. Zkontrolujte odezvu serveru
Když server odpovídá pomalu, žádná optimalizace obrázků to nezachrání. Pomůže kvalitní hosting, aktuální verze PHP a to, že se stránky netvoří zbytečně složitými dotazy při každé návštěvě.
7. Hlídejte posuny obsahu
Banner, který se doplní po načtení a odsune text, nebo reklama bez vyhrazeného místa zhoršují CLS. Prvkům, které se načítají později, vždy rezervujte místo pevnou výškou nebo poměrem stran.
Závěr
Rychlost není jednorázová úprava, ale návyk: měřte, měňte jednu věc po druhé a výsledek ověřte. Pokud chcete, aby se o to staral někdo, kdo to dělá denně, ozvěte se mi.
