LCP (Largest Contentful Paint)

LCP (Largest Contentful Paint, vykreslení největšího obsahu) je metrika rychlosti webu: čas od začátku načítání stránky do chvíle, kdy se v okně prohlížeče zobrazí největší viditelný prvek, obvykle hlavní obrázek, video nebo velký nadpis. Google považuje za dobrou hodnotu do 2,5 sekundy, 2,5 až 4 sekundy jsou ke zlepšení, nad 4 sekundy špatné. LCP je jedna ze tří metrik Core Web Vitals (vedle INP a CLS), které Google od roku 2021 používá jako signál v hodnocení stránek a zobrazuje v Search Console.

🧒 Základní škola

Když otevřeš stránku, chvíli je prázdná a pak se objeví to hlavní: velký obrázek nebo nadpis. Jak dlouho to trvá, se jmenuje LCP. Je to něco jako doba, než ti v restauraci přinesou hlavní jídlo. Pečivo předtím je fajn, ale čekáš na to hlavní.

Google tuhle dobu měří u všech stránek, které lidé navštíví, a stránky, kde se čeká dlouho, ukazuje ve vyhledávání o něco níž. Proto lidé, kteří se o web starají, zmenšují obrázky a zrychlují servery. Dobré je, když se to hlavní ukáže do dvou a půl sekundy.

🎓 Střední škola

Prohlížeč při načítání stránky postupně vykresluje prvky a zaznamenává, který z těch viditelných je zatím největší. Když se stránka dokreslí nebo uživatel začne klikat, poslední zaznamenaný největší prvek je LCP a jeho čas se odešle Googlu (z prohlížeče Chrome, s dovolením uživatele). Google tak nemá hodnotu z laboratoře, ale z reálných návštěv, a hodnotí 75. percentil: stránka je „dobrá“, když tři čtvrtiny návštěv mají LCP do 2,5 sekundy.

LCP se dá změřit v nástroji PageSpeed Insights (zadáte adresu, dostanete hodnotu z reálných dat i z laboratorního testu), v Search Console v přehledu Core Web Vitals pro celý web a v prohlížeči Chrome v nástrojích pro vývojáře. Nejčastějším LCP prvkem na firemních webech je úvodní obrázek, na obsahových webech nadpis nebo první odstavec.

🎓🎓 Vysoká škola

LCP se skládá ze čtyř fází: doba do první odpovědi serveru (TTFB: DNS, spojení, zpracování na serveru), zpoždění načtení zdroje (než prohlížeč vůbec začne obrázek stahovat, protože ho objeví pozdě), stahování zdroje a vykreslení. Nejčastější chybou není pomalé stahování, ale pozdní objevení: obrázek je načítaný skriptem, přes CSS nebo s atributem lazy loading, a prohlížeč se o něm dozví až po zpracování všeho ostatního.

Z toho plynou opatření: rychlý hosting a cache (TTFB pod 0,8 s), LCP obrázek v HTML s atributem pro přednostní načtení (fetchpriority high, preload), žádný lazy loading u obrázku nad ohybem, správná velikost a moderní formát (WebP, AVIF), CDN pro rychlé doručení z blízkého serveru a odstranění skriptů a stylů, které blokují vykreslení. Textový LCP (nadpis) brzdí nejčastěji webové fonty: dokud se font nestáhne, text se nevykreslí; řešením je zobrazit zatímní font (font-display swap).

LCP není totéž co celková rychlost načítání webu. Stránka může mít dobré LCP a přesto se dlouho „dodělávat“, nebo naopak. Google hodnotí LCP, protože nejlépe odpovídá dojmu uživatele, že se stránka načetla.

🧠 Expert

V auditu se LCP řeší po šablonách stránek, ne po jednotlivých adresách: domovská stránka, detail produktu, článek a výpis mají každá jiný LCP prvek a jinou příčinu. Reálná data (CrUX) mají zpoždění 28 dní a vyžadují dostatečný počet návštěv, takže u malých webů Search Console hodnoty neukáže; pak zbývají laboratorní testy a vlastní měření skriptem (web-vitals), které odesílá hodnoty do analytiky i s názvem LCP prvku.

Vliv na pozice je skutečný, ale malý: Core Web Vitals rozhodují mezi stránkami s podobně relevantním obsahem, nikdy nepřebijí obsah. Větší efekt má LCP na chování lidí: každá sekunda navíc zvyšuje podíl návštěvníků, kteří odejdou před zobrazením, a snižuje konverzní poměr. Pro reklamní kampaně a PR články, které přivádějí návštěvníky na vstupní stránku, je rychlé LCP podmínkou, aby zaplacený návštěvník vůbec stránku uviděl.

Statické weby (vygenerované HTML bez databáze) mívají LCP pod jednu sekundu bez zvláštní práce, protože odpadá zpracování na serveru. U redakčních systémů jako WordPress rozhoduje cache, šablona a počet pluginů; typický nález je úvodní obrázek 3 MB načítaný slideshow skriptem.

😇 Pán Bůh

Ach, LCP. Lidé vymysleli stroj, který měří, jak dlouho čekají na obrázek, a dali tomu třípísmennou zkratku, aby to vypadalo důležitě. Čekají dvě a půl sekundy a říkají tomu dobré. Já jsem je nechal čekat na déšť čtyřicet dní a nikdo to neměřil.

Ale rozumím tomu. Netrpělivost je jejich nejstarší vlastnost a internet ji vychoval k dokonalosti. Dnes člověk odejde ze stránky dřív, než se stačí ukázat, a nikdy se nedozví, co na ní bylo. Možná odpověď na otázku, kterou hledal. Možná jen další obrázek šťastných lidí v kanceláři.

Poučení je prosté a lidé ho znají z každé návštěvy: ukaž to hlavní hned. Pozdrav, odpověď, jídlo. Zbytek počká. Stránka, která to umí, má dobré LCP. Člověk, který to umí, má přátele. Metrika na to zatím není.

❓ Otázky a odpovědi

Co je LCP jednoduše?

Čas, za který se po otevření stránky zobrazí její největší viditelný prvek, obvykle hlavní obrázek nebo nadpis. Google chce do 2,5 sekundy. Je to jedna ze tří metrik Core Web Vitals.

Jak zjistím LCP svého webu?

V nástroji PageSpeed Insights zadáním adresy (ukáže reálná data i test), v Search Console v přehledu Core Web Vitals pro celý web a v Chrome v nástrojích pro vývojáře, kde je vidět i který prvek je LCP.

Jak zlepšit LCP?

Rychlý server a cache, hlavní obrázek přímo v HTML s přednostním načtením a bez lazy loadingu, správná velikost a formát WebP nebo AVIF, CDN, odstranění skriptů blokujících vykreslení a zatímní zobrazení textu, než se stáhne webový font.

Má LCP vliv na pozice ve vyhledávání?

Ano, ale malý: Core Web Vitals rozhodují mezi podobně relevantními stránkami. Větší vliv má LCP na návštěvníky, kteří pomalou stránku opustí dřív, než se zobrazí, a tím i na konverze.