Geçici çözüm olarak dinamik oluşturma

Bazı web sitelerinde JavaScript, tarayıcıda yürütülen bir sayfada ek içerik oluşturur. Buna istemci taraflı oluşturma denir. Google Arama, JavaScript'i çalıştırırken Google Arama'da sınırlamaları olan JavaScript özellikleri vardır ve bazı sayfalar, oluşturulan HTML'de içeriğin görünmemesiyle ilgili sorunlarla karşılaşabilir. Diğer arama motorları JavaScript'i yoksaymayı tercih edebilir ve JavaScript ile oluşturulan içeriği görmez.

Dinamik oluşturma, JavaScript ile oluşturulan içeriğin arama motorları tarafından kullanılamadığı web siteleri için uzun vadeli bir çözüm değildir. Dinamik oluşturma sunucusu, JavaScript ile oluşturulan içerikle ilgili sorun yaşayabilecek botları tespit eder ve kullanıcılara, içeriğin istemci taraflı oluşturulan sürümünü gösterirken bu botlara JavaScript olmadan sunucu taraflı oluşturulmuş bir sürüm sunar.

Dinamik oluşturma geçici bir çözümdür ve ek karmaşıklıklar ile kaynak gereksinimleri yarattığından önerilmez.

Dinamik oluşturmayı kullanması gereken siteler

Dinamik oluşturma, herkese açık JavaScript tarafından oluşturulan, dizine eklenebilir, hızla değişen içerikler veya önem verdiğiniz tarayıcıların desteklenmediği JavaScript özelliklerini kullanan içerikler için iyi bir çözümdür. Tüm sitelerin dinamik oluşturma özelliğini kullanması gerekmez. Ayrıca, web'de oluşturma hakkındaki bu makalede açıklandığı gibi, dinamik oluşturmadan daha iyi çözümler vardır.

Dinamik oluşturmanın işleyişini anlama

Dinamik oluşturma, web sunucunuzun tarayıcıları algılamasını gerektirir (örneğin, kullanıcı aracısını kontrol ederek). Tarayıcılardan gelen istekler bir oluşturucuya yönlendirilir, kullanıcılardan gelen istekler normal şekilde sunulur. Gerektiğinde, dinamik oluşturucu, tarayıcı için uygun içeriğin bir sürümünü sunar; örneğin, statik bir HTML sürümü sunabilir. Dinamik oluşturucuyu tüm sayfalar için veya tek tek sayfa temelinde etkinleştirmeyi seçebilirsiniz.

Dinamik oluşturmanın işleyiş şeklini gösteren bir şema. Şema, ilk HTML ve JavaScript içeriğini doğrudan tarayıcıya sunan sunucuyu göstermektedir. Buna karşılık, şema, ilk HTML ve JavaScript'i, bunları statik HTML'ye dönüştüren bir oluşturucuya sunan sunucuyu göstermektedir. İçerik dönüştürüldükten sonra oluşturucu, tarayıcıya statik HTML sunar.

Dinamik oluşturma gizleme değildir

Googlebot, genellikle dinamik oluşturmayı gizleme olarak saymaz. Dinamik oluşturmanız benzer içerik ürettiği sürece Googlebot dinamik oluşturmayı gizleme olarak görmez.

Dinamik oluşturmayı kurarken siteniz hata sayfaları üretebilir. Googlebot, bu hata sayfalarını gizleme olarak görmez ve hatayı diğer hata sayfalarıyla aynı şekilde işler.

Dinamik oluşturmayı, kullanıcılara ve tarayıcılara tamamen farklı içerik sunmak için kullanmak gizleme olarak kabul edilebilir. Örneğin, bir web sitesinin kullanıcılara kediler hakkında sayfa, tarayıcılara ise köpekler hakkında sayfa sunması gizleme olarak kabul edilebilir.

Dinamik oluşturmayı uygulama

İçeriğiniz için dinamik oluşturmayı ayarlarken genel yönergelerimizi uygulayın. Uygulamalar arasında büyük farklılıklar olduğundan, size özel yapılandırma ayrıntılarına başvurmanız gerekir.

  1. İçeriğinizi, tarayıcıların kolayca tüketebileceği statik HTML'ye dönüştürmek için bir dinamik oluşturucu (örneğin, Puppeteer, Rendertron veya prerender.io yükleyin ve yapılandırın.
  2. Statik HTML'nizi almasını istediğiniz kullanıcı aracısını seçip kullanıcı aracısını güncelleme veya eklemeyle ilgili özel yapılandırma ayrıntılarınıza bakın. Rendertron ara katman yazılımındaki genel kullanıcı aracıları listesinin bir örneğini aşağıda bulabilirsiniz:
    export const botUserAgents = [
      'googlebot',
      'bingbot',
      'linkedinbot',
      'mediapartners-google',
    ];
  3. Ön oluşturma sunucunuzu yavaşlatırsa veya çok sayıda ön oluşturma isteği görürseniz önceden oluşturulmuş içerik için bir önbellek uygulama veya isteklerin meşru tarayıcılardan geldiğini doğrulama seçeneğini değerlendirebilirsiniz.
  4. Kullanıcı aracılarının masaüstü veya mobil içerik gerektirip gerektirmediklerini belirleyin. Uygun masaüstü veya mobil sürümü sağlamak için dinamik sunmayı kullanın. Bir yapılandırmanın, kullanıcı aracısının masaüstü veya mobil içerik gerektirip gerektirmediğini nasıl belirleyebileceğine dair bir örneği aşağıda bulabilirsiniz:
    isPrerenderedUA = userAgent.matches(botUserAgents)
    isMobileUA = userAgent.matches(['mobile', 'android'])
    
    if (!isPrerenderedUA) { } else { servePreRendered(isMobileUA) }
  5. Sunucunuzu statik HTML'yi seçtiğiniz tarayıcılara yayınlayacak şekilde yapılandırın. Teknolojinize bağlı olarak bunu birkaç şekilde yapabilirsiniz. Burada birkaç örnek sağlanmıştır:
    • Tarayıcılardan dinamik oluşturucuya gelen proxy istekleri.
    • Dağıtım sürecinizin bir parçası olarak önceden oluşturma ve sunucunuzun tarayıcılara statik HTML'yi sunmasını sağlama.
    • Dinamik oluşturmayı özel sunucu kodunuza yerleştirme.
    • Tarayıcılara bir ön oluşturma hizmetinden statik içerik sunma.
    • Sunucunuz için bir ara katman yazılımı kullanma (örneğin, rendertron ara katman yazılımı).

Yapılandırmanızı doğrulama

Dinamik oluşturmayı uygulama işlemini bitirdikten sonra, aşağıdaki testlerle bir URL'yi kontrol ederek her şeyin beklendiği gibi çalıştığını doğrulayın:

  1. Google’ın içeriğinizi görebildiğinden emin olmak için mobil içeriğinizi Mobil Uyumluluk Testi ile test edin.

    Başarılı: Mobil içeriğiniz, kullanıcıların görmesini beklediğiniz içerikle eşleşiyor.

    Tekrar deneyin: Gördüğünüz içerik beklediğinizle eşleşmiyorsa sorun giderme bölümüne bakın.

  2. Oluşturulmuş sayfada (oluşturulmuş sayfa, Google'ın sayfanızı gördüğü biçimdir) masaüstü içeriğinin de görülebildiğinden emin olmak için masaüstü içeriğinizi URL Denetleme aracıyla test edin.

    Başarılı: Masaüstü içeriğiniz, kullanıcıların görmesini beklediğiniz içerikle eşleşiyor.

    Tekrar deneyin: Gördüğünüz içerik beklediğinizle eşleşmiyorsa sorun giderme bölümüne bakın.

  3. Yapılandırılmış veri kullanıyorsanız yapılandırılmış verilerinizin doğru biçimde oluşturulduğunu Zengin Sonuçlar Testi ile test edin.

    Başarılı: Yapılandırılmış verileriniz, beklediğiniz şekilde görünüyor.

    Tekrar deneyin: Yapılandırılmış veriler beklediğiniz şekilde görünmüyorsa sorun giderme bölümüne bakın.

Sorun giderme

İçeriğiniz Mobil Uyumluluk Testi'nde hatalar gösteriyorsa veya Google Arama sonuçlarında görünmüyorsa en sık karşılaşılan sorunları çözmeye çalışın. Sorun yaşamaya devam ediyorsanız Google Arama Merkezi Yardım Topluluğu'nda yeni bir konu yayınlayın.

İçerik eksik veya farklı görünüyor

Sorunun nedeni: Oluşturucunuz yanlış yapılandırılmış olabilir veya web uygulamanız, oluşturma çözümünüzle uyumlu olmayabilir. Bazen zaman aşımları da içeriğin doğru şekilde oluşturulmamasına neden olabilir.

Sorunu düzeltme: Dinamik oluşturma kurulumunuzdaki hataları ayıklamak için özel oluşturma çözümünüzün dokümanlarına bakın.

Uzun yanıt süreleri

Sorunun nedeni: Sayfaları isteğe bağlı olarak oluşturmak için gözetimsiz bir tarayıcı kullanmak genellikle uzun yanıt sürelerine neden olur. Bunun sonucunda, tarayıcılar isteği iptal edip içeriğinizi dizine eklemeyebilir. Uzun yanıt süreleri, tarayıcıların içeriğinizi tararken ve dizine eklerken tarama hızlarını düşürmelerine de neden olabilir.

Sorunu düzeltme

  1. Önceden oluşturulmuş HTML için bir önbellek oluşturun veya derleme işleminizin bir parçası olarak içeriğinizin statik HTML sürümünü oluşturun.
  2. Yapılandırmanızdaki önbelleği etkinleştirdiğinizden emin olun (örneğin, tarayıcılara önbelleğinizi işaret ederek).
  3. Tarayıcıların, Mobil Uyumluluk Testi veya webpagetest (Google Tarayıcısı kullanıcı aracıları listesindeki bir özel kullanıcı aracısı dizesiyle) gibi test araçlarını kullanarak içeriğinizi hızlı bir şekilde aldığından emin olun. İstekleriniz zaman aşımına uğramamalıdır.

Web Bileşenleri beklendiği gibi oluşturulmuyor

Sorunun nedeni: Gölge DOM, sayfanın geri kalanından izole edilmiştir. Oluşturma çözümleri (ör. Rendertron), izole edilen gölge DOM'un içeriğini göremiyordur. Daha fazla bilgi için web bileşenleri ile ilgili en iyi uygulamalara bakın.

Sorunu düzeltme

  1. Özel öğeler ve gölge DOM için webcomponents.js çoklu dolgularını yükleyin.
  2. İçeriğin, oluşturma çözümünüzün oluşturulan HTML'sinde görünüp görünmediğini kontrol etmek için Mobil Uyumluluk Testi veya URL Denetleme Aracı'nı kullanın.

Yapılandırılmış veri eksik

Sorunun nedeni: Yapılandırılmış veri kullanıcı aracısının eksik olması veya çıkışa JSON-LD komut dosyası etiketlerinin eklenmemesi, yapılandırılmış veri hatalarına neden olabilir.

Sorunu düzeltme

  1. Yapılandırılmış verilerin sayfada olduğundan emin olmak için Zengin Sonuçlar Testi'ni kullanın. Ardından kullanıcı aracısını önceden oluşturulmuş içeriği masaüstü veya mobil Googlebot ile test edecek şekilde yapılandırın.
  2. JSON-LD komut dosyası etiketlerinin, içeriğinizin dinamik olarak oluşturulmuş HTML'sine eklendiğinden emin olun. Daha fazla bilgi için oluşturma çözümünüzün dokümanlarına bakın.