====== Core Web Vitals: Komplexní přehled ====== **Core Web Vitals (CWV)** je sada specifických, standardizovaných metrik vyvinutých společností Google. Jejich cílem je objektivně měřit a hodnotit **uživatelskou zkušenost (User Experience - UX)** na webových stránkách. Zatímco dříve se rychlost webu měřila pouhým časem do úplného načtení (který uživateli nic neříká o tom, kdy reálně může web začít používat), Core Web Vitals se zaměřují na to, jak stránku vnímá a prožívá skutečný člověk. Od roku 2021 jsou tyto metriky oficiálním **hodnotícím faktorem pro SEO** (Search Engine Optimization). Pokud web nesplňuje limity stanovené Googlem, je penalizován ve výsledcích vyhledávání. ===== Svatá trojice metrik Core Web Vitals ===== Google v současnosti definuje tři hlavní metriky, které pokrývají tři odlišné pilíře uživatelského zážitku: rychlost načítání, interaktivitu a vizuální stabilitu. ==== 1. Largest Contentful Paint (LCP) – Rychlost načítání ==== LCP měří, za jak dlouho se v prohlížeči vykreslí **největší obsahový prvek** viditelný na úvodní obrazovce (tzv. //above the fold//). Tímto prvkem bývá typicky velký úvodní obrázek (Hero image), úvodní video, nebo největší blok nadpisu a textu. Jedná se o psychologicky nejdůležitější metriku – uživateli dává jasný vizuální signál, že "stránka je načtená a funguje". * **Dobré (Zelená):** Méně než 2,5 sekundy * **Vyžaduje zlepšení (Oranžová):** 2,5 – 4,0 sekundy * **Špatné (Červená):** Více než 4,0 sekundy ==== 2. Interaction to Next Paint (INP) – Odezva a interaktivita ==== Metrika INP (která v březnu 2024 oficiálně nahradila starší a méně přesnou metriku FID – //First Input Delay//) měří **celkovou reaktivitu stránky na uživatelské vstupy**. Sleduje celkovou latenci (zpoždění) od chvíle, kdy uživatel na cokoliv klikne nebo tapne prstem, až do chvíle, kdy prohlížeč na tento podnět vizuálně zareaguje vykreslením dalšího snímku. INP nemonitoruje jen první kliknutí, ale agreguje data z interakcí po celou dobu návštěvy uživatele. * **Dobré (Zelená):** Méně než 200 milisekund * **Vyžaduje zlepšení (Oranžová):** 200 – 500 milisekund * **Špatné (Červená):** Více než 500 milisekund ==== 3. Cumulative Layout Shift (CLS) – Vizuální stabilita ==== CLS měří **neočekávané posuny rozvržení** stránky během jejího načítání a prohlížení. Řeší jeden z nejvíce frustrujících jevů na webu: uživatel chce kliknout na tlačítko, ale zlomek sekundy předtím se nad tlačítkem načte reklamní banner bez předem definovaných rozměrů. Tlačítko uskočí dolů a uživatel klikne na něco, na co nechtěl. CLS se nepočítá v sekundách, ale jako bezrozměrné skóre. * **Dobré (Zelená):** Skóre pod 0,1 * **Vyžaduje zlepšení (Oranžová):** Skóre 0,1 – 0,25 * **Špatné (Červená):** Skóre nad 0,25 ===== Terénní vs. Laboratorní data (Field vs. Lab data) ===== Při analýze Core Web Vitals je kritické rozlišovat, odkud pocházejí měřená data. Mnoho vývojářů dělá chybu, že svůj web testuje pouze v laboratorním prostředí. * **Terénní data (Field Data / RUM - Real User Monitoring):** Toto jsou skutečná data sbíraná společností Google z prohlížečů Chrome reálných uživatelů (přes //Chrome User Experience Report - CrUX//). Reflektují reálnou rychlost na starých mobilech nebo pomalém 3G připojení ve vlaku. **Pouze tato data ovlivňují SEO.** Zpracovávají se jako 28denní klouzavý průměr (hodnotí se 75. percentil uživatelů). * **Laboratorní data (Lab Data):** Výsledky jednorázového syntetického testu (např. přes nástroj Lighthouse), obvykle s velmi rychlým připojením a výkonným počítačem. Slouží výhradně vývojářům k okamžitému odhalování chyb při programování, pro Google vyhledávač nemají žádnou váhu. ===== Nástroje pro analýzu a měření ===== Google poskytuje kompletní ekosystém nástrojů pro diagnostiku těchto metrik: * **PageSpeed Insights (PSI):** Hlavní webový nástroj, který ukazuje jak terénní data (CrUX) za posledních 28 dní, tak aktuální laboratorní data (Lighthouse) rozdělená pro mobilní a desktopová zařízení. * **Google Search Console:** Nástroj pro majitele webů. Obsahuje záložku Core Web Vitals, kde hromadně ukazuje, které konkrétní URL adresy na webu mají problémy. * **Chrome DevTools (Performance tab):** Nástroj zabudovaný přímo v prohlížeči Chrome (klávesa F12) pro hloubkovou analýzu, profilování JavaScriptu a hledání prvků, které způsobují blokování hlavního vlákna nebo posuny (CLS). ===== Rychlý přehled metrik ===== Následující tabulka slouží jako rychlý tahák pro hodnocení metrik u 75 % všech návštěv. ^ Metrika ^ Zaměření na oblast UX ^ Ideální hodnota (Dobré) ^ Kritická hodnota (Špatné) ^ Hlavní příčina problémů ^ | **LCP** | Rychlost vykreslení | Méně než 2,5 s | Více než 4,0 s | Neoptimalizované obří obrázky, pomalý server (TTFB) | | **INP** | Interaktivita a odezva | Méně než 200 ms | Více než 500 ms | Masivní spouštění JavaScriptu, blokování hlavního vlákna | | **CLS** | Vizuální stabilita | Skóre pod 0,1 | Skóre nad 0,25 | Obrázky a reklamy bez "width" a "height", asynchronní fonty | ~~NOTOC~~