JavaScript i SEO: Jesu li vaše stranice vidljive Googleu (a i ChatGPT-u?)

Problemi s renderiranjem putem JavaScript frameworka  mogu značiti SEO štetu, odnosno štetiti rangiranju u tražilicama. I Martin Splitt iz Googlea nedavno je upozorio na važnost rješavanja problema s Javascriptom. A kad skužite da vam JS smanjuje šanse da se pojavite među ChatGPT prijedlozima….

 

JavaScript koristi većina modernih web stranica jer omogućuje dinamično korisničko iskustvo. Uz Javu vaša stranica izgleda cool, „živa”. Ali istodobno dinamički sadržaj generiran JavaScriptom može doslovce biti  zakopan da ga Googlebot ne može pronaći. Iz tog razloga JavaScript može biti crna rupa SEO optimizacije.

Tražilice ovise o učinkovitom pretraživanju, prikazivanju i indeksiranju sadržaja. Loša implementacija JavaScripta rezultira izgubljenim pozicijama u rezultatima pretraživanja, ne samo na Googleu, već i na AI chatbotovima. Sve to znači manje prometa prema vama.  Jer ako vas „mašine“ ne vide, ne vide vas ni ljudi.

Optimizacija JavaScript web stranice za tražilice zahtijeva drugačiji pristup u usporedbi s tradicionalnim HTML stranicama.
Dok su tradicionalne HTML stranice Googleu i drugim tražilicama jednostavne za pretraživanje i indeksiranje, isto se ne može reći za JavaScript stranice.

 

Što je Javascript?

JavaScript je programski jezik koji se koristi za izradu interaktivnih i dinamičnih elemenata na web stranicama. Zajedno s HTML-om (koji strukturira sadržaj) i CSS-om (koji oblikuje izgled), JavaScript čini temeljnu tehnologiju modernog weba.

.JavaScript omogućuje funkcionalnosti koje HTML i CSS sami ne mogu, kao što su:

• Dinamičko učitavanje sadržaja bez ponovnog učitavanja stranice (npr. AJAX)
• Interaktivni elementi poput slajdera, padajućih izbornika, kalkulatora itd.
• Interaktivnosti ili reakcija na to što korisnik radi (klik, unos, pomicanje miša)
• Animacije i prijelazi
• Rad s podacima u real-timeu (npr. chatovi, live notifikacije)
• Izradu web aplikacija (npr. Gmail, Facebook, YouTube frontend)

 

Ako želite objašnjenje for dummies, evo ga:  Ako je  HTML je kostur stranice, CSS je njen izgled, a JavaScript je ono što joj daje život.

Ne možete ga “vidjeti” kao korisnik na stranici, osim ako ne zavirite u kod.

 

 

Zašto je JavaScript važan za SEO ?

Imate li JS na webu, nema panike. Većina modernih web stranica koristi JavaScript kako bi omogućila dinamično korisničko iskustvo.. I Google tehnički može pretraživati JavaScript. Ali to ne znači da hoće. Ako je vaš najvažniji sadržaj skriven iza slajdera, beskonačnog skrolanja ili dinamičkog učitavanja… velika je vjerojatnost da neće biti indeksiran. PROBLEM!

Drugim riječima, ako Googlebot ne uspije prikazati sadržaj, vaše se stranice možda neće rangirati visoko među rezultatima pretrage.

Evo što se može dogoditi (a da toga niste ni svjesni):

• Stranice mogu izgledati potpuno ok korisnicima, ali su nevidljive Googleu (bitno nije očima vidljivo:D)
• Bitni elementi na stranici poput H1 oznaka i internih linkova ne učitavaju se na vrijeme
• Crawl budget (resursi koje Google troši na vašu stranicu) se troši na animacije, a ne na ključan sadržaj
• Većina LLM-ova ne može renderirati sadržaj putem JavaScript frameworka, što dovodi do toga da ste im nevidljivi – ovo je prilično novi problem kojeg mnogi nisu ni svjesni.

 

 

Ovo su česti JavaScript SEO problemi i rješenja:

1. Klijentsko renderiranje (CSR) šteti indeksiranju (pogotovo kod LLM-ova!)
   Rješenje: Koristite server-side rendering (SSR) ili hibridno renderiranje kako biste osigurali da tražilice dobiju potpuno renderirani HTML.
2. Sadržaj koji se učita putem “lazy-loadinga” nije indeksiran
   Rješenje: Implementirajte API ili omogućite da Googlebot može skrolati i pokrenuti učitavanje sadržaja.
3. JavaScript datoteke su blokirane u robots.txt
   Rješenje: Dozvolite pristup Googlebotu JavaScript i CSS datotekama
4. Prekomjerna manipulacija DOM-om usporava stranice
   Rješenje: Optimizirajte JavaScript kako biste smanjili kompleksne interakcije s DOM-om i poboljšali brzinu stranice i Core Web Vitals metrike (brzina učitavanja jest bitna!).
5. SEO metapodaci (naslov, meta opis, canonical oznake) uneseni su putem JavaScripta
   Rješenje: Neka metapodaci budu prisutni u server-renderiranom HTML-u ili koristite pre-rendering alate poput Rendertrona.

 

 

Što kažu iz Googlea?

Martin Splitt iz Googlea nedavno je na konferenciji SEO for Paws spomenuo 3 česte greške koje vidi vezane za korištenje Javascripta koje utječu na SEO.

On se konkretno osvrnuo na indeksiranje error stranica, prikazanim HTML-om i zahtjevima za geolokaciju.

 

Pogreška 1: Prikazani HTML vs. Izvorni HTML

Martin Splitt je upozorio na čestu pogrešku koju primjećuje na webovima, odnosno kod SEO stručnjaka.
Mnogi se  još uvijek se fokusiraju na izvorni kod web stranice, iako Google koristi prikazani HTML za indeksiranje.

Splitt je rekao: “Mnogi ljudi još uvijek gledaju ‘View Source’. To nije ono što mi koristimo za indeksiranje. Mi koristimo prikazani HTML.”

To je važno jer JavaScript može dodavati ili uklanjati sadržaj sa stranice.

Izvorni HTML (source HTML) vs. renderirani HTML (rendered HTML / DOM after JavaScript)

 

Izvorni HTML kod:

• To je originalni HTML kod koji vaš preglednik (browser) prima od servera.
• Do njega možete doći tako da kliknete desnim klikom na stranicu i odaberete “Prikaži izvor stranice” (View Page Source).
• Ne prikazuje promjene koje su nastale nakon učitavanja, kao što su dodani elementi putem JavaScripta.
• Sadržaj je statičan i ne prikazuje interakcije korisnika ili dinamičko učitavanje sadržaja.

 

Renderirani HTML (Rendered HTML / DOM after JavaScript)

• HTML koji  browser (ili Googlebot koji podržava rendering) generira nakon što izvrši sve JavaScript skripte.
• Sadrži dinamički sadržaj koji JavaScript doda naknadno (npr. proizvodi, komentari, cijene…).
• Prikazuje krajnji rezultat koji korisnik vidi u pregledniku.

 

Googlebot može doći do renderiranog HTML-a, ali većina LLM-ova i manji botovi ne mogu.

Možeš ga vidjeti: Desni klik → “Inspect” → zatim Elements tab u Chrome DevTools.

U Google Search Console: Rendered HTML (ako Google prikazuje oboje).

 

Pogreška 2: Indeksiranje pogrešnih stranica

Splitt je pričao i o čestoj greški kod single-page aplikacija i stranica s puno JavaScripta: One često vraćaju status 200 OK čak i za pogrešne stranice.

To se događa jer server odmah šalje 200 odgovor, a tek onda JavaScript provjerava postoji li stranica.

Ako stranice s greškom imaju status 200, Google ih indeksira kao da su valjane, što šteti vašem SEO-u.

Splitt je savjetovao provjeru postavki servera kako bi se pogreške pravilno obrađivale, čak i uz klijentsko renderiranje.

 

Pogreška 3: Zahtjevi za geolokaciju

Još jedan problem nastaje kada stranice traže lokaciju korisnika ili druga dopuštenja. Ako se sadržaj prikazuje samo geolokacijom, botovi ga možda neće vidjeti.

Googlebot će baš uvijek odbiti takve zahtjeve ako stranica nema alternativni plan.

PRIMJER	Geolokacija dopuštena	Geolokacija odbijena (alternativni sadržaj)
Web stranica restorana	Prikaže ti najbližu poslovnicu	Prikaže ti sve poslovnice u Hrvatskoj
Aplikacija za vrijeme	Prikaže trenutno vrijeme na tvojoj lokaciji	Pita te da uneseš grad ručno
Lokator paketa	Prikazuje gdje se paket nalazi u odnosu na tebe	Traži da ručno uneseš adresu ili poštanski broj

 

Stranica može izgledati prazna Googlebotu ako ne postoji alternativni sadržaj, što znači da se ništa ne indeksira. To je dosta ozbiljna SEO pogreška.

 

Ukratko, pazite na ovo:

1. Provjeravajte prikazani HTML (rendered HTML), a ne izvorni kod, kada dijagnosticirate probleme s Google indeksiranjem.
2. Ispravite pogreške JavaScript stranica koje vraćaju status 200 umjesto ispravnog 404.
3. Osigurajte alternativni sadržaj za zahtjeve za geolokaciju, jer će ih Googlebot uvijek odbiti.

 

Kako pronaći i popraviti JavaScript SEO probleme

 

Imate li JavaScript, svakako provjerite je li s vašim web stranicama sve ok.

Ovo su 3 stvari ili 3 koraka koji pomažu u dijagnostici i rješavanju JavaScript problema:

1. Renderiranje i indeksiranje

Renderiranje i indeksiranje dvije su ključne komponente JavaScript SEO-a.
Renderiranje se odnosi na prikazivanje web sadržaja na uređaju korisnika, dok se  indeksiranje odnosi na  dodavanje web stranica u baze podataka tražilica. Kako bi web stranica bila SEO friendly, mora biti pravilno renderirana i indeksirana.

JavaScript se ne “renderira” sam po sebi . Rrenderiranje se obično odnosi na prikaz sadržaja u pregledniku, pa zapravo renderiramo sadržaj pomoću JavaScripta.

Da vidite prikazani HTML, koristite alat za pregled URL-a.

URL inspection tool kojeg imate u Search Consoli jest alat za provjeru URL-a i pomoću njega ćete detektirati probleme s renderiranjem na vašoj web stranici.
Omogućuje vam da vidite kako Google prikazuje stranicu, što vam može pomoći da  skužite gdje je problem.

Unesite URL stranice koju želite pregledati, a onda će vam alat informacije o tome kako Google pretražuje i indeksira vašu stranicu.

 

 

Česti problemi s renderiranjem su ovi:

• stranice se sporo učitavaju
• nema slika ili su oštećene
• HTML ili CSS kod je neispravno formatiran

 

Ako primijetite neki od tih problema, ispravite ih ASAP. Sporo učitavanje može biti zbog prevelikih datotekama ili lošeg kodoa, dok se problemi sa slikama mogu riješiti ažuriranjem URL-ova slika ili postavljanjem slika koje vam fale.

 

2. Provjerite sadržaj: Je li sadržaj koji očekujete stvarno tamo?

Nakon što je stranica ispravno prikazana, važno je provjeriti je li njen sadržaj indeksiran i dostupan Googleu.
To znači da trebate provjeriti jesu li sve stranice na vašem webu uključene u Googleov indeks, što je osnova da se uopće pojave među rezultatima pretrage.

 

Za provjeru indeksiranog sadržaja koristite Coverage u Google Search Consoli.
Izvještaj će vam pokazati koje su stranice indeksirane, a koje još nisu.

Ako primijetite da određene stranice nisu indeksirane, pogledajte koji je uzrok tome. Mogući uzroci suu:

• problemi s dupliciranim sadržajem
• ograničenja crawl budgeta

Za veću vidljivost takvih stranica, poboljšajte interno linkanje kako bi ih Google lakše otkrio.

 

3. Pregledajte HTTP kodove:

HTTP kodove možete vidjeti kroz browsere (u Chromeu na vašoj stranici kliknite desni klik- > Inspect-< Network)

Možete to isto provjeriti i putem nekih online alata kao što je npr. https://httpstatus.io/

 

 

4. Koristite dev alate browsera

Otvorite “Dev Tools” i pod “Network” provjerite stupac „initiator”.Ako je sadržaj učitan dinamički putem JavaScripta (bilo ručno ili kroz framework poput Reacta ili Vuea), “Initiator” će prikazati koji dio skripte je to pokrenuo.

 

 

NOVI PROBLEM: kako LLM-ovi gledaju na SEO?

Možda vas ChatGPT nikako ne uključuje među prijedloge? Ni Claude, ni Perplexity također? Imate li puno JavaScripta na webu, vjerojatno u tom grmu leži zec.

Recimo samo da LLM-ovi imaju velikih problema s klijentskim renderiranjem uz pomoć JavaScriptaa te da biste trebali posvetiti veliku pažnju optimizaciji stranice s tehničke strane.

Nove generacije AI modela i velikih jezičnih modela (LLM-ova) poput ChatGPT-a, Claudea, Perplexityja i drugih ne pretražuju web kao Google.

Za razliku od klasičnih tražilica poput Googlea i Binga, koje mogu renderirati putem JavaScript frameworka (iako uz određeno vrijeme kašnjenja), ne renderiraju vaše stranice niti izvršavaju vaše skripte. Uglavnom samo dohvaćaju sirovi HTML s vašeg servera  i nastavljaju dalje.

To može značiti smrt za vašu vidljivost.

Ako se vaša stranica jako oslanja na client-side rendering, AI agent možda uopće neće pronaći nikakav sadržaj.

Ako želite da vaš sadržaj bude „vidljiv” i dostupan u AI alatima poput ChatGPT-a, vrijeme je za tehničku optimizaciju i povratak osnovama: server-side renderingu i semantičkom HTML-u.

O tehničkoj optimizaciji za AI-first pretraživanje kroz LLM-ove pisat ću u drugom tekstu.

VEZANO:

Javascript kod postavite ispod HTML headera za bolji SEO

 

ZAKLJUČAK:

Iako mnoge web stranice koriste JavaScript i korisnicima se prikazuju bez problema, to ne znači da su sve njihove sadržaje jednako vidljive Googleu. A LLM-ovima pogotovo. Pozabavite se tehničkim dijelom vaše web stranice da ne ostanete nevidljivi, posebice danas kad AI pretrage sve više preuzimaju ulogu tradicionalnog searcha.

JavaScripta nije zlo, ali mora biti savršeno optimiziran. Jednostavne promjene u vezi JS-a mogu imati velik utjecaj na vaš biznis.