Google ReactJS İçeriğini Görebilir Mi? | React SEO
Google sonuçlarında yer almak her site gibi react.js ile inşa edilmiş siteler için de önemlidir. ReactJS‘ in tüm html katmanını javascript ile kullanıcının tarayıcısında çizdiğinden geçen yazıda ufak da olsa bahsetmiştik.
Peki html tarayıcıda oluşturuluyorsa, google böcekleri içeriği nasıl okuyacak? Birkaç sene öncesine kadar google sadece arayüzdeki kod ile ilgilenir, dinamik sayfalardaki değişikliklerle ilgilenmezdi. Fakat artan tek sayfa arayüzler, interaktif uygulamalar ve yeni arayüz çatıları ile google gözünü yüklenmeden sonra oluşturulan içeriğe dikmiş durumda.
Aslında google bir dönem sayfadaki Ajax isteklerini okumaya niyetlenmişti. Fakat sonra bundan vazgeçtiler. Fakat bunun yerine DOM’un render edildikten sonraki halini okuyabiliyor google böcekleri artık. Bunu da python’daki Mechanize gibi bir araç ile, yani bir browser emulate ederek, belki de tam olarak Mechanize ile crawl edip sayfanın son haline bakarak yapıyorlar.
Peki bunu nasıl anlayabiliriz derseniz, Google Webmaster Tools’daki “Fetch as Google” yani Google gibi getir düğmesinin hemen yanına gelen Fetch and Render düğmesi ile görebilirsiniz.
Veya bir diğer yol da, Google Sayfa Hızı Test Aracı‘nda sayfayı test etmek. Buradaki ekran görüntülerinden de anlayabileceğiniz üzere React ile çizilmiş olan arayüzü artık anlayabiliyor Google.
Diğer önemli bir nokta ise, eğer Ajax ile yüklediğiniz bir içerik varsa ve bu iş zaman alıyorsa, google yeteri kadar beklemeyip o yüklenecek olan içeriği göremeyebilir. O yüzden DOM henüz çizilmeden istek yapmaya veya bu işlem süresini kısa tutmaya gayret etmelisiniz.
Ayrıca sitenizdeki tüm sayfa türlerini bu araçlarda test edip çalıştıklarından emin olmanız önemlidir.
Küçük ama önemli bir detaydı. Bir çok insan için React kullanma konusunda tercih unsuru olduğunu düşünüyordum. Sanırım artık soru işareti kalmamıştır. Bir sonraki yazıda görüşmek üzere.
3 Yorumlar
React in lisans kullanimi biraz sikinti
facebook ile rekabet edersen yada react kullanan firmalarla ihtilafin varsa facebook mudahil olabilir Angular da bu yok misal MIT lisansına sahıp,
Sizin bu konu hakkinizda bılgınız var mi
Selam. Siz söyleyince kontrol ettim 3 maddeli BSD lisansı varmış.
Esasen ben son aylarda ReactJS yerine PreactJS kullanmaya başladım. Kendisi react’ın birebir aynı api’ına sahip ve tamamen es6 ve es7ye göre yazıldığı için çok küçük boyutlarda.
githubda yeni 10bin beğeniyi geçti, egghead.io tutorial yaptı hakkında, yavaş yavaş yayılıyor. ayrıca MIT lisansına sahip. https://github.com/developit/preact
geliştiricisi Jason çok aktif bir developer, sürekli yeni örnekler ve preact ile kullanılabilecek kütüphaneler geliştiriyor. takip etmenizi öneririm. ayrıca son olarak, preact-compat adındaki modül ile react kütüphaneleri büyük oranda kullanılabiliyor.
Merhaba,
Canlı bir örnek üzerinde test yaptığım zaman, Google Sayfa Hız Testi aracı ile dediğiniz gibi görüntü ve içerik geliyor fakat, Arama Konsolu’ndan Google Gibi Getir dediğim zaman sayfada herhangi bir html çıktı olmadığı görünüyor, sadece bundle ve diğer js kütüphneleri var. Crawler robotları geldiği zaman bu sayfalarda hangi içeriklerin olduğunu söyleyen bazı paralı 3. parti uygulamalar olduğunu gördüm. Preact deneyeceim, umarım aynı sorun onda da yoktur.
İyi Çalışmalar