Cumartesi 28 Ocak 2023
Hakkında
Yazarlarımız
Reklam
Künye
İletişim
Webmaster.Kitchen – Türkiye'nin Webmaster MutfağıWebmaster.Kitchen – Türkiye'nin Webmaster Mutfağı

Bülten

Sosyal Medya Yasası Kabul Edildi

Binance ‘e Siber Saldırı

Webmaster.Kitchen – Türkiye'nin Webmaster MutfağıWebmaster.Kitchen – Türkiye'nin Webmaster Mutfağı
  • BAŞLARKEN
    • KOD
      • PHP
      • Asp.Net
      • Swift
      • MySQL
      • CMS
  • TASARIM
    • İpuçları
    • Çizim
    • Illustrator
    • Photoshop
    • Trendler
  • ARAYÜZ
    • JavaScript
    • HTML5
    • CSS
    • REACT
  • İPUÇLARI
    • API
    • Güvenlik
    • IDE
    • Framework
    • OS
    • Verimlilik
    • İçerik
      • Dökümantasyon
      • İpuçları
      • Nasıl Oluşturulur?
  • KAYNAKLAR
    • Tasarım
    • Kod
    • İş
  • GİRİŞİM
    • Finans
    • Girişimci
    • Nasıl yapılır?
  • ARAÇLAR
  1. Anasayfa
  2. Arayüz
  3. Google ReactJS İçeriğini Görebilir Mi? | React SEO
 Google ReactJS İçeriğini Görebilir Mi? | React SEO
Arayüz React

Google ReactJS İçeriğini Görebilir Mi? | React SEO

Yazar : Mehmet KÖSE 24 Haziran 2016 3 Comments

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.

webmaster-tools

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.

fetch-and-render

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.

Etiketler: arama motoru optimizasyon google seo javascript seo react react seo teknikleri react seo uyumu react ve seo react.js seo reactjs SEO
Önceki Yazı
Sonraki Yazı

Mehmet KÖSE (Website)

editor

3 Yorumlar

  • Tahsin says:
    12 Haziran 2017 at 01:06

    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

    Reply
    • Mehmet KÖSE says:
      18 Haziran 2017 at 13:38

      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.

      Reply
  • Melih Tuna says:
    17 Şubat 2018 at 09:44

    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

    Reply

Yorum Yap Yorumu İptal Et.

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Taze Yazılar
Güncel

Sosyal Medya Yasası Kabul Edildi

14 Ekim 2022
Blockchain

Binance ‘e Siber Saldırı

8 Ekim 2022
Blockchain

Binance ‘den Ücretsiz Eğitim

5 Ekim 2022
Güncel

Japonya için Yenilenen Corolla

4 Ekim 2022
© 2021 Webmaster Kitchen. Tüm Hakları Saklıdır.