SPA és headless webshop: mit lát az AI-crawler?
Publikálva:
A headless vagy SPA webshop tartalma a legtöbb AI-crawlernek üres, mert a ChatGPT és a Perplexity botjai többnyire nem futtatnak JavaScriptet — a Google indexelője viszont igen. A megoldás a szerver-oldali renderelés vagy statikus generálás: a termékadat és a séma már a nyers HTML-ben legyen ott.
Miért üres az oldalad a ChatGPT-nek?
A modern, kliens-oldalon renderelő webshop — a single-page app és a headless felállások jó része — úgy működik, hogy a szerver egy csaknem üres HTML-vázat küld, és a tartalmat a böngészőben futó JavaScript építi fel. Az embernek ez gyors és szép. A gépnek viszont az számít, mit kap a szervertől.
A kutatásunk mérési beállítása is ezt a valóságot tükrözi: a ChatGPT és a Perplexity botjai a legtöbb esetben nem futtatnak JavaScriptet, amikor egy oldalt beolvasnak. Nekik a kliens-oldalon összeálló bolt szó szerint üres lap — se terméknév, se ár, se séma. Hogy ez a gyakorlatban mit jelent, azt a hogyan látja a ChatGPT a webshopot cikk mutatja meg.
A Google kivétel — de ott is van ára a JavaScriptnek
A Google indexelője futtat JavaScriptet: a hivatalos dokumentáció szerint a feldolgozás szakaszokban történik — feltérképezés, renderelés, indexelés —, és a renderelés késleltetve, külön sorban zajlik (Google: JavaScript SEO alapok). Vagyis a Google végül látja a JavaScripttel épült tartalmat is, csak később és drágábban — és a Google saját ajánlása is az, hogy a fontos tartalom szerver-oldalon vagy előrenderelve érkezzen.
A kép tehát aszimmetrikus: a Google-nél a kliens-oldali renderelés lassabb és kockázatosabb út, a legtöbb AI-crawlernél pedig járhatatlan. A közös nevező mindkét világban ugyanaz: ami a nyers HTML-ben ott van, az biztosan látszik.
Így ellenőrizd, mit lát a bot a webshopodból
- Nyisd meg a termékoldal forráskódját („Oldal forrásának megtekintése" — nem a fejlesztői eszközök élő nézete!), és keresd meg benne a terméknevet és az árat.
- Ha a nyers forrásban nincsenek ott, csak a renderelt nézetben — a legtöbb AI-crawler számára az oldalad üres.
- Ugyanígy keresd meg a sémát: van-e a nyers HTML-ben Product JSON-LD blokk.
Megoldás: SSR, statikus generálás, kritikus tartalom a nyers HTML-ben
A headless felállást nem kell eldobni — a renderelést kell jó helyre tenni. A szerver-oldali renderelés (SSR) és a statikus generálás egyaránt azt éri el, hogy a bot kész HTML-t kapjon; a hibrid megoldásoknál pedig az az elv, hogy legalább a kritikus tartalom — terméknév, ár, készlet, séma — kerüljön a nyers válaszba.
És egy fontos társfeltétel: a renderelés áthelyezése ne tegye lassúvá a szervert — a kivárhatatlan válaszidő ugyanúgy láthatatlanság, erről az amikor a bot nem várja ki cikk szól.
A lényeg röviden
A kérdés nem az, hogy modern-e a webshopod technológiája, hanem az, hogy mit kap belőle a gép az első kérésre. Ha a nyers HTML-ben ott a tartalom és a séma, minden rendszer — Google, ChatGPT, Perplexity — olvasni tudja. Ha csak JavaScript után áll össze, a láthatóságod a botok türelmén múlik, és a többségüknek nincs.