SEO JavaScript

Jak zadbać, aby wyszukiwarki mogły pobierać, renderować i indeksować treści zależne od JavaScriptu — prawdziwe linki, zgodność DOM, leniwe ładowanie, przewijanie nieskończone i pozorne błędy braku strony.

Opublikowano po raz pierwszy: 23 cze 2026 · Ostatnia aktualizacja: 3 sie 2026 · Zaawansowane
1 sygnał dowodowy na tej stronie

SEO JavaScript dotyczy tego, czy wyszukiwarki mogą pobrać, wyrenderować i zindeksować treść zależną od skryptów. Google potrafi uruchamiać JavaScript, lecz problemy wynikają ze zgodności surowego i wyrenderowanego DOM-u, wymaganych interakcji, braku trwałego stanu oraz czasu wykonania. Stosuj prawdziwe odnośniki, nie blokuj plików JS i CSS, preferuj SSR lub prerenderowanie dla kluczowej treści i uważaj, by przewijanie nieskończone nie połączyło dwóch stron pod jednym adresem.

TL;DR — Google potrafi uruchamiać JavaScript, więc pytanie „Czy Google czyta JS?” jest niewłaściwe. Awarie dotyczą zgodności surowego i wyrenderowanego DOM-u, interakcji, stanu i czasu wykonania. Używaj prawdziwych linków <a href>, nie blokuj JS ani CSS, wczytuj treść po wejściu w obszar wyświetlania i zwracaj prawdziwe statusy dla błędów 404. Początkowe noindex może zatrzymać renderowanie, zanim skrypt zdoła je usunąć. Szczególnie testuj przewijanie nieskończone: wysoki obszar renderowania może uruchomić moduł i połączyć dwa adresy pod jedną stroną. Więcej o mechanizmie i trybach: renderowanie.

Czy Google potrafi odczytać JavaScript? Tak — lecz nie o to należy pytać

Google może run twój JavaScript — the real risks są parity, interaction, state, i timing. Źródło: /technical-seo/javascript-seo/

Od lewej do prawej przebiegają trzy etapy: pobieranie, renderowanie i indeksowanie. Etap renderowania rozgałęzia się na cztery tryby awarii: zgodność, gdy wyrenderowany DOM nie odpowiada oczekiwaniom; interakcję, gdy treść wymaga przewinięcia lub kliknięcia; stan, gdy treść zależy od plików cookie lub pamięci czyszczonej przez renderer; oraz czas, gdy treść jest opóźniana przez wolny JavaScript.

© Patrick Stox LLC · CC BY 4.0 ·

Google przetwarza aplikacje JavaScript w trzech etapach: “Google processes JavaScript web apps in three main phases: 1. Crawling 2. Rendering 3. Indexing.” (tłumaczenie) „Google przetwarza aplikacje internetowe JavaScript w trzech głównych etapach: pobieraniu, renderowaniu i indeksowaniu”. W środkowym etapie uruchamia skrypty w aktualnej, bezgłowej wersji Chrome i buduje DOM przeznaczony do indeksowania. “Rendering is important because websites often rely on JavaScript to bring content to the page, and without rendering Google might not see that content.” (tłumaczenie) „Renderowanie jest ważne, bo witryny często używają JavaScriptu do umieszczania treści na stronie, a bez renderowania Google może jej nie zobaczyć”.

Dowód potwierdzający to twierdzenie Google processes JavaScript web apps in three main phases: crawling, rendering, and indexing; without rendering, Google might not see JavaScript-provided content. Zakres: Google Search's processing of JavaScript pages; successful rendering does not guarantee indexing or ranking. Poziom ufności: wysoki · Zweryfikowano: Google Search Central: Understand the JavaScript SEO basics

Google zatem może uruchamiać JavaScript. Przydatne pytania są bardziej konkretne:

  • Zgodność — czy wyrenderowany DOM naprawdę zawiera oczekiwane elementy?
  • Interakcja — czy coś wymaga przewinięcia albo kliknięcia, którego Google nie wykona?
  • Stan — czy strona zależy od ciasteczek lub localStorage czyszczonych przez bezstanowy mechanizm?
  • Czas — czy ważna treść czeka na powolny lub późno wykonywany skrypt?

W przypadku czasu Google kieruje pobraną stronę z odpowiedzią 200 do renderowania, a “The page may stay on this queue for a few seconds, but it can take longer than that.” (tłumaczenie) „Strona może pozostać w tej kolejce przez kilka sekund, ale może to potrwać dłużej”. Nie ma opublikowanego stałego opóźnienia ani limitu czasu. Strona zwracająca status inny niż 200 albo początkową dyrektywę noindex może zostać pominięta zamiast czekać na zmianę przez skrypt.

Dowód potwierdzający to twierdzenie Google queues crawled pages with a 200 response for rendering; the page may stay in that queue for a few seconds but can take longer, with no published fixed delay or timeout, and non-200 or initial noindex responses may skip rendering. Zakres: Google Search's documented render-queue behavior; not a guaranteed or universal timing figure. Poziom ufności: wysoki · Zweryfikowano: Google Search Central: Understand the JavaScript SEO basics

Mechanikę renderowania Google — Web Rendering Service, brak trwałego stanu, pamięć podręczną i mit „dwóch fal” — opisuje strona o renderowaniu. Tutaj skupiam się na praktycznych problemach i poprawkach.

Linki muszą być prawdziwymi elementami <a href>

To najczęstszy błąd SEO JavaScript. “Google can only discover your links if they are <a> HTML elements with an href attribute.” (tłumaczenie) „Google może odkryć linki tylko wtedy, gdy są elementami HTML <a> z atrybutem href”. Klikalny <div> z procedurą onclick nie jest dla Google linkiem, więc strony zależne od niego mogą pozostać niepobrane. Linki można wstrzyknąć przez JavaScript, o ile w wyrenderowanym DOM-ie powstaną prawdziwe elementy <a href>. Są one jednak analizowane dopiero po uruchomieniu skryptu: odkrywalność nie gwarantuje pobrania, indeksowania ani identycznego traktowania jak link w surowym HTML-u.

Dowód potwierdzający to twierdzenie Google can reliably discover links only when they are HTML anchor elements with an href attribute. Zakres: Link discovery by Google Search; this does not claim that every discovered URL will be crawled or indexed. Poziom ufności: wysoki · Zweryfikowano: Google Search Central: Make your links crawlable

Treść leniwie ładowana i zależna od interakcji

Mechanizm renderowania nie zachowuje się jak ciekawy użytkownik: “Google Search does not interact with your page.” (tłumaczenie) „Wyszukiwarka Google nie wchodzi w interakcje z Twoją stroną”. Nie przewija, nie klika ani nie najeżdża kursorem, więc treść wczytywana wyłącznie po takich zdarzeniach pozostanie niewidoczna.

Google zaleca wczytywanie treści po wejściu w obszar wyświetlania, a nie po działaniu użytkownika: implementacja powinna “loads all relevant content whenever it is visible in the viewport” (tłumaczenie) „wczytywać całą istotną treść, gdy jest widoczna w obszarze wyświetlania”. Nie stosuj leniwego ładowania do treści widocznej od razu po otwarciu strony. Korzystaj z IntersectionObserver albo natywnego loading="lazy" dla obrazów, a nie z procedur przewijania czy kliknięcia.

Dowód potwierdzający to twierdzenie Google Search does not interact with a page, so lazy-loaded content should load when it becomes visible in the viewport rather than requiring user interaction. Zakres: Google Search's documented rendering behavior for lazy-loaded content; other crawlers can behave differently. Poziom ufności: wysoki · Zweryfikowano: Google Search Central: Fix lazy-loaded content

Przewijanie nieskończone: gdy dwie strony zostają zindeksowane jako jedna

Google's tall render viewport może trigger an infinite-scroll loader i merge two strony into one indexed URL. Źródło: /technical-seo/javascript-seo/

Standardowy obszar widoku przeglądarki kończy się po pierwszej stronie, lecz obszar renderowania Google jest znacznie wyższy. Dociera do wyzwalacza nieskończonego przewijania, uruchamia ładowanie bez faktycznego przewinięcia przez użytkownika i dołącza następną stronę do tego samego DOM. Google indeksuje wtedy treść obu stron pod jednym adresem URL.

© Patrick Stox LLC · CC BY 4.0 ·

To pułapka rzadko wyjaśniana, dlatego zasługuje na osobną sekcję.

Googlebot może renderować w obszarze znacznie wyższym niż typowe okno przeglądarki. Google nie publikuje dokładnego rozmiaru i może go zmieniać, dlatego testuj własną implementację zamiast projektować pod jedną liczbę. Jeśli moduł przewijania reaguje na pozycję lub wysokość obszaru, wyższy widok może uruchomić go już podczas renderowania i dołączyć treść następnego artykułu lub produktu do tego samego DOM-u. Wtedy Google może potraktować dwa adresy jako jedną stronę. Z mojego doświadczenia “occasionally, two pages get indexed as one” (tłumaczenie) „Czasami dwie strony są indeksowane jako jedna”. Zdarzało się, że strona oznaczona jako niezindeksowana była w rzeczywistości częścią poprzedniej strony, ponieważ “Google resized the viewport to be longer … it triggered the infinite scroll and loaded another article in when it was rendering.” (tłumaczenie) „Google wydłużyło obszar wyświetlania, uruchomiło przewijanie nieskończone i podczas renderowania wczytało kolejny artykuł”. Sprawdź wyrenderowany HTML w narzędziu do inspekcji, zamiast zakładać bezpieczeństwo konfiguracji.

Rozwiązanie ma dwie warstwy.

Najpierw uczyń przewijanie przyjaznym wyszukiwarkom. Pod mechanizmem przewijania zapewnij paginację. Każdy fragment powinien mieć własny trwały, unikalny adres, a jego treść nie powinna zmieniać się między wczytaniami. Unikaj względnych parametrów w rodzaju ?date=yesterday, łącz kolejne adresy prawdziwymi linkami <a href> i aktualizuj wyświetlany adres przez History API. Nie używaj fragmentu po # do numerowania stron, bo Google go ignoruje. Jak piszę w przewodniku po SEO JavaScript, “if you have an infinite scroll setup, I still recommend a paginated page version so that Google can still crawl properly.” (tłumaczenie) „Jeśli stosujesz przewijanie nieskończone, nadal zalecam wersję z paginacją, aby Google mogło prawidłowo pobierać strony”.

Jeśli wadliwy moduł aktywnie łączy strony, najszybsza poprawka jest bezpośrednia: zablokuj plik JavaScript obsługujący przewijanie, aby funkcja nie mogła się uruchomić. Bez działającego modułu kolejna treść nie zostanie dołączona podczas renderowania i każdy adres ponownie pokaże wyłącznie siebie.

Pozorne błędy 404 po routingu po stronie klienta

Aplikacje jednostronicowe mogą zmieniać treść bez zmiany statusu HTTP, dlatego widok „nie znaleziono” nadal bywa odpowiedzią 200. Google może sklasyfikować ją jako pozorny błąd 404 po ocenie treści, ale samo statyczne pobranie nie dowodzi takiej klasyfikacji. Stosuj History API, a dla rzeczywiście brakującego zasobu przejdź do adresu zwracającego prawdziwy status 404 albo dodaj noindex. Nie opieraj routingu na fragmentach URL: schemat pobierania AJAX jest wycofany od 2015 r.

Przekierowanie po stronie klienta ma podobny problem dowodowy: początkowa odpowiedź może pozostać 200 do czasu uruchomienia JavaScriptu. Google obsługuje przekierowania JavaScript tylko jako rozwiązanie awaryjne, gdy przekierowanie serwerowe lub meta refresh nie jest możliwe. Raportuj osobno statyczny status i zaobserwowaną nawigację po renderowaniu; nie zmieniaj statusu HTTP w audycie i nie nazywaj każdej zmiany adresu po renderowaniu przekierowaniem.

Nie block JavaScript lub CSS w robots.txt

Google nie wyrenderuje JavaScriptu z zablokowanych plików ani na zablokowanych stronach. Reguła robots.txt, która wyklucza pakiet albo katalog /_next/, /static/ czy /assets/, może całkowicie zepsuć renderowanie: Google pobierze powłokę, nie uruchomi skryptów i zindeksuje pustą stronę. W narzędziu do sprawdzania adresów URL przejrzyj zablokowane zasoby strony.

DOM parity i stage-aware robots directives

Porównaj surowy HTML ze źródła strony z wyrenderowanym HTML-em w narzędziu do sprawdzania adresów URL. Treść obecna wyłącznie po renderowaniu może być indeksowana, o ile renderowanie się powiedzie. Treść nieobecna w obu wersjach dla Google nie istnieje.

Google dokumentuje jedno ryzyko kolejności etapów: “When Google encounters the noindex tag, it may skip rendering and JavaScript execution, which means using JavaScript to change or remove the robots meta tag from noindex may not work as expected.” (tłumaczenie) „Gdy Google napotka noindex, może pominąć renderowanie i wykonanie JavaScriptu, więc zmiana lub usunięcie znacznika za pomocą skryptu może nie zadziałać”. Jeśli surowy HTML zawiera początkowy noindex, Google może zastosować go i nigdy nie uruchomić skryptu, który miał go usunąć.

Nie zamieniaj tego w uniwersalną regułę „wyrenderowana wersja wygrywa”. Uzgadnianie zależy od pola:

PoleCo można ustalić przez porównanie surowej i wyrenderowanej wersji
Główna treść i linkiGoogle może wykorzystać treść i prawdziwe linki <a href> utworzone podczas udanego renderowania. Obecność w surowym HTML-u zmniejsza tę zależność.
Tytuł i opisGoogle może przetwarzać metadane ustawione przez JavaScript, lecz tytuły i fragmenty wybiera z kilku źródeł. Pokazuj oba stany i nie gwarantuj wyboru jednej wartości.
Dyrektywy robotsSurowe noindex może zatrzymać renderowanie, więc usunięcie przez skrypt pozostanie niewidoczne. Późniejsze ograniczenie nie dowodzi anulowania wcześniejszego.
CanonicalWytyczne Google dla JavaScriptu odradzają ustawienie jednej wartości w źródle i zmianę przez skrypt. Stosuj jedną metodę i potwierdź jedną deklarację w wyrenderowanym nagłówku.
Status HTTP i przekierowanieJavaScript nie zmieni otrzymanego już statusu odpowiedzi. Zapisuj osobno status statyczny i zaobserwowaną nawigację po renderowaniu.

Dlatego audytor powinien przechowywać osobno źródło, wyrenderowany wynik, nagłówki odpowiedzi i stan zaobserwowany w wyszukiwarce, zamiast łączyć je w jedną „efektywną” wartość.

Pick a renderowanie mode że puts treść w DOM

Większość ryzyka SEO JavaScript wynika ze sposobu tworzenia HTML-u. SSR, generowanie statyczne, prerenderowanie i hydratacja umieszczają treść w DOM-ie od razu lub bardzo szybko, dzięki czemu widoczność mniej zależy od pomyślnego renderowania. Pełny CSR uzależnia od niego znacznie więcej. Renderowanie dynamiczne jest obejściem, nie równorzędnym rozwiązaniem: wytyczne Google z grudnia 2025 r. zalecają zamiast niego renderowanie serwerowe, statyczne albo hydratację. Pełne porównanie CSR, SSR, SSG, ISR, renderowania brzegowego, strumieniowego i dynamicznego znajduje się na stronie o renderowaniu. Google osobno wskazuje renderowanie po stronie serwera lub prerenderowanie jako dobre rozwiązanie dla użytkowników i crawlerów.

Dowód potwierdzający to twierdzenie Google describes server-side rendering or pre-rendering as a good idea because it makes a website faster for users and crawlers. Zakres: Google Search guidance for JavaScript sites; the source does not prescribe one framework or guarantee indexing. Poziom ufności: wysoki · Zweryfikowano: Google Search Central: Understand the JavaScript SEO basics

Jak test

Narzędzie do sprawdzania adresów URL w Search Console jest źródłem prawdy. Uruchom test na żywo, a następnie przejrzyj wyrenderowany HTML, zrzut ekranu, zasoby strony i komunikaty konsoli, aby zobaczyć, co się wczytało, a co zawiodło. Test wyników z elementami rozszerzonymi zapewnia szybką kontrolę HTML-u. Na dużą skalę użyj crawlera wykonującego JavaScript, takiego jak Ahrefs Site Audit lub Screaming Frog w trybie renderowania JS, i porównaj surowe oraz wyrenderowane wersje.

A render diff jest diagnostic, nie a score: investigate essential elements że appear only po JavaScript—lub disappear po rendering.

Przykładowa strona ma 1 tytuł zarówno w surowym, jak i wyrenderowanym HTML, 18 nagłówków w surowym HTML i 19 po renderowaniu, 42 linki wewnętrzne w surowym HTML i 71 po renderowaniu, 0 opisów produktów w surowym HTML i 12 po renderowaniu oraz 6 tagów kanonicznych w surowym HTML, lecz tylko 1 po renderowaniu. Są to dane syntetyczne.

JavaScript nie jest zły dla SEO, lecz różni się od rozwiązań znanych wielu specjalistom. Współpracuj z programistami, umieść ważną treść w DOM-ie i pozwól, aby o wyniku renderowania rozstrzygały narzędzia Google, a nie założenia.

Co dalej w klastrze SEO JavaScript

Ten hub jest mapą. Każdy z poniższych tematów to osobne pogłębione omówienie:

Renderowanie i architektura

  • SEO dla bezgłowego CMS-a — wpływ rozdzielonego frontendu na pobieranie, renderowanie, metadane, mapy witryn i adresy kanoniczne, wybór trybu oraz charakterystyczne awarie.

Poradniki dla frameworków

  • React SEO — ryzyko indeksowania przy CSR, renderowanie aplikacji React, React Router, History API, react-helmet-async i moment przejścia na Next.js.
  • Angular SEO — domyślne SPA, @angular/ssr, wbudowane usługi Title i Meta, prerenderowanie oraz hydratacja przyrostowa.
  • Next.js SEO — Pages Router i App Router, Metadata API, next/image, CWV, czas ISR, Googlebot, mapy witryn i częste błędy.
  • Nuxt SEO — domyślne SSR, useSeoMeta(), tryby renderowania, ekosystem @nuxtjs/seo i porównanie ze zwykłym Vue.
  • Vue SEO — domyślny CSR w Vue 3, createWebHistory(), @unhead/vue, prerenderowanie bez metaframeworka i wybór Nuxta.
  • Svelte SEO — Svelte i SvelteKit, domyślne SSR, <svelte:head>, pułapka adapter-static z ssr: false, adaptery i crawlery AI.
  • Astro SEO — domyślnie brak JS, architektura wysp, @astrojs/sitemap, astro:assets, View Transitions, History API, wyspy serwerowe i Core Web Vitals.

Dodaj notatkę eksperta

Przypnij cytat eksperta

Nowa osoba? Najpierw utwórz jej nieprzejęty profil na /admin/experts/ → Przypnij cytat eksperta .