![JavaScript SEO Nedir, Nasıl Yapılır? [2026]](/_next/image?url=%2Fimages%2Fblog%2Fjavascript-seo-nedir%2Fhero.jpg&w=1920&q=75)
Sitenizin title ve meta description'ı doğru görünüyor ama Search Console'da sayfa "Taranmadı" veya "Keşfedildi — şu an indekslenmedi" yazıyor. Genellikle sorun şu: React, Vue veya Angular ile kurulmuş sayfanın asıl içeriği tarayıcıda değil, JavaScript çalıştıktan sonra oluşuyor — ve Googlebot bu içeriği görebilmek için ayrı, gecikmeli bir sıraya giriyor.
Bu rehberde Googlebot'un JavaScript'i nasıl taradığını, CSR/SSR/SSG/ISR arasındaki SEO farkını, sık yapılan hataları ve Next.js'te pratik çözümleri ele alıyoruz.
İçindekiler
- JavaScript SEO Nedir?
- Googlebot JavaScript'i Nasıl Tarar?
- CSR, SSR, SSG, ISR: Hangisi SEO'ya Uygun?
- JavaScript SEO'da Sık Görülen 6 Hata
- JavaScript SEO Nasıl Test Edilir?
- Next.js'te Pratik Çözümler
- Sıkça Sorulan Sorular
JavaScript SEO Nedir?
JavaScript SEO, içeriği JavaScript ile oluşturan (React, Vue, Angular, Svelte gibi framework'lerle kurulmuş) sitelerin arama motorları tarafından doğru taranması, render edilmesi ve indekslenmesi için yapılan teknik optimizasyon çalışmalarıdır.
Klasik HTML sitelerde arama motoru sunucudan gelen HTML'i doğrudan okur. Client-side rendering (CSR) kullanan bir sitede ise ilk gelen HTML neredeyse boştur — asıl içerik, tarayıcıda JavaScript çalıştıktan sonra DOM'a eklenir. Googlebot bu içeriği görmek için sayfayı gerçekten render etmek zorundadır; bu da ekstra işlem gücü, ekstra zaman ve bazen hiç gerçekleşmeyen bir adım anlamına gelir.
Sonuç: teknik olarak doğru yazılmış bir React uygulaması, SEO açısından boş bir sayfa gibi davranabilir — eğer render stratejisi doğru kurulmamışsa.
Googlebot JavaScript'i Nasıl Tarar?
Google, JavaScript ağırlıklı sayfaları iki dalgalı indeksleme (two-wave indexing) modeliyle işler:
- Birinci dalga — Crawling: Googlebot sayfayı ilk indirir ve ham HTML'i hızlıca tarar. Bu aşamada JavaScript henüz çalışmamıştır; sadece sunucudan gelen statik HTML görülür.
- Render kuyruğu: Sayfa, JavaScript'in çalıştırılıp DOM'un tam oluşturulacağı bir render kuyruğuna girer. Bu kuyruk ayrı bir kaynak havuzu kullanır ve öncelik sırasına bağlıdır — düşük otoriteli veya büyük sitelerde bu bekleme birkaç gün sürebilir.
- İkinci dalga — İndeksleme: Render tamamlandığında Googlebot, JavaScript'in oluşturduğu final DOM'u tekrar tarar ve asıl indeksleme bu veriyle yapılır.
Pratik sonucu şu: eğer title, ana içerik ve iç linkler yalnızca JavaScript çalıştıktan sonra ortaya çıkıyorsa, bu bilgiler Google'a gecikmeli ulaşır. Sık güncellenen sayfalarda (kampanya, stok, fiyat) bu gecikme doğrudan trafik kaybına dönüşür. Crawl budget rehberimizde anlattığımız gibi, render maliyeti yüksek sayfalar zaten sınırlı olan tarama bütçesinden daha fazla pay tüketir.
CSR, SSR, SSG, ISR: Hangisi SEO'ya Uygun?
Render stratejisi seçimi, JavaScript SEO'nun en kritik kararıdır:
| Yöntem | Nasıl Çalışır | SEO Uygunluğu |
|---|---|---|
| CSR (Client-Side Rendering) | HTML boş gelir, içerik tarayıcıda JS ile oluşur | Zayıf — render kuyruğuna bağımlı, gecikme riski yüksek |
| SSR (Server-Side Rendering) | Her istekte sunucu tam HTML üretir | Güçlü — Googlebot ilk crawl'da tam içeriği görür |
| SSG (Static Site Generation) | Build anında statik HTML üretilir | En güçlü — sıfır render gecikmesi, en hızlı TTFB |
| ISR (Incremental Static Regeneration) | Statik HTML, belirli aralıklarla arka planda yenilenir | Güçlü — SSG hızı + güncel içerik dengesi |
Kural basit: sayfa içeriği ne kadar kritikse (title, H1, ana metin, iç linkler), o kadar erken HTML'de bulunmalı. Kritik olmayan etkileşim öğeleri (filtre, modal, canlı sohbet) CSR ile kalabilir — bunlar Google'ın indekslemesi gereken içerik değildir.
Türkiye'de yaygın CMS ve framework'lerin çoğu (Next.js, Nuxt, Shopify Hydrogen) varsayılan olarak SSR/SSG destekler; sorun genellikle framework'te değil, geliştiricinin "use client" veya eşdeğer client-only bileşeni ana içerik için kullanmasında çıkar.
JavaScript SEO'da Sık Görülen 6 Hata
1. Title ve meta description client-side yazılıyor. useEffect içinde document.title değiştirmek, Googlebot'un ilk taramada gördüğü title'ı etkilemez — render kuyruğunu bekler.
2. İç linkler <a href> değil, onClick ile çalışıyor. Googlebot linkleri keşfetmek için gerçek <a href="..."> etiketlerine ihtiyaç duyar. <div onClick={...}> veya JavaScript router'la tetiklenen navigasyon crawl edilmez.
3. Sonsuz kaydırma (infinite scroll) pagination linksiz kurulmuş. Kullanıcı scroll ettikçe yeni içerik gelen sayfalarda, her "sayfa" için ayrı bir URL ve <a> linki yoksa Googlebot yalnızca ilk yükte gelen içeriği görür.
4. Structured data client-side ekleniyor. JSON-LD şema client render'da geç eklenirse, render kuyruğu gecikmesinde zengin sonuç (rich result) fırsatı kaybedilir. Schema markup rehberimizde şemanın doğru yerleştirilmesini ele aldık.
5. Hydration hataları içeriği geçici olarak siliyor. React/Vue hydration sırasında sunucu ve istemci DOM'u uyuşmazsa, tarayıcı bazen içeriği kısa süreliğine boşaltıp yeniden oluşturur — Googlebot bu boşluğu yakalarsa sayfayı boş görebilir.
6. robots.txt, JS/CSS dosyalarını engelliyor. Googlebot'un render yapabilmesi için sayfayı oluşturan JS ve CSS dosyalarına erişmesi gerekir. Bu dosyalar robots.txt ile engellenirse render başarısız olur, sayfa hiç işlenmemiş gibi indekslenir.
JavaScript SEO Nasıl Test Edilir?
Sorunu tahmin etmek yerine doğrudan ölçün:
- Google Search Console — URL Denetleme Aracı. "Canlı Test" seçeneği, Googlebot'un sayfayı gerçekte nasıl render ettiğini ekran görüntüsüyle gösterir. Search Console kullanımı rehberimizde bu aracın diğer raporlarını da ele aldık.
- "View Page Source" vs "Inspect". Tarayıcıda sağ tık → "Sayfa Kaynağını Görüntüle" ilk HTML'i gösterir (Googlebot'un birinci dalgada gördüğü). "İncele" (DevTools) ise JavaScript çalıştıktan sonraki final DOM'u gösterir. İkisi arasındaki fark, render'a bağımlılığın büyüklüğünü gösterir.
- JavaScript devre dışıyken test. Tarayıcıda JavaScript'i kapatıp sayfayı yeniden yükleyin — title, ana içerik ve navigasyon hâlâ görünüyorsa temel SEO güvenlik altındadır.
- Lighthouse / PageSpeed Insights. Bundle boyutu ve JavaScript çalışma süresi Core Web Vitals rehberimizde anlattığımız LCP ve INP metriklerini doğrudan etkiler; ağır render, hem kullanıcı deneyimini hem crawl önceliğini düşürür.
Next.js'te Pratik Çözümler
Next.js App Router'da varsayılan davranış zaten sunucu bileşenleridir (Server Components) — sayfa, aksi belirtilmedikçe sunucuda render edilir. SEO açısından kritik olan iki karar:
// Ana içerik: server component (varsayılan) — SEO'ya görünür
export default async function ProductPage({ params }) {
const product = await getProduct(params.slug);
return <ProductContent product={product} />; // title, açıklama, fiyat burada
}
// Yalnızca etkileşim: client component — SEO'ya görünmesi gerekmez
"use client";
function AddToCartButton() { ... }
Pratik kural: "use client" direktifini yalnızca gerçekten tarayıcı etkileşimi gereken bileşenlere (buton, form, modal) uygulayın; title, açıklama, fiyat, iç linkler gibi indekslenmesi gereken içerik her zaman server component içinde kalsın. generateMetadata fonksiyonu ile title/description üretimi de sunucu tarafında çalışır — bu sayede meta etiketler ilk HTML'de hazır gelir, render kuyruğunu beklemez.
E-ticaret siteleri için bu ayrım özellikle kritiktir — SPA mimarisiyle kurulmuş büyük katalogların render maliyeti e-ticaret teknik SEO rehberimizde ele aldığımız gibi crawl bütçesini hızla tüketebilir.
Sıkça Sorulan Sorular
JavaScript SEO nedir?
JavaScript SEO, içeriğini JavaScript ile oluşturan (React, Vue, Angular gibi) sitelerin arama motorları tarafından doğru taranması, render edilmesi ve indekslenmesi için yapılan teknik SEO çalışmalarıdır. Amaç, Googlebot'un render kuyruğunda gecikmeden kritik içeriği (title, ana metin, iç linkler) görebilmesini sağlamaktır.
Google JavaScript'i tarayabiliyor mu?
Evet, Googlebot modern Chromium tabanlı bir render motoru kullanarak JavaScript'i çalıştırabilir. Ancak bu işlem ayrı bir render kuyruğunda gerçekleşir ve öncelik sırasına bağlıdır — özellikle büyük veya düşük otoriteli sitelerde render gecikmesi günler sürebilir.
CSR kullanan bir site hiç sıralanmaz mı?
Hayır, CSR kullanan siteler de sıralanabilir ama dezavantajlıdır. Render kuyruğu gecikmesi, sık güncellenen sayfalarda (stok, fiyat, kampanya) içeriğin geç indekslenmesine yol açar. SSR veya SSG'ye geçiş bu gecikmeyi ortadan kaldırır ve genellikle Core Web Vitals metriklerini de iyileştirir.
JavaScript SEO sorunları nasıl tespit edilir?
En hızlı yöntem Google Search Console'daki URL Denetleme Aracı'nın "Canlı Test" özelliğidir — Googlebot'un sayfayı gerçekte nasıl render ettiğini gösterir. Ek olarak tarayıcıda JavaScript'i devre dışı bırakıp sayfayı yeniden yüklemek, hangi içeriğin render'a bağımlı olduğunu hızlıca ortaya çıkarır.
Next.js SEO açısından React'ten daha mı iyidir?
Saf React (Create React App gibi) varsayılan olarak CSR kullanır ve ekstra yapılandırma gerektirir. Next.js ise App Router'da varsayılan olarak sunucu bileşenleriyle çalışır, generateMetadata ile meta etiketleri sunucu tarafında üretir — bu yüzden ek yapılandırma olmadan JavaScript SEO açısından daha güvenli bir başlangıç noktasıdır.
JavaScript SEO, modern framework'lerle kurulmuş sitelerde görünmeyen ama sıralamayı doğrudan etkileyen bir katmandır — sorun sessizdir, hata vermez, sadece içerik Google'a geç ya da hiç ulaşmaz. Render mimarinizi teknik SEO hizmetimiz kapsamında denetleyebiliriz. Piyasa fiyatları için hizmet fiyatlarımızı, benzer projelerdeki sonuçlar için müşteri sonuçlarımızı inceleyebilir; sitenizin render stratejisini birlikte değerlendirmek için ücretsiz SEO danışmanlığı talep edebilirsiniz. Kritik içeriğin doğru render edildiğinden emin değilseniz, teknik SEO ekibimizden hızlı bir ön değerlendirme isteyebilirsiniz.