Google'ın, gerektiğinde yüklenen içeriği görebildiğinden emin olun

Yaygın olarak "gerektiğinde yükleme" olarak da bilinen, kritik olmayan veya görünür olmayan içeriğin yüklenmesini erteleme, performansa ve kullanıcı deneyimine yönelik genel bir en iyi uygulamadır. Daha fazla bilgi için Web'in Temelleri resimleri ve videoları gerektiğinde yükleme kılavuzuna bakın. Ancak, doğru şekilde uygulanmazsa bu teknik yanlışlıkla içeriğin Google’dan gizlenmesine neden olabilir. Bu dokümanda, Google’ın gerektiğinde yüklenen içeriği tarayabildiğinden ve dizine ekleyebildiğinden nasıl emin olacağınız açıklanmaktadır.

İçeriği görüntü alanı içine geldiğinde yükleme

Googlebot’un sayfanızdaki tüm içeriği görmesini sağlamak için yükleme uygulamanızın tüm alakalı içeriği gerektiğinde görüntü alanında görünür olduğunda IntersectionObserver API'sini ve polyfill kullanarak yüklediğinden emin olun. Aşağıda, bunu nasıl yapabileceğinize dair birkaç örnek verilmiştir:

Uygulamanızı test ettiğinizden emin olun.

Sonsuz kaydırma için sayfalara ayrılmış yüklemeyi destekleme

Bir sonsuz kaydırma deneyimi uyguluyorsanız sayfalara ayrılmış yüklemeyi desteklediğinizden emin olun. Sayfalara ayrılmış yükleme, içeriğinizi paylaşmalarına ve içeriğinizle yeniden etkileşimde bulunmalarına olanak tanıdığından kullanıcılar açısından önemlidir. Ayrıca, Google’ın sonsuz kaydırma sayfasının en üstü yerine içerikte belirli bir noktanın bağlantısını göstermesine olanak tanır.

Sayfalara ayrılmış yüklemeyi desteklemek için kullanıcıların paylaşabilecekleri ve doğrudan yükleyebilecekleri her bir bölümün benzersiz bir bağlantısını sağlayın. İçerik dinamik bir biçimde yüklendiğinde URL’yi güncellemek için Geçmiş API’sini kullanmanızı öneririz.

Test etme

Uygulamanızı kurduktan sonra, doğru çalıştığından emin olmalısınız. Bunu yapmanın bir yolu, uygulamanızı yerel olarak test etmek için bir Puppeteer komut dosyası kullanmaktır. Puppeteer, gözetimsiz (headless) Chrome'u kontrol etmek için kullanılan bir Node.js kitaplığıdır. Komut dosyasını çalıştırmak için Node.js kitaplığına ihtiyacınız olacaktır. Komut dosyasını teslim almak ve çalıştırmak için aşağıdaki komutları kullanın:

git checkout https://github.com/GoogleChromeLabs/puppeteer-examples
cd puppeteer-examples
npm i
node lazyimages_without_scroll_events.js -h

Komut dosyasını çalıştırdıktan sonra, komutun oluşturduğu ekran görüntüsü resimlerini manuel olarak inceleyerek Googlebot tarafından görülmesini ve dizine eklenmesini beklediğiniz tüm içeriği kapsadıklarından emin olun.

Tüm resimlerin yüklenip yüklenmediğini görmek için Search Console'daki URL inceleme aracını da kullanabilirsiniz. Resimlerinizin yüklendiğinden emin olmak için ekran görüntüsünü ve oluşturulan HTML'yi kontrol edin.