Vissza a blogra

    JavaScript-oldal a Google-ben: mit lát a Googlebot?

    SEO
    6 perc olvasás
    Tamas Vedres
    Laptop képernyőjén elmosódott, olvashatatlan forráskód, mellette egy második monitoron egy weboldal elrendezésének drótváza, irodai asztalon

    Sok mai weboldal, például a React alapú oldalak, a tartalmát JavaScripttel rakja össze a böngészőben. Ilyenkor jogos a kérdés: a Google is azt látja, amit a látogató? A Google Search Central útmutatója, az Understand the JavaScript SEO basics szerint a Google Search a Chromium mindig friss változatával futtatja a JavaScriptet, de van néhány dolog, amit érdemes optimalizálni. Az alábbiakban ezt és a kapcsolódó hibaelhárítási útmutatót foglaljuk össze weboldal-üzemeltetői szemmel.

    Hogyan dolgozza fel a Google a JavaScriptes oldalt?

    Az útmutató szerint a Google három fő lépésben dolgozza fel a JavaScriptes webalkalmazásokat: feltérképezés (crawling), renderelés és indexelés. A Googlebot először azt nézi meg a robots.txt fájlban, hogy lekérheti-e az adott URL-t. A tiltott fájlokból és oldalakról a Google nem renderel JavaScriptet.

    Ezután a Googlebot minden 200-as HTTP-állapotkódú oldalt renderelési sorba tesz, kivéve, ha robots metacímke vagy fejléc tiltja az indexelést. Az útmutató szerint az oldal néhány másodpercig is lehet ebben a sorban, de tovább is tarthat. Amikor a Google erőforrásai engedik, egy fej nélküli Chromium rendereli az oldalt és lefuttatja a JavaScriptet. A Google a renderelt HTML-t használja az indexeléshez, és abban újra linkeket keres.

    Mi a gond az „üres” kezdő HTML-lel?

    A klasszikus, szerveroldalon renderelt oldalaknál a HTTP-válasz HTML-je már a teljes tartalmat tartalmazza. Az úgynevezett app shell modellnél viszont a kezdő HTML-ben nincs benne a tényleges tartalom, és a Google-nek előbb le kell futtatnia a JavaScriptet, hogy lássa azt, amit a JavaScript előállít.

    A Google ezt meg tudja oldani, de az útmutató szerint a szerveroldali renderelés vagy az előrenderelés továbbra is nagyon jó ötlet, mert gyorsabbá teszi az oldalt a felhasználóknak és a keresőrobotoknak is, és nem minden robot tud JavaScriptet futtatni. A dinamikus renderelésről szóló oldal hozzáteszi: más keresők dönthetnek úgy, hogy figyelmen kívül hagyják a JavaScriptet, és nem látják a JavaScripttel előállított tartalmat.

    Mire figyeljünk egy JavaScriptes oldalon?

    Az útmutató alapján ezek a leggyakoribb buktatók:

    • Linkek: a Google csak azokat a linkeket találja meg, amelyek href attribútummal rendelkező <a> HTML-elemek. Az egyoldalas alkalmazásoknál a History API-t érdemes használni, és nem URL-töredékeket (például #/termekek) a különböző tartalmak betöltésére.
    • Cím és leírás: az egyedi, leíró title elem és meta description JavaScripttel is beállítható vagy módosítható.
    • Kanonikus URL: a legjobb HTML-ben megadni. Ha JavaScripttel kell, mindig ugyanarra az értékre állítsuk, mint az eredeti HTML-ben, és egy oldalon csak egy rel="canonical" címke legyen. A témáról kanonikus URL-es cikkünkben írtunk.
    • Hibaoldalak: a kliensoldali útválasztásnál az útmutató két megoldást javasol a soft 404 elkerülésére: JavaScript-átirányítást egy olyan URL-re, amelyre a szerver 404-es kóddal válaszol, vagy noindex robots metacímkét a hibaoldalon. Részletesen a soft 404-ről szóló cikkünkben írtunk.
    • Noindex: ha a Google noindex címkét talál, kihagyhatja a renderelést, ezért a noindex JavaScripttel történő eltávolítása nem biztos, hogy működik. Ha az oldalt indexeltetni szeretnénk, az eredeti kódban ne legyen noindex.

    Hogyan ellenőrizzük, mit lát a Google?

    A Google hibaelhárítási útmutatója szerint a Search Console URL-ellenőrző eszközével vagy a Rich Results Testtel nézhetjük meg, hogyan térképezi fel és rendereli a Google az adott URL-t. Itt láthatók a betöltött erőforrások, a JavaScript-konzol üzenetei és hibái, valamint a renderelt DOM.

    Az útmutató szerint a renderelő szolgáltatás oldalbetöltések között nem őrzi meg az állapotot: a Local Storage, a Session Storage és a sütik törlődnek. Az engedélyt kérő funkciókat, például a kamerahozzáférést a Googlebot elutasítja. Ami ezekhez kötött, azt a Google nem fogja látni.

    És a dinamikus renderelés?

    A Google dinamikus renderelésről szóló oldala szerint ez kerülőmegoldás volt, nem hosszú távú megoldás. Helyette szerveroldali renderelést, statikus renderelést vagy hidratálást javasol. Ha valaki mégis így dolgozik, a robotoknak és a látogatóknak hasonló tartalmat kell kapniuk, mert a teljesen eltérő tartalom álcázásnak (cloaking) minősülhet.

    Példa a gyakorlatból

    Vegyünk egy elképzelt kisvállalkozást, amelynek új, JavaScriptes weboldala a böngészőben hibátlanul működik, a Search Console-ban mégis több szolgáltatásoldal hiányzik. Az URL-ellenőrző eszköz renderelt HTML-jében kiderül, hogy a menü gombjai nem <a href> linkek, hanem kattintásra lefutó szkriptek, a régi URL-ek pedig 200-as kóddal „nem található” oldalt adnak.

    A fejlesztő a menüt valódi linkekre cseréli, a hibaoldalra noindex kerül, a szolgáltatásoldalak pedig előrenderelve, a tartalommal együtt érkeznek a HTML-ben. Ezután az URL-ellenőrzővel újra megnézik, hogy a renderelt HTML-ben ott van-e a szöveg és a linkek.

    Gyakori kérdések

    Látja a Google a JavaScripttel betöltött tartalmat?

    Az útmutató szerint igen, a Google a Chromium friss változatával rendereli az oldalt, és a renderelt HTML-t használja az indexeléshez. A renderelés azonban sorban állással jár, és nem minden robot futtat JavaScriptet.

    Kell szerveroldali renderelés a jó helyezéshez?

    Az útmutató nem teszi kötelezővé, de továbbra is nagyon jó ötletnek nevezi, mert gyorsabb a felhasználóknak és a robotoknak, és azoknak a robotoknak is elérhető a tartalom, amelyek nem futtatnak JavaScriptet.

    Miért nem látja a Google a menüből elérhető aloldalakat?

    Gyakori ok, hogy a menüpontok nem href attribútummal rendelkező <a> elemek, vagy URL-töredékekkel (#) váltanak tartalmat. A Google csak a valódi linkeket tudja megbízhatóan felfedezni.

    Kíváncsi, mit lát a Google az Ön JavaScriptes oldalából? Kérjen konzultációt, és átnézzük együtt.

    Források: Google Search Central, Understand the JavaScript SEO basics (frissítve 2026. március 4.); Google Search Central, Fix Search-related JavaScript problems (frissítve 2025. december 18.); Google Search Central, Dynamic rendering as a workaround (frissítve 2025. december 10.).

    Címkék:
    JavaScript SEO