Page Speed Checker

Mi ez az eszköz?#

A Page Speed Checker egy ingyenes online eszköz, amely elemzi a weboldalak betöltési sebességét és a Google Core Web Vitals metrikáit. Az eszköz mobil és desktop nézetben is teszteli az oldalt, és konkrét javítási javaslatokat ad a teljesítmény növeléséhez.

Az oldal sebessége 2021 óta hivatalos Google rangsorolási tényező. A lassú oldalak nem csak a keresési pozíciókat rontják, hanem a felhasználói élményt és a konverziós arányt is. Kutatások szerint minden további másodperc betöltési idő 7%-kal csökkenti a konverziót.

Eszköz funkciói#

Az eszköz az alábbi metrikákat elemzi és értékeli:

Metrika	Angol név	Mit mér?	Jó érték
LCP	Largest Contentful Paint	A legnagyobb elem megjelenési ideje	≤ 2.5s
FID	First Input Delay	Az első interakció késleltetése	≤ 100ms
CLS	Cumulative Layout Shift	Vizuális stabilitás	≤ 0.1
FCP	First Contentful Paint	Az első tartalom megjelenése	≤ 1.8s
TTFB	Time to First Byte	Szerver válaszidő	≤ 800ms
SI	Speed Index	Vizuális betöltés sebessége	≤ 3.4s
TBT	Total Blocking Time	Fő szál blokkolási ideje	≤ 200ms

Az első három (LCP, FID, CLS) alkotja a Core Web Vitals hármast, amelyet a Google közvetlenül használ a rangsoroláshoz.

Info

ℹ️ Fontos: Ez az eszköz szimulált eredményeket generál demonstrációs célból. Éles mérésekhez használd a Google PageSpeed Insights vagy a web.dev/measure szolgáltatást, amelyek valós CrUX adatokat is tartalmaznak.

Használati útmutató#

1. Add meg az URL-t: Írd be az ellenőrizni kívánt weboldal címét. A https:// előtag automatikusan hozzáadódik, ha hiányzik.

2. Válaszd ki az eszközt: Kattints a Mobil vagy Desktop gombra. A mobil teszt szigorúbb feltételeket szimulál.

3. Indítsd el az elemzést: Kattints a „Sebesség elemzése" gombra és várd meg az eredményt.

4. Értelmezd az eredményeket: A teljesítmény pontszám és az egyes metrikák színkódolva jelennek meg (zöld = jó, sárga = fejlesztendő, piros = gyenge).

5. Kövesd a javaslatokat: Az eszköz automatikusan generál javítási javaslatokat a gyenge metrikákhoz.

Példa elemzés#

Tegyük fel, hogy egy webshop főoldalát elemzed. Tipikus eredmények és értelmezésük:

Metrika	Érték	Értékelés	Teendő
LCP	3.2s	🟡 Fejlesztendő	Hero kép optimalizálás
FID	45ms	🟢 Jó	Nincs teendő
CLS	0.18	🟡 Fejlesztendő	Képméretek megadása
FCP	2.1s	🟡 Fejlesztendő	Critical CSS inline
TTFB	650ms	🟢 Jó	Nincs teendő

Ez az oldal 70-80 pontos teljesítményt érne el, ami fejlesztendő kategória. A fő problémák: túl nagy hero kép és hiányzó képméretek.

Érvényességi tartomány#

Az eszköz bármilyen publikusan elérhető weboldalt képes elemezni. Korlátozások:

Működik	Nem működik
Publikus weboldalak	Bejelentkezés mögötti oldalak
HTTP és HTTPS	Localhost, belső hálózat
Bármilyen domain	IP cím alapú elérés
Főoldal és aloldalak	JavaScript-only SPA első betöltés

Warning

⚠️ Az eredmények tájékoztató jellegűek. A valós teljesítmény függ a szerver terhelésétől, a felhasználó földrajzi helyétől és a hálózati körülményektől. Mindig a Google hivatalos eszközeit használd végleges döntésekhez.

Technikai háttér#

A Core Web Vitals metrikák a valós felhasználói élményt mérik, nem a szerver-oldali teljesítményt. A Google a Chrome User Experience Report (CrUX) adatbázisából gyűjti ezeket az adatokat, amely valós Chrome felhasználók méréseit tartalmazza.

A metrikák közötti összefüggések:

TTFB → FCP → LCP: A szerver válaszidő (TTFB) közvetlenül befolyásolja az első tartalom (FCP) és a legnagyobb elem (LCP) megjelenését. Ha a TTFB magas, a többi metrika is lassul.

TBT ↔ FID: A Total Blocking Time és a First Input Delay szorosan összefügg. Ha a JavaScript sokáig blokkolja a fő szálat, a felhasználói interakciók késnek.

CLS független: A Cumulative Layout Shift nem a sebességről, hanem a vizuális stabilitásról szól. Gyors oldal is lehet instabil, ha az elemek ugrálnak.

Részletes technikai útmutatóért lásd a Core Web Vitals Optimalizálás cikkünket.

Gyakorlati tippek#

A leggyakoribb problémák és megoldásaik:

Lassú LCP (>2.5s):

• Használj WebP vagy AVIF képformátumot
• Állíts be lazy loading-ot a hajtás alatti képekre
• Preload-old a hero képet: <link rel="preload" as="image" href="hero.webp">
• Használj CDN-t a statikus tartalmakhoz

Magas CLS (>0.1):

• Mindig add meg a képek width és height attribútumát
• Használj aspect-ratio CSS tulajdonságot
• Foglalj helyet a hirdetéseknek és beágyazásoknak
• Kerüld a dinamikusan beszúrt tartalmat a hajtás felett

Lassú FCP (>1.8s):

• Inline-old a critical CSS-t
• Defer-eld a nem kritikus JavaScript-et
• Használj font-display: swap a webfontokhoz
• Csökkentsd a szerver válaszidőt (cache, CDN)

Tip

💡 Kezdd mindig a legnagyobb hatású javításokkal. Egy 200KB-os hero kép 50KB-ra csökkentése nagyobb hatású, mint 10 apró JavaScript optimalizálás együttvéve.

Kapcsolódó eszközök#

Eszköz	Funkció
Meta Description Ellenőrző	Meta leírások hossz és minőség ellenőrzése
Title Tag Optimizer	Címkék optimalizálása keresőknek
Schema Generator	Strukturált adatok generálása
Mobile Friendly Test	Mobilbarátság ellenőrzése

Külső referencia eszközök:

• Google PageSpeed Insights – Hivatalos Google eszköz CrUX adatokkal
• GTmetrix – Részletes waterfall elemzés
• WebPageTest – Haladó teljesítménytesztek

Gyakran Ismételt Kérdések (FAQ)#

Mit mér a Page Speed Checker?

A Page Speed Checker a Google Core Web Vitals metrikáit elemzi: LCP (Largest Contentful Paint), FID (First Input Delay), CLS (Cumulative Layout Shift), valamint további teljesítménymutatókat mint FCP, TTFB, Speed Index és Total Blocking Time. Ezek együttesen mutatják meg, mennyire gyors és felhasználóbarát egy weboldal.

Mi az a jó teljesítmény pontszám?

A Google skálája szerint: 90-100 pont = Jó (zöld), 50-89 pont = Fejlesztendő (sárga), 0-49 pont = Gyenge (piros). A legtöbb SEO szakértő 80+ pontot javasol célként mobilon, és 90+ pontot desktopon. A pontszám közvetlenül befolyásolja a keresési rangsorolást.

Miért más a mobil és desktop eredmény?

A mobil teszt lassabb hálózati kapcsolatot (4G) és gyengébb processzort szimulál, ami reálisabban tükrözi a felhasználók többségének élményét. A Google mobile-first indexelést használ, ezért a mobil pontszám fontosabb a SEO szempontjából.

Hogyan javíthatom az LCP értéket?

Az LCP javításához: optimalizáld a hero képet (WebP formátum, megfelelő méret), használj lazy loading-ot a hajtás alatti képekhez, kapcsold be a szerver-oldali cache-t, használj CDN-t, és csökkentsd a render-blocking CSS/JS fájlokat. A cél az LCP 2.5 másodperc alatt.

Mit jelent a CLS és hogyan csökkenthető?

A CLS (Cumulative Layout Shift) azt méri, mennyire mozognak el váratlanul az elemek betöltés közben. Csökkentéséhez: adj meg explicit width és height attribútumokat a képeknek, használj font-display: swap-ot a betűtípusoknál, és foglalj helyet a dinamikusan betöltődő tartalmaknak (hirdetések, beágyazások). A cél 0.1 alatti CLS érték.