LCP měří, za jak dlouho se na stránce zobrazí největší viditelný prvek. Přečtěte si, jaké hodnoty Google považuje za dobré, jak LCP zjistíte bez vývojářských nástrojů a co dělat, když je čas načtení vysoký.
LCP (Largest Contentful Paint) je metrika rychlosti webu, která měří čas od zahájení načítání stránky do okamžiku, kdy se ve viewportu zobrazí největší viditelný prvek. Jde o součást Core Web Vitals a jeden z potvrzených signálů, které Google od května 2021 zohledňuje při hodnocení stránek ve výsledcích vyhledávání.
Google stanovil konkrétní prahové hodnoty. Stránka je hodnocena jako dobrá, pokud LCP nepřekračuje 2,5 sekundy. Hodnoty mezi 2,5 a 4 sekundami vyžadují zlepšení, nad 4 sekundy Google hodnotí jako špatné.
Hodnocení
Hodnota LCP
Co to znamená
Dobré
≤ 2,5 s
Stránka načítá hlavní obsah dostatečně rychle pro pozitivní uživatelský zážitek
Vyžaduje zlepšení
2,5 s – 4 s
Část uživatelů zaznamenává pomalé načítání, optimalizace je doporučena
Špatné
> 4 s
Stránka pravděpodobně ztrácí uživatele ještě před zobrazením hlavního obsahu
75. percentil — proč průměr nestačí: Google nehodnotí průměrnou hodnotu LCP ze všech návštěv, ale 75. percentil. To znamená, že 75 % vašich návštěvníků musí splňovat daný práh. Pokud máte průměrné LCP 2,1 s, ale 25 % uživatelů čeká déle než 4 s (například na pomalém mobilním připojení), Google stránku jako dobrou nevyhodnotí.
Jak metrika funguje
Co je LCP element
LCP element je největší viditelný prvek na stránce v okamžiku načítání — ten, jehož zobrazení prohlížeč sleduje a měří. Nejde vždy o obrázek. Na blogových nebo slovníkových stránkách bývá LCP elementem textový blok, nejčastěji H1 nebo první velký odstavec.
Prvky, které mohou být LCP elementem
Obrázek <img>
Obrázek <image> uvnitř SVG elementu
Video <video> s poster obrázkem
Element s obrázkem na pozadí přes CSS url()
Blokový element s textem (H1, odstavec, nadpis)
Prvky, které LCP elementem být nemohou
Elementy s opacity: 0 (neviditelné pro uživatele)
Prvky vyplňující celý viewport (považovány za pozadí)
Zástupné obrázky s nízkou informační hodnotou
CSS gradienty
SVG elementy (samostatně, bez obrázku uvnitř)
Praktický detail: Pokud je vaším LCP elementem textový blok (H1 nebo první odstavec), optimalizace probíhá jinak než u obrázku. Soustředíte se na rychlost serveru, blokující skripty a CSS — ne na kompresi obrázků. Identifikace správného elementu je proto prvním krokem před jakoukoli optimalizací.
Jak Google počítá velikost LCP elementu
Do výpočtu vstupuje pouze viditelná část prvku uvnitř viewportu. Části přesahující mimo obrazovku, části skryté přes overflow: hidden a CSS vlastnosti jako margin, padding ani border se do velikosti nezapočítávají. U obrázků platí zásada: počítá se menší z hodnot, buď viditelná velikost, nebo přirozená velikost souboru.
Jak LCP element najít na svém webu
Existují tři nástroje, které LCP element identifikují bez znalosti kódu:
PageSpeed Insights (pagespeed.web.dev) — v sekci Diagnostika zobrazí konkrétní element a jeho čas
Chrome rozšíření Web Vitals — po instalaci zobrazuje LCP hodnotu a element přímo při procházení webu
Chrome DevTools (záložka Performance) — podrobné zobrazení pro vývojáře
Měření
Jak LCP zjistit bez vývojáře: krok za krokem
LCP zjistíte dvěma způsoby — přes Google Search Console, která ukazuje data z reálných návštěv vašeho webu, nebo přes PageSpeed Insights, kde výsledek dostanete okamžitě pro libovolnou URL. Obě možnosti jsou zdarma a nevyžadují technické znalosti.
Otevřete zprávu pro Mobilní nebo Desktop — výsledky jsou vždy oddělené
V tabulce uvidíte URL skupiny rozdělené podle stavu: Špatné, Vyžaduje zlepšení nebo Dobré
Kliknutím na řádek zobrazíte konkrétní URL a příslušnou hodnotu LCP
Výhoda: GSC pracuje s daty od reálných návštěvníků za posledních 28 dní. Výsledky odpovídají tomu, co Google skutečně měří při hodnocení stránky.
Okamžitý výsledek
Přes PageSpeed Insights
Otevřete pagespeed.web.dev a zadejte URL stránky, kterou chcete otestovat
Spusťte analýzu a počkejte na výsledky (30–60 sekund)
V horní části uvidíte pole LCP barevně označené — zelená, oranžová nebo červená
Přepněte záložky Mobilní a Desktop — výsledky se mohou výrazně lišit
V sekci Diagnostika najdete pojmenovaný LCP element a doporučení ke zlepšení
Výhoda: Výsledek dostanete okamžitě pro jakoukoli URL — i pro web konkurence nebo novou stránku bez dat v GSC.
Field data vs. Lab data: PageSpeed Insights zobrazuje dva typy výsledků. Field data pocházejí od reálných uživatelů (stejný zdroj jako GSC). Lab data jsou syntetická — měření simuluje Lighthouse v kontrolovaném prostředí. Pro SEO hodnocení jsou rozhodující field data. Lab data slouží k diagnostice a testování oprav.
Optimalizace
Nejčastější příčiny špatného LCP a jak je opravit
Více než 90 % případů špatného LCP má jednu z pěti příčin. Identifikujte, která z nich se týká vaší stránky — a začněte právě tam, ne s obecnou optimalizací.
01
Pomalý server — vysoké TTFB
Pokud server odpovídá pomalu, LCP nemůže být dobré bez ohledu na ostatní optimalizace. TTFB (Time To First Byte) je čas, za který server odešle první bajt odpovědi. Hodnoty nad 800 ms tvoří základ špatného LCP.
Řešení: Kvalitní hosting nebo VPS místo sdíleného hostingu, CDN (Content Delivery Network) pro statický obsah, serverový cache (Redis, Varnish nebo cache plugin u WordPressu).
02
Chybějící preload LCP obrázku
Prohlížeč obvykle „objeví“ obrázek na stránce pozdě — až při parsování CSS nebo JavaScriptu, ne při prvním průchodu HTML. To způsobuje, že načtení obrázku začíná pozdě, přestože je prioritní.
Řešení: Přidejte do sekce <head> tento řádek pro hero obrázek: <link rel="preload" as="image" href="cesta/k/obrazku.webp">. Použijte jen pro jeden, nejdůležitější obrázek na stránce.
Jeden řádek kódu, výrazný dopad na LCP
03
Lazy loading na LCP elementu
Atribut loading="lazy" říká prohlížeči, aby obrázek načítal až ve chvíli, kdy se blíží k viewportu. Na hero obrázku nebo jiném LCP elementu to způsobí, že prohlížeč záměrně obrázek odloží — a LCP čas narůstá.
Řešení: Na LCP elementu nikdy nepoužívejte loading="lazy". Buď atribut vynechejte úplně, nebo explicitně nastavte loading="eager". Lazy loading má smysl pouze pro obrázky, které jsou níže na stránce, mimo první viewport.
Časté nastavení po šabloně — zkontrolujte svůj hero obrázek
04
Neoptimalizovaný obrázek
Velký soubor obrázku znamená delší přenos, i na rychlém serveru. Pokud hero obrázek váží 2 MB v JPEG formátu, prohlížeč čeká na celý přenos předtím, než může prvek vykreslit.
Řešení: Převeďte obrázky do formátu WebP nebo AVIF (30–50 % menší soubory při stejné kvalitě). Použijte správnou velikost pro daný viewport — obrázek šířky 3 000 px na mobilním displeji nemá smysl. Komprimujte přes nástroje jako Squoosh nebo TinyPNG.
05
Blokující skripty a styly v hlavičce
JavaScript nebo CSS soubory umístěné v <head> bez atributu defer nebo async blokují vykreslování stránky. Prohlížeč nemůže zobrazit nic, dokud tyto soubory nestáhne a nezpracuje — LCP element čeká.
Řešení: Nekritické skripty označte atributem defer. Kritické CSS (styly pro first viewport) vložte přímo do HTML jako inline kód. Ostatní CSS načítejte asynchronně. U WordPressu pomáhají pluginy jako WP Rocket nebo LiteSpeed Cache.
Kontext
LCP v kontextu Core Web Vitals
LCP je jedna ze tří metrik, které tvoří Core Web Vitals. Každá metrika měří jinou dimenzi uživatelského zážitku — a Google sleduje všechny tři zároveň.
Rychlost načtení
LCP
Měří čas do zobrazení největšího viditelného prvku. Hodnotí, jak rychle uživatel vidí hlavní obsah stránky.
Práh: ≤ 2,5 s
Interaktivita
INP
Interaction to Next Paint měří odezvu stránky na kliknutí, klepnutí nebo stisk klávesy. Od března 2024 nahradilo metriku FID.
Práh: ≤ 200 ms
Vizuální stabilita
CLS
Cumulative Layout Shift měří, jak moc se obsah stránky posouvá během načítání. Nízká hodnota znamená, že prvky na stránce nespadají.
Práh: ≤ 0,1
Proč záleží na všech třech: Google hodnotí Core Web Vitals jako celek. Výborné LCP při špatném CLS nebo INP nestačí k tomu, aby stránka splnila požadavky Page Experience. Začněte metrikou s nejhorší hodnotou ve vaší Google Search Console.
Dopad na vyhledávání
Jak LCP ovlivňuje SEO
LCP jako součást Core Web Vitals je od května 2021 potvrzeným rankingový signálem Googlu. Funguje jako „tiebreaker“ — při obsahově srovnatelných stránkách rozhodne rychlejší web. Není to primární faktor jako relevance obsahu nebo zpětné odkazy, ale při těsné konkurenci může být rozdílem mezi první a druhou stránkou výsledků.
Co LCP ovlivňuje přímo
Hodnocení stránky v rámci Page Experience signálu
Lighthouse skóre — LCP tvoří 25 % celkového výsledku
Míra okamžitého opuštění — pomalé LCP zvyšuje bounce rate
Konverzní poměr — rychlejší LCP koreluje s vyšším počtem konverzí
Kde začít s prioritizací
Zaměřte se nejprve na stránky s nejvyšší organickou návštěvností
Zkontrolujte mobilní verzi — Google indexuje primárně mobile-first
V GSC filtrujte URL označené jako „Špatné“ a začněte tam
Po opravách počkejte 28 dní na aktualizaci dat v GSC
LCP je součástí širší oblasti technického SEO. Pokud na webu řešíte rychlost načítání, LCP je nejdůležitější metrika, na kterou se zaměřit — protože má největší váhu v Lighthouse skóre a nejsilnější korelaci s uživatelským chováním.
Reálný dopad: Podle dat Googlu zvýšení LCP ze špatného na dobré pásmo snižuje míru okamžitého opuštění o desítky procent. E-shopy s rychlým LCP reportují vyšší konverzní poměr než srovnatelné weby s pomalým načítáním — i při stejném obsahu a cenách.
Časté otázky
Otázky o LCP
FCP (First Contentful Paint) měří, kdy se na stránce zobrazí první kousek jakéhokoliv obsahu — může to být malý obrázek, ikona nebo pár pixelů textu. LCP měří, kdy se zobrazí největší viditelný prvek, který nejlépe reprezentuje hlavní obsah stránky. FCP může nastat velmi brzy, ale uživatel ještě nevidí nic smysluplného. LCP zachycuje moment, kdy stránka skutečně „vypadá hotově“.
Mobilní zařízení mají obvykle pomalejší připojení, méně výkonný procesor a menší viewport — to vše prodlužuje čas načtení. Google proto měří mobil a desktop odděleně a zobrazuje výsledky zvlášť v GSC i PageSpeed Insights. Prioritou je mobilní verze, protože Google indexuje weby primárně z pohledu mobilního zařízení (mobile-first indexing). LCP element se navíc může lišit — na mobilu může být největším prvkem jiný element než na desktopu.
Ano, ale nepřímo a jako jeden ze signálů. LCP je součástí Core Web Vitals, které jsou od května 2021 potvrzeným Google rankingový faktorem v rámci Page Experience update. V praxi funguje jako tiebreaker — rozhoduje ve chvíli, kdy mají dvě stránky srovnatelnou relevanci a autoritu. Samotné výborné LCP bez kvalitního obsahu stránku na první místo nedostane. Špatné LCP ale může být nevýhodou oproti konkurenci se srovnatelným obsahem.
Google hodnotí LCP na 75. percentilu všech načtení stránky — znamená to, že 75 % vašich návštěvníků musí splňovat daný práh. Průměrná hodnota může být klidně 2 sekundy, ale pokud 25 % uživatelů čeká déle než 4 sekundy (například kvůli pomalému mobilnímu připojení nebo starému zařízení), Google stránku jako dobrou nevyhodnotí. Percentil lépe zachycuje reálnou zkušenost nejpomalejší čtvrtiny uživatelů.
Záleží na příčině. Komprimaci obrázků, převod do formátu WebP nebo změnu nastavení cache pluginu zvládnete bez kódu pomocí nástrojů jako Squoosh (obrázky) nebo WP Rocket (WordPress). Preload LCP obrázku, odstranění lazy loadingu z hero obrázku nebo inline Critical CSS už vyžadují zásah do šablony nebo kódu — tam je lepší oslovit vývojáře. První krok je vždy identifikace konkrétní příčiny přes PageSpeed Insights.
Nejjednodušší způsob je PageSpeed Insights (pagespeed.web.dev) — zadejte URL stránky, spusťte analýzu a v sekci Diagnostika najdete pojmenovaný LCP element s jeho časem. Alternativně nainstalujte Chrome rozšíření Web Vitals, které zobrazuje LCP hodnotu a zvýrazňuje element přímo při procházení webu. Pro detailní analýzu slouží záložka Performance v Chrome DevTools — kliknete na „LCP“ v časové ose a prohlížeč element označí.
Marketingu se věnuji od roku 2017. Začínal jsem ve
Fajn skupině,
kde jsem budoval komunity na Facebooku a záhy přešel k placeným kampaním —
pod vedením
Janči Skalkové
jsem nasbíral základy, které používám dodnes. Postupně jsem se dostal k SEO,
automatizacím a celkové správě marketingu. Dnes působím jako CEO agentury PŘESAH
a zároveň jako externí CMO ve společnosti
Bohemian Estates.
