Core Web Vitals: Kompletní průvodce pro majitele webů (2026)

Váš web může mít skvělý obsah, perfektně zvolená klíčová slova i solidní zpětné odkazy – a přesto zaostávat za konkurencí. Jedním z důvodů bývají špatné Core Web Vitals. Google je od roku 2021 oficiálně řadí mezi rankingové faktory a jejich vliv rok od roku roste.

V tomto průvodci se dozvíte, co Core Web Vitals jsou, co přesně měří, jak si výsledky svého webu zjistit zdarma a hlavně, jak je zlepšit. Ať máte WordPress, Shoptet, nebo cokoli jiného.

Co jsou Core Web Vitals a proč je Google měří?

Core Web Vitals jsou sada tří metrik, které Google používá k měření reálné uživatelské zkušenosti na webu. Nejde o technické metriky pro vývojáře — jde o to, jak váš web působí na skutečné návštěvníky v jejich prohlížeči, na jejich zařízení, na jejich připojení.

Google chce ve výsledcích vyhledávání zobrazovat weby, které jsou nejen relevantní, ale také uživatelsky přívětivé. Core Web Vitals jsou jeho způsobem, jak to změřit.

Každá metrika měří jiný aspekt uživatelského zážitku:

• LCP měří, jak rychle se načte hlavní obsah stránky
• CLS měří, jak moc se obsah “poskakuje” při načítání
• INP měří, jak rychle web reaguje na kliknutí a interakce

Dobré skóre Core Web Vitals přináší dvojí výhodu: lepší pozice ve vyhledávání a nižší míru opuštění stránky. Pomalý nebo nestabilní web návštěvníci jednoduše zavřou.

LCP – Largest Contentful Paint

Co to je?

LCP měří, za jak dlouho se načte největší viditelný prvek na stránce – typicky hlavní obrázek, hero sekce nebo velký nadpis. Ukazuje, kdy má uživatel pocit, že stránka “naběhla”.

Jak by měl LCP vypadat?

Nejčastější příčiny špatného LCP

Neoptimalizované obrázky jsou nejčastějším viníkem. Fotografie z fotoaparátu o velikosti 4 MB, která se zobrazuje jako 800px wide hero obrázek, zpomaluje LCP dramaticky.

Dalšími příčinami jsou:

• Pomalý hosting – levný sdílený hosting nestíhá obsloužit požadavky
• Chybějící cache – každý návštěvník musí čekat na sestavení stránky od nuly
• Render-blocking JavaScript a CSS – prohlížeč čeká, než načte skripty, a teprve pak kreslí stránku
• Příliš pozdě načítaný hlavní obrázek – chybí atribut fetchpriority="high"

Jak LCP zlepšit?

1. Převeďte obrázky do formátu WebP – oproti JPG ušetří 25-35 % velikosti při stejné kvalitě
2. Nastavte správné rozměry – nenačítejte obrázek ve velikosti 2 400 px, pokud ho zobrazujete jen na 800 px
3. Přidejte atribut loading="eager" a fetchpriority="high" k hlavnímu hero obrázku
4. Použijte CDN – obsah se servíruje z nejbližšího serveru k návštěvníkovi
5. Přejděte na kvalitnější hosting – sdílený hosting není základ pro dobré LCP

CLS – Cumulative Layout Shift

Co to je?

CLS měří vizuální stabilitu stránky. Konkrétně – jestli se obsah při načítání “poskakuje”. Znáte ten pocit, kdy jdete kliknout na tlačítko a v poslední vteřině se celý obsah posune dolů, protože se načetl banner nebo obrázek? Přesně to CLS zachytí.

Jak by měl CLS vypadat?

Nejčastější příčiny špatného CLS

• Obrázky bez definovaných rozměrů – prohlížeč nezná jejich výšku, dokud je nenačte, a pak stránku přeskládá
• Reklamy, bannery a embedy – načítají se asynchronně a vytlačují ostatní obsah
• Webfonty – text nejprve renderuje systémovým písmem, pak ho přepíše načteným fontem (tzv. FOUT)
• Dynamicky vkládaný obsah – cookies lišty, chatboty, pop-upy načítané skriptem

Jak CLS zlepšit?

1. Vždy definujte width a height u obrázků – prohlížeč pak drží místo předem
2. Pro webfonty použijte font-display: swap a předem načtěte klíčové fonty pomocí <link rel="preload">
3. Cookies lištu a chatbot stylujte tak, aby netlačily obsah – umístěte je fixně mimo tok dokumentu
4. Rezervujte prostor pro reklamy – i když reklama není načtena, container má pevnou výšku

Praktická zkušenost: CLS problémy způsobené obrázky bez rozměrů jsou nejčastější chybou, kterou při technickém auditu nacházím. Přitom oprava zabere 10 minut.

INP – Interaction to Next Paint

Co to je a proč nahradilo FID?

Od března 2024 nahradilo INP původní metriku FID (First Input Delay). FID měřil pouze první interakci uživatele se stránkou – typicky první kliknutí. INP je přísnější: měří všechny interakce po celou dobu návštěvy a jako výsledné skóre bere tu nejhorší (po odfiltrování extrémů).

Jinými slovy – nestačí, aby stránka rychle reagovala při prvním kliku. Musí reagovat rychle po celou dobu.

Jak by měl INP vypadat?

Nejčastější příčiny špatného INP

Hlavním viníkem je téměř vždy příliš těžký JavaScript. Konkrétně:

• Zbytečné skripty třetích stran (live chaty, marketingové nástroje, pixely)
• Špatně napsané event listenery, které blokují hlavní vlákno prohlížeče
• Velké SPA frameworky načítané najednou
• Pluginy pro WordPress, které přidávají desítky skriptů na každou stránku

Jak INP zlepšit?

1. Auditujte skripty třetích stran – každý skript, který načítáte, zpomaluje reakce stránky. Načítejte jen to, co skutečně potřebujete.
2. Odkládejte nekritické skripty – použijte atributy async nebo defer
3. Deaktivujte pluginy, které nepoužíváte – na WordPressu je zbytečný plugin, který jen přidává JS, přímý problém pro INP
4. Zvažte load-on-interaction – live chat načtěte až po prvním kliku uživatele, ne při načtení stránky

Jak Core Web Vitals měřit?

Existují dva typy dat Core Web Vitals, a je důležité je rozlišovat:

Laboratorní data (Lab data) – simulovaná měření za kontrolovaných podmínek. Rychlá zpětná vazba při vývoji, ale neodráží reálné uživatele.

Reálná data (Field data / CrUX) – anonymizovaná data z Chrome prohlížečů skutečných návštěvníků vašeho webu. Tato data Google používá pro ranking.

PageSpeed Insights

PageSpeed Insights je nejjednodušší nástroj pro začátek. Zadáte URL, dostanete obě sady dat – laboratorní i reálná – a konkrétní doporučení pro zlepšení. Vždy testujte mobilní i desktopovou verzi zvlášť. Mobilní skóre je zpravidla horší a Google mu přikládá větší váhu.

Google Search Console

Google Search Console nabízí sekci Základní metriky webu (Core Web Vitals report), kde vidíte souhrnné výsledky pro celý web rozdělené do tří kategorií: dobré, vyžadující zlepšení, špatné. Na rozdíl od PageSpeed Insights zde uvidíte skupiny problematických URL najednou – to je klíčové pro větší weby.

Lighthouse

Lighthouse je nástroj zabudovaný přímo v Chrome DevTools (F12 → záložka Lighthouse). Používejte ho při vývoji a testování – spustíte audit přímo v prohlížeči bez odeslání dat na externí servery. Nezapomeňte, že Lighthouse pracuje výhradně s laboratorními daty.

Optimalizace Core Web Vitals na WordPressu

WordPress je zodpovědný za velkou část problémů s Core Web Vitals – ne proto, že by byl špatný, ale proto, že je flexibilní a majitelé webů na něj instalují desítky pluginů.

Hosting jako základ

Bez kvalitního hostingu ostatní optimalizace nepomůžou. Pro WordPress v roce 2026 doporučuji hostingy s PHP 8.2+, HTTP/2 nebo HTTP/3, a ideálně s LiteSpeed webserverem nebo alespoň Nginxem.

Pluginy, které skutečně pomohou

Pro cache a celkovou rychlost:

• LiteSpeed Cache – pokud váš hosting běží na LiteSpeed, je to nejsilnější možnost
• WP Rocket – prémiový plugin, nejsnadnější nastavení, nejlepší výsledky pro průměrného uživatele
• W3 Total Cache – zdarma, ale vyžaduje znalosti pro správné nastavení

Pro optimalizaci obrázků:

• ShortPixel nebo Imagify – automatická komprese a převod do WebP při uploadu

Pro skripty třetích stran:

• Asset CleanUp – umožňuje deaktivovat CSS a JS pluginů na konkrétních stránkách, kde nejsou potřeba
• Flying Scripts – odloží načítání skriptů třetích stran

Nastavení, která mají největší dopad

• Zapněte lazy loading pro obrázky (WordPress to dělá nativně od verze 5.5, ale zkontrolujte, že ho nemáte omylem vypnuté)
• Povolte GZIP nebo Brotli kompresi na serveru
• Nastavte dlouhé cache headers pro statické soubory (CSS, JS, obrázky)
• Přidejte preconnect pro domény třetích stran (Google Fonts, CDN)

Optimalizace Core Web Vitals na Shoptetu

Shoptet je platformou pro e-shopy a přístup k optimalizaci je zde odlišný – nemáte přístup k serverové konfiguraci a PHP. Platí pravidlo: ovlivnit můžete dost, ale ne vše.

Co na Shoptetu ovlivnit můžete

Obrázky produktů jsou vaší největší pákou. Shoptet sice obrázky automaticky komprimuje, ale výsledek závisí na tom, co nahrajete. Nahrajte vždy:

• Obrázky ve správném rozlišení (ne fotky z foťáku v plném rozlišení)
• Ideálně již v WebP, pokud to váš workflow umožňuje

Šablona (template) zásadně ovlivňuje CWV. Šablony třetích stran mohou mít nadměrný JavaScript nebo CSS. Před zakoupením šablony si změřte její demo v PageSpeed Insights.

Aplikace a rozšíření z Shoptet Doplňků přidávají skripty – každý nainstalovaný doplněk zpomaluje web. Mějte nainstalované jen to, co aktivně používáte.

Co na Shoptetu ovlivnit nemůžete

• Výběr hostingu a serveru – to řídí Shoptet centrálně
• Serverovou konfiguraci, cache na úrovni serveru
• PHP verzi a konfiguraci

Klíčový závěr pro Shoptet: Váš největší vliv na CWV spočívá ve výběru šablony, kvalitě obrázků a minimalizaci nainstalovaných doplňků. Pokud jsou vaše CWV špatné i po optimalizaci těchto tří věcí, pravděpodobně se jedná o problém na straně platformy.

Checklist pro zlepšení Core Web Vitals

Projděte postupně body níže. Začněte od těch, které mají největší pravděpodobný dopad na váš konkrétní web.

LCP

• Hlavní hero obrázek je v WebP a má správné rozměry
• Na hero obrázku je nastaven atribut fetchpriority="high"
• PageSpeed skóre na mobilu je nad 70 bodů
• Web běží na kvalitním hostingu
• Je zapnutá serverová cache nebo cache plugin

CLS

• Všechny obrázky mají definované atributy width a height
• Webfonty používají font-display: swap
• Cookies lišta a chatbot netlačí obsah (jsou fixně pozicované)
• Pro reklamní plochy je rezervovaný prostor pevné výšky

INP

• Skripty třetích stran jsou načítány s async nebo defer
• Na WordPressu jsou deaktivovány nepoužívané pluginy
• Live chat nebo jiné těžké widgety jsou načítány až po interakci
• V DevTools → Performance není žádný skript blokující hlavní vlákno déle než 50 ms

Měření

• Je nastavena Google Search Console a jsou v ní dostupná CWV data
• Jsou pravidelně kontrolovány reporty Core Web Vitals v GSC
• Po každé větší změně webu je proveden test v PageSpeed Insights

Časté otázky o Core Web Vitals

Musím mít všechny tři metriky v zeleném pásmu?

Ideálně ano. Google pro hodnocení webu z pohledu Page Experience signálu vyžaduje, aby všechny tři metriky byly v dobrém pásmu. Web, který má skvělé LCP, ale špatné CLS, nemá Page Experience označen jako dobrý.

Jak rychle se zlepšení CWV projeví v pozicích?

Google aktualizuje CrUX data (reálná data z prohlížečů) přibližně každých 28 dní. Zlepšení pozic po optimalizaci CWV tedy typicky uvidíte za 4-8 týdnů. Laboratorní data (PageSpeed Insights) se promítnou okamžitě.

Mám špatné skóre v PageSpeed Insights, ale v Search Console mám zelené výsledky. Jak je to možné?

To je zcela normální. PageSpeed Insights ukazuje simulovaná laboratorní data – simuluje pomalé mobilní zařízení a 4G připojení. Search Console naopak zobrazuje reálná data z prohlížečů skutečných návštěvníků vašeho webu. Pro SEO jsou rozhodující data v Search Console.

Core Web Vitals jsou skvělé, ale web přesto nestoupá. Proč?

CWV jsou jedním z desítek rankingových faktorů. Bez kvalitního obsahu cíleného na správná klíčová slova a bez zpětných odkazů samotné technické skóre pozice nezajistí. Pokud si nejste jistí, kde je problém, pomůže komplexní SEO analýza.

Shrnutí

Core Web Vitals jsou tři metriky – LCP, CLS a INP – které Google používá k měření uživatelského zážitku a které ovlivňují pozice ve vyhledávání. Nejde o čistě technickou záležitost pro vývojáře; jde o signály, které přímo vypovídají o tom, jestli váš web návštěvníky vítá nebo frustruje.

Klíčové body, které si odneste:

• LCP pod 2,5 s – optimalizujte obrázky, hosting a cache
• CLS pod 0,1 – definujte rozměry obrázků, stabilizujte layout
• INP pod 200 ms – auditujte a redukujte JavaScript třetích stran
• Měřte v Search Console – laboratorní data z PageSpeed Insights jsou jen orientační
• WordPress a Shoptet mají odlišné možnosti optimalizace – znáte-li limity své platformy, ušetříte čas

Pokud jste si prošli checklist a stále nevíte, kde přesně problém hledat, nebo nechcete optimalizaci řešit sami, technická SEO analýza odhalí konkrétní příčiny a navrhne prioritizovaný plán oprav.

Nechte si provést technický audit webu → Objednat analýzu

Související články:

• Jak se dostat na Google Mapy
• Jak zvýšit návštěvnost webu
• Jak vybrat e-shopové řešení