Blogumuz Google'da Vardı ama Perplexity Hiç Görmüyordu: JS Render Sorunu
Sorunun Fark Edilişi: Perplexity'de Yoktuk
Geçen ay rutin bir kontrol yaparken Perplexity AI'ya "Türkiye'de yapay zeka uyumluluğu nasıl test edilir?" diye sorduk. Rakip sitelerin içerikleri özetlenmişti, ama bizim detaylı yazdığımız blog yazılarımızdan tek kelime yoktu. Oysa Google Search Console'da aynı yazılar düzenli trafik alıyordu. İlginç olan şuydu: ChatGPT'ye aynı soruyu sorduğumuzda yine bizden bahsetmiyordu, Claude da öyle.
İlk başta "belki yeterince otorite kazanmadık" diye düşündük. Ama Search Console verilerine baktığımızda yazılarımız Google'da 10-15. sıralarda görünüyordu ve tıklanıyordu. Demek ki Google içeriği görüyor ve indeksliyordu, ama yapay zeka botları görmüyordu. Bu tutarsızlık bizi daha derinlemesine araştırmaya itti.
Teşhis: JavaScript Render Farkı
Sorunu anlamak için blog sayfalarımızdan birinin kaynak koduna baktık. Tarayıcıda "Kaynağı Görüntüle" dediğimizde şunu gördük:
<div id="blog-container">
<!-- İçerik JavaScript ile yüklenecek -->
</div>
<script src="/js/posts.js"></script>
Sayfa tamamen boştu. Tüm blog içeriği posts.js dosyasından fetch ediliyor ve DOM'a JavaScript ile yazılıyordu. Tarayıcıda sayfa mükemmel görünüyordu çünkü modern tarayıcılar JS'i çalıştırıyor. Ama ham HTML'de hiçbir içerik yoktu.
Googlebot'un durumunu kontrol etmek için Search Console'daki "URL İnceleme" aracını kullandık. "Canlı Test" yaptığımızda Googlebot'un render edilmiş sayfayı gördüğünü, yani JavaScript'i çalıştırdığını doğruladık. Google 2019'dan beri JS render ediyor, bu yüzden bizim için sorun yoktu.
Yapay Zeka Botlarının Davranışı
Peki ya GPTBot, ClaudeBot ve PerplexityBot? Sunucu loglarımızı inceledik:
- Googlebot: Sayfayı iki kez ziyaret ediyor (önce HTML, sonra JS render)
- GPTBot: Tek istek, hemen çıkış, render yok
- ClaudeBot: Aynı şekilde tek geçiş
- PerplexityBot: HTML'i alıp gidiyor
Yapay zeka botlarının çoğu JavaScript çalıştırmıyor. Bunun nedeni kaynak maliyeti: milyarlarca sayfayı taramak için her birinde JS engine çalıştırmak çok pahalı. Sadece ham HTML'i alıp işliyorlar. Bizim sayfalarımızda ham HTML boş olduğu için, bu botlar için sitemiz sanki hiç içerik yokmuş gibi görünüyordu.
Teknik Çözüm: Statik HTML Üretimi
Çözüm netti: her blog yazısı için içeriği doğrudan HTML içine gömmemiz gerekiyordu. Dinamik fetch yerine build-time'da statik sayfalar üreten bir sistem kurduk.
Önceki Yapı (Sorunlu)
// posts.js
fetch('/api/posts/yapay-zeka-uyumlulugu')
.then(res => res.json())
.then(post => {
document.getElementById('blog-container').innerHTML = `
<h1>${post.title}</h1>
<p>${post.content}</p>
`;
});
Yeni Yapı (Çözüm)
Her blog yazısı için ayrı bir HTML dosyası ürettik. Örneğin /blog/yapay-zeka-uyumlulugu.html:
<article>
<h1>Yapay Zeka Uyumluluğu Nedir?</h1>
<div class="meta">
<time datetime="2024-01-15">15 Ocak 2024</time>
<span>Yazar: AICompatible Ekibi</span>
</div>
<p>Yapay zeka botları web sitenizi nasıl görüyor?
Bu yazıda GPTBot, ClaudeBot ve diğer AI tarayıcılarının...</p>
<!-- Tam içerik doğrudan HTML'de -->
</article>
Yapılandırılmış Veri Eklenmesi
Her sayfaya BlogPosting şeması ekledik. Bu hem Google için hem de yapay zeka botlarının içeriği daha iyi anlaması için kritik:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": "Yapay Zeka Uyumluluğu Nedir?",
"description": "Yapay zeka botlarının web sitenizi nasıl gördüğünü ve uyumluluğu nasıl test edeceğinizi öğrenin.",
"author": {
"@type": "Organization",
"name": "AICompatible"
},
"datePublished": "2024-01-15",
"dateModified": "2024-01-15",
"image": "https://aicompatible.com/images/ai-uyumluluk.jpg",
"publisher": {
"@type": "Organization",
"name": "AICompatible",
"logo": {
"@type": "ImageObject",
"url": "https://aicompatible.com/logo.png"
}
}
}
</script>
Bu yapılandırılmış veri, yapay zeka modellerine içeriğin ne hakkında olduğunu, kim tarafından yazıldığını ve ne zaman yayınlandığını açıkça söylüyor.
Sonuç ve Öğrendiklerimiz
Değişiklikleri yayınladıktan iki hafta sonra Perplexity'ye aynı soruyu tekrar sorduk. Bu sefer blogumuzdan alıntı yapıldı. ChatGPT'nin web araması da benzer şekilde içeriklerimizi bulmaya başladı. Sunucu loglarında GPTBot ve ClaudeBot'un daha sık ziyaret ettiğini ve daha uzun süre kaldığını gördük.
Bu Sorun Ne Kadar Yaygın?
React, Vue veya Angular gibi framework'lerle kurulmuş binlerce site aynı sorunu yaşıyor. Özellikle Single Page Application (SPA) mimarisiyle çalışan siteler risk altında. Google için sorun olmayabilir, ama yapay zeka çağında içeriğiniz LLM'ler tarafından görülmüyorsa ciddi bir fırsat kaybı yaşıyorsunuz.
Kendi Sitenizi Nasıl Kontrol Edersiniz?
- Kaynak kodu kontrolü: Tarayıcınızda Ctrl+U (veya Cmd+U) ile kaynak kodu açın. İçeriğiniz orada görünüyor mu?
- cURL testi: Terminal'de
curl https://siteniz.com/blog-yazisikomutuyla ham HTML'i alın. İçerik var mı? - JavaScript'i devre dışı bırakın: Tarayıcı ayarlarından JS'i kapatıp sayfayı yenileyin. Sayfa boş mu görünüyor?
AICompatible.com'un tarayıcısı bu kontrolü otomatik yapıyor. Sitenizi tarattığınızda hem Googlebot hem de GPTBot, ClaudeBot gibi yapay zeka botlarının ne gördüğünü simüle ediyor ve JS render sorunlarını tespit ediyor. Ayrıca eksik yapılandırılmış verileri, meta tag sorunlarını ve robots.txt konfigürasyonlarını da kontrol ediyoruz.
Sonuç olarak: Google'da görünmek artık yeterli değil. Yapay zeka çağında içeriğinizin LLM'ler tarafından okunabilir olması gerekiyor. Ve bu, JavaScript'e bağımlı olmayan, temiz HTML ile başlıyor.