Google I/O 2019'dan en son güncellemeler ve analizler alın.
Google Arama ile harika şeyler oluyor ve bunları Google I/O 2019'da paylaşmaktan heyecan duyuyoruz!
Bu yayında, JavaScript web uygulamalarını Google Arama'da bulunabilir yapmaya yönelik en iyi uygulamalara odaklanacağız. Örneğin:
- Yeni ve sürekli yenilenen Googlebot
- Googlebot'un tarama, oluşturma ve dizine ekleme hattı
- Özellik algılama ve hata işleme
- Oluşturma stratejileri
- Google Arama'da web siteniz için test araçları
- Sık karşılaşılan zorluklar ve olası çözümler
- JavaScript web uygulamalarında SEO için en iyi uygulamalar
Hiç eskimeyen Googlebot ile tanışın
Bu yıl merakla beklenen yeni ve sürekli yenilenen Googlebot'u duyurduk.
Googlebot artık Google Arama için web sitelerini oluşturmak amacıyla modern bir Chromium motoru kullanıyor. Bunun da ötesinde, Googlebot'u güncel tutmak için Chromium'un daha yeni sürümlerini test edeceğiz. Bu test, genellikle her kararlı Chrome sürümünden sonraki birkaç hafta içinde gerçekleşir. Bu duyuru, Googlebot'a ES6+, IntersectionObserver ve Web Bileşenleri v1 gibi 1.000'den fazla yeni özelliğin kullanıma sunulmasından dolayı web geliştiricileri ve SEO'lar için büyük bir haber.
Googlebot'un nasıl çalıştığını öğrenin
Googlebot, birkaç bileşeni olan bir ardışık düzendir. Googlebot'un sayfaları Google Arama için nasıl dizine eklediğini anlamaya çalışalım.
Süreç şu şekilde işler:
- Googlebot, URL'leri tarama için sıraya alır.
- Daha sonra, tarama bütçesine göre URL'leri bir HTTP isteğiyle getirir.
- Googlebot, HTML'deki bağlantıları tarar ve keşfedilen bağlantıları taranmak üzere sıraya alır.
- Googlebot, daha sonra sayfayı oluşturma için sıraya alır.
- Mümkün olan en kısa sürede, gözetimsiz bir Chromium örneği, sayfayı JavaScript yürütmesiyle oluşturur.
- Googlebot, oluşturulan HTML'yi sayfayı dizine eklemek için kullanır.
Teknik ayarlarınız tarama, oluşturma ve dizine ekleme sürecini etkileyebilir. Örneğin, yavaş yanıt süreleri veya sunucu hataları tarama bütçesini etkileyebilir. Başka bir örnek de, bağlantıları oluşturmak için JavaScript'in zorunlu tutulmasıdır. Bu durum, söz konusu bağlantıların daha yavaş keşfedilmesine yol açabilir.
Özellik algılamayı kullanma ve hataları ele alma
Hiç eskimeyen Googlebot'un pek çok yeni özelliği vardır, ancak bazı özellikler hâlâ desteklenmemektedir. Desteklenmeyen özelliklerin kullanılması veya hataların doğru şekilde ele alınmaması, Googlebot'un içeriğinizi oluşturamayacağı veya dizine ekleyemediği anlamına gelebilir.
Bir örneğe bakalım:
<body>
<script>
navigator.geolocation.getCurrentPosition(function onSuccess(position) {
loadLocalContent(position);
});
</script>
</body>
Kullanıcı izni reddettiğinde veya getCurrentPosition çağrısı bir hata döndürdüğünde kodun işlemediği bazı durumlarda bu sayfada hiçbir içerik gösterilmeyebilir. Googlebot, bunun gibi izin isteklerini varsayılan olarak reddeder.
Bu daha iyi bir çözümdür:
<body>
<script>
if (navigator.geolocation) {
// this browser supports the Geolocation API, request location!
navigator.geolocation.getCurrentPosition(
function onSuccess(position) {
// we successfully got the location, show local content
loadLocalContent(position);
}, function onError() {
// we failed to get the location, show fallback content
loadGlobalContent();
});
} else {
// this browser does not support the Geolocation API, show fallback content
loadGlobalContent();
}
</script>
</body>
JavaScript sitenizin dizine eklenmesini sağlama konusunda sorun yaşıyorsanız çözümleri bulmak için sorun giderme kılavuzumuzu inceleyin.
Web uygulamanız için doğru oluşturma stratejisini seçme
Günümüzde tek sayfalık uygulamalar için varsayılan oluşturma stratejisi, istemci tarafı oluşturmadır. HTML, JavaScript'i yükler, ardından da içeriği tarayıcıda çalışırken oluşturur.
Bir kedi resmi koleksiyonu gösteren ve tamamen tarayıcıda oluşturmak için JavaScript kullanan bir web uygulamasına göz atalım.
Oluşturma stratejinizi belirlemekte özgürseniz sunucu tarafı oluşturmayı veya önceden oluşturmayı tercih edebilirsiniz. İlk HTML içeriğini oluşturmak için sunucuda JavaScript yürütürler. Böylece hem kullanıcılar hem de tarayıcılar için performans artabilir. Bu stratejiler, ağ üzerinden geldiğinde tarayıcının HTML oluşturmaya başlamasını sağlayarak sayfanın daha hızlı yüklenmesini sağlar. I/O'daki oluşturma oturumu veya web'de oluşturma ile ilgili blog yayını, sunucu tarafı oluşturma ve hidrasyonun web uygulamalarının performansını ve kullanıcı deneyimini nasıl iyileştirebileceğini gösterir ve bu stratejiler için daha fazla kod örneği sağlar.
JavaScript çalıştırmayan tarayıcılara yardımcı olacak bir geçici çözüm arıyorsanız veya ön uç kod tabanınızda değişiklik yapamıyorsanız dinamik oluşturmayı kullanmayı düşünün. Bu codelab'de bunu deneyebilirsiniz. Bununla birlikte, dinamik oluşturma tarayıcılara yalnızca statik HTML sunduğundan, sunucu tarafı oluşturma veya önceden oluşturma ile elde ettiğiniz kullanıcı deneyiminden veya performans avantajlarından yararlanamayacağınızı unutmayın. Bu nedenle, uzun vadeli bir stratejiden ziyade bir geçici stratejiye dönüşüyor.
Sayfalarınızı test edin
Çoğu sayfa genellikle Googlebot ile sorunsuz bir şekilde çalışsa da, içeriğinizin Googlebot tarafından kullanılabildiğinden ve herhangi bir sorun olmadığından emin olmak için sayfalarınızı düzenli olarak test etmenizi öneririz. Bunu yapmanıza yardımcı olacak birkaç harika araç var.
Bir sayfayı hızlı bir şekilde kontrol etmenin en kolay yolu Mobil Uyumluluk Testi'dir. Bu araç, mobil uyumlulukla ilgili sorunları göstermenin yanı sıra, ekranın üst kısmındaki içeriğin ve oluşturulan HTML'nin, Googlebot'un gördüğü şekliyle bir ekran görüntüsünü de sunar.
Ayrıca, kaynak yükleme sorunları veya JavaScript hataları olup olmadığını da öğrenebilirsiniz.
Alan adınızı Google Search Console'da doğrulamanız önerilir. Böylece URL denetleme aracını kullanarak bir URL'nin tarama ve dizine ekleme durumu hakkında daha fazla bilgi edinebilir, Search Console sorun algıladığında mesaj alabilir ve sitenizin Google Arama'daki performansıyla ilgili daha ayrıntılı bilgi edinebilirsiniz.
Genel SEO ipuçları ve rehberliği için Lighthouse'daki SEO denetlemelerini kullanabilirsiniz. SEO denetimlerini test paketinize entegre etmek için Lighthouse CLI veya Lighthouse CI bot'unu kullanın.
Bu araçlar, Google Arama'daki sayfalarla ilgili sorunları tanımlamanıza, hata ayıklamanıza ve düzeltmenize yardımcı olur ve geliştirme rutininizin bir parçası olmalıdır.
Son gelişmelerden haberdar olun ve iletişim kurun
Google Arama ile ilgili duyurular ve değişikliklerden haberdar olmak için Web Yöneticileri Blogumuzu, Google Web Yöneticileri YouTube kanalımızı ve Twitter hesabımızı takip edin. SEO ve JavaScript hakkında daha fazla bilgi edinmek için Google Arama ile ilgili geliştirici kılavuzumuza ve JavaScript SEO video serimize de göz atın.