Eräänä sunnuntaiaamuna 14-pöytäisen aamiaispaikan omistaja Çankayassa, Ankarassa, viestii: "Asiakkaat sulkevat ruokalistan ennen kuin se latautuu." Search Console näytti sijaa 47 hakusanalla "ruokalista"; PageSpeed mobile 31/100, LCP 4,2 sekuntia. WordPress 18 lisäosalla ja pakkaamaton 3,2 MB hero-kuva. Neljä viikkoa thMenu-siirron jälkeen: LCP 1,6 sekuntia, mobile-pisteet 94/100, orgaaniset klikit plus 42 prosenttia.
Kolme mittaria, kolme rajaa
Vuodesta 2024 lähtien Core Web Vitals on Googlen virallinen mobiilihakusignaali. Ravintolasivut arvioidaan LCP:llä (pääsisältö ilmestyy), INP:llä (kosketuksen vastausaika) ja CLS:llä (visuaalinen vakaus).
Vihreät rajat 2026:
- LCP alle 2,5 s
- INP alle 200 ms (korvasi FID:n maaliskuussa 2024)
- CLS alle 0,1
thMenu-oletus: 1,8 s LCP
195 thMenu-ravintolan keskimääräinen mobiili-LCP (4G, P75) on 1,8 sekuntia. Neljä arkkitehtuurivalintaa: Cloudflare CDN (250+ POPia), automaattinen WebP/AVIF-muunnos responsiivisella srcsetillä, inline critical CSS ja viivästetty JS, sekä ISR (5 minuutin välimuisti ja on-demand revalidate).
INP:lle React Server Components ovat oletus; vain CartDrawer ja kategoriasuodatin pyörivät asiakaspuolella. JS-paketti gzip-pakattuna 68 KB. CLS:lle kaikilla kuvilla on selkeät width/height, ja hero varaa tilan aspect-ratio CSS:llä.
Työkalut ja Ankaran tapaus
Työnkulku: PageSpeed Insights CrUX-kenttädatalle, WebPageTest 3G/4G-vesiputouskaavioon, Search Console URL-ryhmille punaisella. Ankaran tapauksessa PageSpeed osoitti 3,2 MB:n hero-kuvan ja 14 kolmannen osapuolen skriptiä syyllisiksi.
Siirron jälkeen: hero AVIF:iin, kolmannen osapuolen ketju poistettu, INP 480 ms:sta 120 ms:iin. Neljä viikkoa myöhemmin "ruokalista"-sijoitus nousi 47:stä 14:ään, päivittäiset orgaaniset klikit 23:sta 33:een (plus 42 prosenttia). SearchGPT alkoi myös suositella ravintolaa kolmen kärjessä.
UKK
Nykyinen LCP 5 s, mikä yksittäinen muutos auttaa eniten? Kuvanoptimointi: WebP/AVIF ja oikea koko. Tyypillinen voitto 2-3 sekuntia.
Miten lasken INP:tä? Pieni paketti, RSC, kolmansien osapuolten skriptien poisto tai viivästys.
Miten löydän CLS:n syyn? PageSpeed "Avoid large layout shifts" -diagnostiikka. Yleensä kuvat ilman mittoja tai evästebannerit.
Oliko tästä hyötyä? Jaa se.
Aiheeseen liittyvät artikkelit
Staattinen QR vs dynaaminen QR: 3 vuoden kokonaiskustannusvertailu
24 pöydän bistro, 36 kuukautta: uudelleenpainatukset 21 000 TRY vs dynaaminen ti…
Omotenashi ja QR: japanilainen vieraanvaraisuus säilyttäen inhimillisen otteen
Miksi Tokion Sukiyabashi Jiro hylkii QR-ruokalistoja, kun 68% keskitason izakayo…
AR-ruokaesikatselu WebXR:llä: selain-3D ilman sovellusta
Kuinka Dishoom Soho saavutti +22% keskimääräisen tilauksen model-viewerillä. All…