Váš web není pomalý celý. Je pomalý na pěti místech

Rychlost webu je jedna z mála věcí v SEO, kde vidíte výsledek hned. Změříte před, opravíte, změříte po. Žádné čekání tři měsíce, jestli se něco pohne. Což je příjemné, protože skoro všechno ostatní v našem oboru funguje přesně opačně.

Tenhle článek je pořadí oprav tak, jak je reálně řadíme u klientů. Ne podle toho, co je technicky zajímavé, ale podle toho, kolik práce stojí jedna ušetřená sekunda.

Nejdřív se ujistěte, že měříte to, co zažívají lidi

Než na webu cokoliv změníte, podívejte se na terénní data místo laboratorních. Lighthouse spuštěný na vašem notebooku s kancelářskou wifi vám o zákazníkovi na mobilu v tramvaji řekne poměrně málo.

Otevřete si Search Console a sekci Core Web Vitals, nebo rovnou CrUX report.

Obrázky

Skoro vždycky největší jednotlivá výhra a obvykle nejmenší práce. Pokud máte na tenhle článek jen hodinu, dejte ji sem.

• Servírujte AVIF nebo WebP místo JPEG. Ušetří to typicky 40 až 70 % velikosti a rozdíl na oko nikdo nepozná.
• Nastavte width a height u každého obrázku, ať prohlížeč ví, kolik místa nechat.
• Hlavnímu obrázku dejte fetchpriority="high" a rozhodně mu nedávejte loading="lazy".
• Všem ostatním naopak loading="lazy" dejte.

Ta kombinace lazy loadingu na hlavním obrázku je asi nejčastější věc, kterou po lidech opravujeme. Je to škoda, protože zdrží obrázek přesně tam, kde na něm nejvíc záleží.

Písma

Druhá nejrychlejší výhra a nejčastěji přehlížená.

Hostujte si fonty sami místo přes Google Fonts. Ušetříte tím DNS lookup a spojení na cizí doménu, což jsou na mobilu klidně dvě stě milisekund. Přidejte font-display: swap, ať se text vykreslí náhradním písmem a nečeká.

JavaScript, který nikdo nechtěl

Tady to začíná být pracnější, ale taky se to začíná vyplácet nejvíc.

Otevřete si v DevTools panel Coverage a podívejte se, kolik staženého JavaScriptu se na dané stránce vůbec spustí.

U běžného webu se spustí kolem třiceti procent staženého kódu. Zbytek jste stáhli a zaplatili za nic.

Nejčastější viníci v tomhle pořadí: nástroje na chat, které se načítají hned místo po interakci. A/B testovací skripty běžící i po skončení testu. Karuselové knihovny na stránkách bez karuselu. A šest analytických nástrojů, ze kterých se dívá do dvou.

Ten poslední bod řekněte nahlas na poradě. Bývá to nejrychlejší schválená změna v celém projektu.

Server a cache

Pokud máte TTFB nad 600 ms, žádná optimalizace na frontendu vás nezachrání. Začínáte v mínusu a jen dobíháte.

Statický výstup je pořád nejlepší dostupná odpověď. Když se dá stránka vygenerovat předem a servírovat z CDN, dostanete se pod sto milisekund a nemusíte se tím dál zabývat. Ne všechno jde udělat staticky, ale bývá toho víc, než si lidi myslí.

U dynamických webů pomůže cache na úrovni stránky a hlavně kontrola, jestli se náhodou nedělá deset databázových dotazů tam, kde stačí jeden. Klasika je výpis, který pro každou položku dělá vlastní dotaz. Osmdesát položek, osmdesát dotazů.

Layout, který se hýbe

CLS je metrika, kterou lidi ignorují nejdéle, protože se špatně vysvětluje. Přitom ji zákazníci nesnášejí ze všech nejvíc. Každý už někdy klikl na tlačítko, které se v poslední chvíli posunulo.

Rezervujte místo pro všechno, co se načítá později. Obrázky rozměrem, reklamy a widgety pevnou výškou kontejneru, cookie lišty tím, že je vykreslíte přes obsah místo nad ním.

A vyhněte se vkládání obsahu nad už vykreslený text. Notifikační proužek, který naskočí nahoru a odsune celou stránku o čtyřicet pixelů, je jednorázově malá věc a v metrice je vidět měsíce.

Co s tím reálně čekat

Pořadí výše zhruba odpovídá i tomu, kolik z toho dostanete. U webů, které přebíráme, se dostáváme z LCP kolem tří sekund na hodnoty pod jednu, a většina posunu přijde z prvních dvou bodů.

Nečekejte, že se tím zvednou pozice ve vyhledávání. Rychlost je slabý ranking faktor a kdo tvrdí opak, prodává. Co se ale zvedne dost výrazně, je podíl lidí, kteří dočkají načtení a něco na webu udělají. A to je to, o co jde.

Jestli si nejste jistí, kde na tom váš web stojí, pošlete nám adresu. Měření je součástí vstupního auditu a řekneme vám i to, když je všechno v pořádku a máte se věnovat něčemu jinému.