Beş ürün akışımız ilk tarama için tamamen görünmezdi. Kötü sıralanıyor değil,
yoktu. Her ürün adı, fayda başlığı ve açıklaması sayfa yüklendikten sonra dahilî
bir uç noktadan çekilip DOM'a innerHTML ile yazılıyordu; dolayısıyla bir
tarayıcının aldığı HTML'de konuyla ilgili tek bir metin vardı:
Loading Platform Architecture....
Siteyi, içerik sunucuda render edilecek şekilde yeniden kurduk. Bulduklarımız şunlar.
Başarısızlık ölçülebilirdi, ve sıfırdı
Kontrol tek komut sürüyor:
curl -s https://archmir.com/platform/expertarch | grep -c "Expert Level Reasoning Layer"
Yeniden kurulumdan önce bu komut 0 döndürüyordu. Sayfanın başlığı, açıklaması
ve Open Graph etiketleri vardı — hepsi bir şablonda metin değiştirme yoluyla
sunucu tarafında yerleştiriliyordu — ama gövde içeriği yoktu. Meta veriler,
JavaScript çalışana kadar var olmayan bir sayfayı tarif ediyordu.
Bunun önemi eskisinden büyük. Googlebot iki geçişte dizine ekler: ilki ham HTML'i okur, JavaScript gerektiren her şey Web Rendering Service kuyruğuna alınır ve orada saatlerce ya da haftalarca bekleyebilir. JavaScript'i hiç çalıştırmayan tarayıcılar — sosyal medya önizleyicileri ve sayısı giderek artan yapay zekâ erişim ajanları — içeriği hiçbir zaman görmez.
Neyi değiştirdik
İçerik, istemci tarafı bir istekten Server Components'a taşındı. Etkileşimli davranış yerinde kaldı, ama artık işaretlemeyi kendisi üretmek yerine HTML'de zaten hazır duran işaretlemeye bağlanıyor.
| Önce | Sonra |
|---|---|
Katalog /api/content/platform uç noktasından çekiliyor, innerHTML ile yerleştiriliyordu | Sunucuda render ediliyor; ilk HTML'in içinde geliyor |
Ürün sayfaları çalışma anında bir _renderIsolationMode() fonksiyonuyla kuruluyordu | Derleme anında statik üretiliyor; her ürün ve her dil için bir dosya |
Dil ?lang= sorgu parametresiyle değişiyordu | Ayrı ve dizine eklenebilir yollar, aralarında hreflang ile |
| Her URL için tek bir Open Graph görseli | Her rota için üretilen ayrı bir kart |
Başlık hiyerarşisi üstünde h2 olmadan h3 ile başlıyordu | Tek bir h1, ardından gerçek bir h2/h3 hiyerarşisi |
Etkileşimli parçalar — sekme geçişi, kaydırma animasyonları, video oynatma ve iletişim formu — sunucuda üretilmiş işaretlemenin üzerine bindirilen istemci bileşenleri. Kullanıcı hiçbir şey kaybetmiyor.
Aşikâr olmayan üç şey
İçeriği opacity: 0 arkasına saklamak gerçek bir risk. Kaydırma
animasyonlarımız her bölümü görünmez başlatıp JavaScript ile ortaya çıkarıyor.
Googlebot JavaScript'i render eder ve eninde sonunda görürdü, ama JavaScript
çalıştırmayan bir istemci boş sayfa görürdü. Animasyonu etkisizleştiren bir
<noscript> bloğu hiçbir maliyet getirmiyor ve bu hata ihtimalini tümüyle
ortadan kaldırıyor.
Bir URL'yi robots.txt ile engellemek onu dizinden çıkarmaz. Eski ?lang=
URL'lerini engellemeyi planlamıştık. Bu tam tersi sonuç verirdi: bir tarayıcının
çekemediği URL, yönlendirmesini de asla keşfedemeyeceği URL'dir — eski adres
dizinde süresiz kalırdı. Yönlendirmelerin işe yaraması için taranabilir olmaları
gerekir.
Yapay zekâ tarayıcıları açık bir davet bekliyor. Google-Extended ve
Applebot-Extended, yapay zekâ temellendirmesi için birer devre dışı bırakma
belirtecidir. Hiçbir şey söylememek kararı bir varsayılana bırakır.
Dokümantasyonunuzun üretken motorlar tarafından erişilebilir olmasını
istiyorsanız bunları Allow altında listeleyin.
Otomatikleştirilemeyen kısım
Render stratejisi, yapılandırılmış veri ve Core Web Vitals birer mühendislik problemidir, ve mühendislik problemlerinin belirlenebilir çözümleri vardır. Hiçbirinin yerini tutamayacağı şey, söyleyecek somut ve doğrulanabilir bir şeyinizin olmasıdır — bu yazıdaki sayıların başkasının kıyaslamalarından alıntılanmış değil, kendi sitemizde ölçtüklerimiz olmasının sebebi de budur.