Sitenizi Google Göremiyor Olabilir: JavaScript Tuzağı

Sitenizi tarayıcıda açıyorsunuz: her şey yerli yerinde. Ürünler listeleniyor, açıklamalar görünüyor, filtreler çalışıyor. Ama Google'da aradığınızda o içeriklerin hiçbiri yok.

Bu senaryonun en sık sebebi şudur: İçerik, sayfa yüklendikten sonra JavaScript ile oluşturuluyor ve arama motoru onu göremiyor ya da çok geç görüyor.

Google JavaScript'i nasıl işler?

Klasik bir HTML sayfasında süreç tek adımlıdır: Bot sayfayı ister, HTML gelir, içerik hazırdır. JavaScript ağırlıklı sitelerde ise süreç iki aşamalıdır:

1. Tarama (crawl): Googlebot HTML'i indirir. Bu aşamada JavaScript henüz çalışmamıştır; HTML büyük olasılıkla neredeyse boştur.
2. Render: Sayfa bir render kuyruğuna alınır. Kaynak müsait olduğunda Google, Chrome tabanlı bir ortamda JavaScript'i çalıştırır ve nihai içeriği görür.

Sorun tam da burada: Bu iki aşama arasında ciddi bir gecikme olabilir. Yoğun dönemlerde render saatler, bazen günler sonra gerçekleşir. Sık güncellenen bir sitede bu, içeriğinizin sürekli geriden takip edilmesi anlamına gelir.

Sorunun boyutunu nasıl anlarsınız?

Test 1 — Kaynak kodu kontrolü

Sayfada sağ tık → "Sayfa kaynağını görüntüle" deyin. Bu, JavaScript çalışmadan önceki ham HTML'dir. Ürün adları, açıklamalar ve metinler burada görünüyor mu? Görünmüyorsa içerik JavaScript ile geliyor demektir.

Not: "İncele" (Inspect) paneli JavaScript sonrası hâli gösterir; bu test için yanıltıcıdır. "Kaynağı görüntüle" kullanın.

Test 2 — Google'da tırnaklı arama

Sayfadaki benzersiz bir cümleyi seçin ve şu şekilde aratın:

site:siteniz.com "sayfadaki benzersiz cümle"

Sonuç yoksa o metin indekslenmemiştir.

Test 3 — Search Console URL Denetimi

URL Denetimi aracında sayfayı test edin ve "Taranan sayfayı görüntüle" → HTML sekmesine bakın. Google'ın gördüğü nihai HTML budur. İçeriğiniz burada yoksa sorun kesindir.

En sık karşılaşılan 7 JavaScript SEO sorunu

1. İçeriğin tamamı istemcide üretiliyor

Tek sayfa uygulamalarında (SPA) ham HTML genellikle boş bir <div id="root">'tan ibarettir. Render gecikirse veya başarısız olursa Google bomboş bir sayfa görür.

2. Linkler gerçek link değil

Bu, en yaygın ve en sinsi hatadır:

<!-- Google takip EDEMEZ -->
<div onclick="git('/urun/1')">Ürün</div>
<span class="link" data-href="/urun/1">Ürün</span>

<!-- Google takip EDER -->
<a href="/urun/1">Ürün</a>

Googlebot yalnızca href özniteliği olan <a> etiketlerini takip eder. JavaScript ile yönetilen sahte linkler, sitenizin bölümlerini tamamen keşfedilmez hâle getirir.

3. İçerik kullanıcı etkileşimi gerektiriyor

"Devamını oku", "Yorumları göster", "Daha fazla yükle" butonlarının arkasındaki içerik, tıklamayla sunucudan çekiliyorsa indekslenmez. Googlebot tıklamaz ve kaydırmaz.

4. Robots.txt JavaScript dosyalarını engelliyor

Eski bir alışkanlıkla Disallow: /js/ yazılmışsa Google sayfayı render edemez ve bozuk bir sürüm görür.

5. Render zaman aşımı

Çok sayıda ağ isteği yapan veya ağır çalışan sayfalarda render tamamlanamadan kesilebilir. Sonuç: eksik içerik.

6. Meta etiketler JavaScript ile ekleniyor

Başlık, meta açıklama ve kanonik etiketin JavaScript ile atanması risklidir. Bunlar ham HTML'de bulunmalıdır; aksi hâlde render öncesi taramada yanlış veya eksik değerler görülür.

7. Sonsuz kaydırma

Kaydırma ile yüklenen ürünler bot tarafından görülmez. Bu yapının mutlaka sayfalanabilir bir alternatifi olmalıdır.

Çözüm yaklaşımları

Sunucu tarafı render (SSR)

İçerik sunucuda üretilir, tarayıcıya hazır HTML gider. SEO açısından en güvenli yöntemdir. Modern çerçevelerin çoğu bunu destekler.

Avantaj: Bot ilk istekte tüm içeriği görür.
Maliyet: Sunucu yükü ve altyapı karmaşıklığı.

Statik üretim (SSG)

Sayfalar derleme aşamasında önceden üretilir ve statik dosya olarak sunulur. Blog, dokümantasyon ve nadiren değişen içerikler için ideal — hem en hızlı hem en güvenli seçenektir.

Ön render (prerendering)

Botlara önceden hazırlanmış statik sürüm, kullanıcılara normal uygulama sunulur. Mevcut bir SPA'yı yeniden yazmadan çözüm getirir.

Dikkat: Bota ve kullanıcıya farklı içerik sunmak (cloaking) politika ihlalidir. İçerik aynı olmalı, yalnızca sunum yöntemi farklı olmalıdır.

Karma (hydration) yaklaşım

Kritik içerik sunucuda üretilir, etkileşimli bölümler istemcide devreye girer. Günümüzde en yaygın ve dengeli çözümdür.

Hangi durumda hangi yöntem?

Kontrol listesi

1. Ham HTML'de ana içerik görünüyor mu?
2. Tüm linkler gerçek <a href> mi?
3. Başlık, meta ve kanonik ham HTML'de mi?
4. JS/CSS dosyaları robots.txt ile engellenmemiş mi?
5. Kritik içerik tıklama gerektirmiyor mu?
6. Search Console'un gördüğü HTML doğru mu?
7. Sonsuz kaydırmanın sayfalanabilir alternatifi var mı?

Render nedir ve neden gecikir?

JavaScript ağırlıklı sitelerde en kritik kavram "render", yani işlemedir. Bir sayfanın ham HTML'i tarayıcıya ulaştığında, içeriğin bir kısmı henüz orada olmayabilir; JavaScript çalıştıktan sonra içerik oluşturulur ve sayfaya yerleştirilir. Google bir sayfayı anlamak için önce ham HTML'i alır, ardından JavaScript'i çalıştırıp sayfayı bir tarayıcı gibi işlemesi gerekir. İşte bu işleme adımı, geleneksel HTML sitelerinde olmayan bir maliyet ve gecikme kaynağıdır.

Render maliyetlidir çünkü JavaScript çalıştırmak, düz HTML okumaktan çok daha fazla işlem gücü gerektirir. Google bu maliyeti yönetmek için render işlemini genellikle ilk taramadan sonraki bir aşamaya erteler. Yani sayfanız JavaScript ile içerik yüklüyorsa, Google o içeriği ham HTML'de göremez ve ancak render kuyruğundaki sırası geldiğinde işleyebilir. Bu gecikme, içeriğinizin dizine girmesinin ve güncellemelerinizin fark edilmesinin yavaşlaması anlamına gelir.

İki dalgalı indeksleme

Bu erteleme, "iki dalgalı indeksleme" olarak bilinen bir sürece yol açar. İlk dalgada Google, sayfanın ham HTML'ini tarar ve orada bulabildiği içeriği hemen dizine alır. İkinci dalgada, render kuyruğundaki sıra geldiğinde JavaScript'i çalıştırır ve yalnızca render sonrası ortaya çıkan içeriği o zaman keşfeder. Eğer sayfanızın kritik içeriği, başlıkları veya bağlantıları yalnızca JavaScript çalıştıktan sonra ortaya çıkıyorsa, bunlar birinci dalgada tamamen görünmez ve ancak ikinci dalgada — belki günler sonra — dizine girer.

Bu iki aşamalı yapının pratik sonucu şudur: en önemli içeriğinizi ve iç bağlantılarınızı ham HTML'de bulundurmak, onların hızlı ve güvenilir biçimde keşfedilmesini sağlar. JavaScript'e bağımlı içerik her zaman bir gecikme ve belirsizlik riski taşır. Özellikle sık güncellenen, tazeliğin önemli olduğu içeriklerde bu gecikme ciddi bir dezavantaja dönüşebilir.

İstemci tarafı render'ın riskleri

İstemci tarafı render (CSR), sayfanın neredeyse tüm içeriğinin tarayıcıda JavaScript ile oluşturulduğu yaklaşımdır. Bu yöntemde sunucu, çoğu zaman boş bir iskelet HTML ve büyük bir JavaScript paketi gönderir; içerik, bu paket tarayıcıda çalıştıktan sonra belirir. Modern uygulama çatıları bu yaklaşımı kolaylaştırdığı için yaygınlaşmıştır, ancak SEO açısından ciddi riskler taşır. Ham HTML boş olduğu için, render gerçekleşene kadar Google sayfada anlamlı hiçbir içerik göremez.

Bu riskin en sinsi yanı, sitenin kullanıcılar için mükemmel çalışıyor görünmesidir; çünkü kullanıcının tarayıcısı JavaScript'i anında çalıştırır ve içeriği gösterir. Site sahibi her şeyin yolunda olduğunu düşünürken, arama motoru sayfayı büyük ölçüde boş görüyor olabilir. Bu görünmez uçurum, JavaScript ağırlıklı sitelerde sıralama sorunlarının en yaygın ama en geç fark edilen nedenidir.

Sunucu tarafı render ve dinamik render

İstemci tarafı render'ın SEO risklerine karşı en sağlam çözüm, sunucu tarafı render'dır (SSR). Bu yaklaşımda JavaScript sunucuda çalıştırılır ve tarayıcıya (ve bota) içeriği zaten dolu, tam bir HTML gönderilir. Böylece Google birinci dalgada tüm içeriği görür ve render kuyruğunu beklemesine gerek kalmaz. Sunucu tarafı render, modern JavaScript geliştirmenin esnekliğini SEO'nun güvenilirliğiyle birleştirdiği için, arama görünürlüğünün kritik olduğu projelerde tercih edilen yaklaşımdır.

Bir ara çözüm, statik ön oluşturma (pre-rendering) veya dinamik render'dır; bu yöntemlerde botlara içeriği önceden işlenmiş bir sürüm sunulur. Bu yaklaşımlar bazı durumlarda geçerli bir köprü olsa da, karmaşıklık ve bakım yükü getirir. Genel eğilim, mümkün olduğunda sunucu tarafı render veya statik üretim gibi baştan SEO dostu bir mimari seçmek yönündedir; sonradan eklenen render çözümleri, temel mimari sorununu yamayla çözmeye çalışır.

JavaScript ile yüklenen içerik ve iç bağlantılar

JavaScript SEO sorunlarının özellikle kritik bir boyutu iç bağlantılardır. Eğer sitenizin navigasyonu veya sayfalar arası bağlantıları yalnızca JavaScript ile oluşturuluyor ve gerçek bağlantı etiketleri (<a href>) ham HTML'de bulunmuyorsa, Google bu bağlantıları render öncesinde takip edemez. Bu durum, botun sitenizin derinliklerine ulaşmasını engelleyebilir ve sayfaların keşfedilmemesine yol açabilir. Bağlantıların gerçek href nitelikli etiketler olarak ham HTML'de bulunması, sitenin taranabilirliğinin temelidir.

Benzer biçimde, "daha fazla yükle" düğmeleri veya sonsuz kaydırma ile JavaScript üzerinden getirilen içerik de risk taşır. Kullanıcı etkileşimi (tıklama, kaydırma) olmadan yüklenmeyen içerik, Google tarafından görülmeyebilir. Kritik içeriğin, kullanıcı etkileşimi gerektirmeden sayfa yüklenirken erişilebilir olması gerekir; aksi halde o içerik arama motoru için pratikte yok sayılır.

Sayfayı Google gibi görmek

JavaScript SEO sorunlarını teşhis etmenin en doğrudan yolu, sayfayı Google'ın gördüğü gibi görmektir. Search Console'un URL Denetleme aracı, Google'ın sayfanızı render ettikten sonra ürettiği HTML'i ve ekran görüntüsünü gösterir; burada beklediğiniz içeriğin eksik olması, bir render sorununun kesin işaretidir. İkinci bir yöntem, sayfanın JavaScript'i devre dışıyken nasıl göründüğünü kontrol etmektir — JavaScript kapalıyken içerik kayboluyorsa, o içerik render'a bağımlıdır ve risk altındadır. Bu iki basit test, JavaScript tuzağının sitenizi etkileyip etkilemediğini dakikalar içinde ortaya koyar.

Sık sorulan sorular

Google JavaScript'i işleyebiliyorsa neden endişeleneyim? Google JavaScript'i işleyebilir, ama bu maliyetli ve ertelenen bir süreçtir. "İşleyebilmek" ile "hızlı, güvenilir ve eksiksiz işlemek" arasında büyük fark vardır; kritik içeriği JavaScript'e bağımlı kılmak, gereksiz bir gecikme ve belirsizlik riski yaratır.

Sitem tamamen JavaScript tabanlı, baştan mı yazmalıyım? Şart değil. Çoğu modern çatı, sunucu tarafı render veya statik üretim seçenekleri sunar; mevcut kod tabanını koruyarak render stratejisini SEO dostu hale getirmek çoğu zaman mümkündür.

JavaScript SEO sorunu sıralamamı gerçekten düşürür mü? Evet. Google göremediği içeriği sıralayamaz. Kritik içeriğiniz render'a bağımlıysa ve güvenilir biçimde işlenmiyorsa, o içerik için sıralama şansınız ciddi biçimde azalır.

Küçük bir JavaScript kullanımı da riskli mi? Hayır. Sayfaya etkileşim katan, ama kritik içeriği ham HTML'de bırakan sınırlı JavaScript kullanımı sorun değildir. Risk, içeriğin ve bağlantıların varlığının JavaScript'e bağımlı olduğu durumlarda doğar.

Yaygın JavaScript SEO mitleri

JavaScript ve SEO konusunda iki uç yanlış inanış dolaşır ve ikisi de zararlıdır. Birinci uç, "Google artık JavaScript'i mükemmel işliyor, hiç endişe etmeye gerek yok" der; bu, render'ın maliyetini, gecikmesini ve başarısız olabildiği durumları görmezden gelir ve site sahiplerini kritik içeriği güvenilmez bir sürece emanet etmeye iter. İkinci uç ise "JavaScript SEO için felakettir, hiç kullanılmamalı" der; bu da modern web geliştirmenin sunduğu değeri reddeden aşırı bir tepkidir. Gerçek, bu iki ucun ortasındadır: JavaScript güçlü bir araçtır, ama kritik içerik ve bağlantılar söz konusu olduğunda arama motorunun onları güvenilir biçimde görebildiğinden emin olmak gerekir.

Bir başka yaygın mit, JavaScript sorununun yalnızca büyük ve karmaşık uygulamaları etkilediğidir. Gerçekte, küçük bir kurumsal sitede bile, örneğin menü veya önemli bir içerik bloğu JavaScript'e bağımlı biçimde yüklendiğinde aynı görünmezlik sorunu doğar. Sorunun boyutu sitenin büyüklüğüyle değil, kritik içeriğin render'a ne kadar bağımlı olduğuyla belirlenir.

Çatı seçerken SEO'yu düşünmek

Yeni bir proje için bir JavaScript çatısı (framework) seçerken alınan kararlar, o sitenin SEO kaderini yıllarca etkiler. Modern çatıların çoğu, hem istemci tarafı render hem sunucu tarafı render hem de statik üretim seçenekleri sunar; kritik olan, projenin başında SEO gereksinimlerini göz önünde bulundurarak doğru render stratejisini seçmektir. Arama görünürlüğü işiniz için önemliyse, içeriğin sunucuda oluşturulup bota dolu HTML olarak sunulduğu bir yaklaşım en güvenli tercihtir.

Bu kararı sonraya ertelemek pahalıya mal olur. Tümüyle istemci tarafı render üzerine kurulmuş bir siteyi sonradan sunucu tarafı render'a taşımak, ciddi bir yeniden mühendislik gerektirebilir. Bu yüzden render stratejisi, tasarım ve özellik kararları kadar erken ve bilinçli verilmesi gereken temel bir mimari seçimdir; sonradan eklenen SEO yamaları, baştan doğru kurulmuş bir mimarinin sağlamlığını nadiren yakalar.

Aşamalı iyileştirme felsefesi

JavaScript SEO sorunlarına karşı en dayanıklı zihniyet, "aşamalı iyileştirme" (progressive enhancement) felsefesidir. Bu yaklaşım, sayfanın temel içeriğinin ve işlevinin JavaScript olmadan da erişilebilir olması gerektiğini savunur; JavaScript ise bu sağlam temelin üzerine etkileşim ve zenginlik katan bir katman olmalıdır, temelin kendisi değil. Bu felsefeye göre bir sayfa oluşturulduğunda, içerik ve bağlantılar ham HTML'de bulunur; JavaScript devre dışı kalsa bile sayfa okunabilir ve gezilebilir kalır.

Aşamalı iyileştirme, yalnızca arama motorları için değil, erişilebilirlik ve dayanıklılık için de değerlidir. Yavaş bağlantılar, eski cihazlar veya JavaScript'in çeşitli nedenlerle çalışmadığı durumlar için de sayfayı işlevsel tutar. Bu yaklaşım benimsendiğinde, JavaScript SEO sorunlarının büyük çoğunluğu daha doğmadan ortadan kalkar; çünkü arama motorunun görmesi gereken her şey zaten en baştan ham HTML'de bulunur. Sağlam temel önce gelir, gösteriş sonra.

JavaScript ve sayfa hızı ilişkisi

JavaScript'in SEO üzerindeki etkisi yalnızca içeriğin görünürlüğüyle sınırlı değildir; sayfa hızını da doğrudan etkiler. Büyük JavaScript paketleri indirilmeli, ayrıştırılmalı ve çalıştırılmalıdır; bu süreç, özellikle daha zayıf mobil cihazlarda sayfanın etkileşime hazır hale gelmesini geciktirir. Sayfa hızı hem bir kullanıcı deneyimi ölçütü hem de bir sıralama sinyali olduğundan, aşırı JavaScript kullanımı görünürlüğü iki yönden birden zayıflatabilir: içeriği geç göstererek ve sayfayı yavaşlatarak.

Bu yüzden JavaScript SEO çalışması, render stratejisiyle birlikte performans optimizasyonunu da kapsamalıdır. Kullanılmayan kodu ayıklamak, JavaScript paketlerini bölmek ve yalnızca gereken kodu gerektiğinde yüklemek, hem hızı hem taranabilirliği iyileştirir. İçeriğin görünür olması ile sayfanın hızlı olması, JavaScript ağırlıklı sitelerde aynı madalyonun iki yüzüdür ve birlikte ele alınmalıdır. İyi yapılandırılmış bir site, JavaScript'in gücünden yararlanırken bu iki riski de kontrol altında tutar.

Özet

JavaScript, modern web'in vazgeçilmezidir; sorun teknolojinin kendisi değil, içeriğin ne zaman hazır olduğudur. Google JavaScript'i işleyebilir ama gecikmeli ve garantisiz işler.

Altın kural basittir: Arama görünürlüğü önemli olan her içerik, ilk HTML yanıtında hazır bulunmalıdır.

Sitenizin Google tarafından doğru görülüp görülmediğini kontrol etmemizi isterseniz ücretsiz analiz talep edebilirsiniz.