Ahrefs Blogunun WordPress tarafından desteklendiğini, ancak sitenin geri kalanının çoğunun React gibi JavaScript tarafından desteklendiğini biliyor muydunuz?

Mevcut web'in gerçeği, JavaScript'in her yerde olmasıdır. Çoğu web sitesi etkileşim eklemek ve kullanıcı deneyimini geliştirmek için bir tür JavaScript kullanır. 

Ancak pek çok web sitesinde kullanılan JavaScript'in çoğu SEO'yu hiçbir şekilde etkilemeyecektir. Çok fazla özelleştirme gerektirmeyen normal bir WordPress kurulumunuz varsa, muhtemelen sorunların hiçbiri sizin için geçerli olmayacaktır.

JavaScript'in bir sayfanın tamamını oluşturmak, öğeleri eklemek veya kaldırmak veya sayfada zaten olanı değiştirmek için kullanıldığı durumlarda sorunlarla karşılaşacaksınız. Bazı siteler bunu menüler, ürün veya fiyat almak, birden fazla kaynaktan içerik almak veya bazı durumlarda sitedeki her şey için kullanır. Bu sizin sitenize benziyorsa okumaya devam edin.

JavaScript çerçeveleriyle oluşturulmuş tüm sistemleri ve uygulamaları ve hatta başsız veya ayrıştırılmış bir JavaScript özelliğine sahip bazı geleneksel CMS'leri görüyoruz. CMS, arka uç veri kaynağı olarak kullanılır, ancak ön uç sunumu JavaScript tarafından gerçekleştirilir.

Web, düz HTML'den yola çıktı; bir SEO olarak bunu benimseyebilirsiniz. JS geliştiricilerinden öğrenin ve SEO bilgilerini onlarla paylaşın. JS gitmiyor.

— 308 yönlendirmesi 301 yönlendirmesinden daha iyidir. Fikrimi değiştir. (@JohnMu) 8 Ağustos 2017

SEO'ların dışarı çıkıp JavaScript'i nasıl programlayacaklarını öğrenmeleri gerektiğini söylemiyorum. Aslında bunu önermiyorum çünkü koda dokunmanız pek mümkün değil. SEO'ların bilmesi gereken şey, Google'ın JavaScript'i nasıl ele aldığı ve sorunların nasıl giderileceğidir. 

JavaScript SEO'nun bir parçası teknik SEO (arama motoru optimizasyonu), JavaScript ağırlıklı web sitelerinin taranmasını ve dizine eklenmesini kolaylaştırmanın yanı sıra arama dostu hale getirir. Amaç bu web sitelerinin bulunmasını ve arama motorlarında daha üst sıralarda yer almak.

JavaScript SEO için kötü değildir ve kötü de değildir. Bu, birçok SEO uzmanının alışık olduğundan farklıdır ve biraz öğrenme eğrisi vardır. 

Süreçlerin çoğu, SEO'ların zaten görmeye alışkın olduğu şeylere benzer, ancak küçük farklılıklar olabilir. Aslında JavaScript'e değil, çoğunlukla HTML koduna bakacaksınız.

Tüm normal sayfa içi SEO en iyi uygulamaları hala geçerlidir. Görmek sayfa içi SEO ile ilgili rehberimiz.

Kullandığınız çerçeveye önceden yerleştirilmemişse, birçok temel SEO öğesini işlemek için tanıdık eklenti türü seçenekleri bile bulacaksınız. JavaScript çerçeveleri için bunlara modüller denir ve bunları yüklemek için birçok paket seçeneği bulacaksınız.

Gibi popüler çerçevelerin çoğunun versiyonları var React, Vue, Angular ve Svelte'yi “React Kask” gibi çerçeve + modül adını arayarak bulabilirsiniz. Meta etiketleri, Kask ve Başlık benzer işlevlere sahip popüler modüllerdir ve SEO için gereken popüler etiketlerin çoğunun ayarlanmasına olanak tanır.

JavaScript, oluşturma kolaylığı ve performans gibi bazı açılardan geleneksel HTML'den daha iyidir. Bazı yönlerden JavaScript daha kötüdür, örneğin aşamalı olarak ayrıştırılamaz (HTML ve CSS'nin olabileceği gibi) ve sayfa yükü ve performansı açısından ağır olabilir. Çoğu zaman, işlevsellik karşılığında performansınızı takas ediyor olabilirsiniz.

JavaScript mükemmel değildir ve her zaman iş için doğru araç değildir. Geliştiriciler, muhtemelen daha iyi bir çözümün olduğu şeyler için onu aşırı kullanıyorlar. Ancak bazen size verilenlerle çalışmanız gerekir.

Bunlar, JavaScript siteleriyle çalışırken karşılaşabileceğiniz yaygın SEO sorunlarının çoğudur.

Benzersiz başlık etiketlerine ve meta açıklamalara sahip olun

Hala benzersiz bir şeye sahip olmak isteyeceksiniz başlık etiketleri ve meta açıklamaları sayfalarınız arasında. Birçok JavaScript çerçevesi şablonlaştırılmış olduğundan, tüm sayfalar veya bir sayfa grubu için aynı başlığın veya meta açıklamanın kullanıldığı bir durumla kolayca karşılaşabilirsiniz.

kontrol çoğaltır Ahrefs'te rapor Site Denetimi Bulduğumuz sorunlarla ilgili daha fazla veri görmek için gruplamalardan herhangi birini tıklayın.

Her sayfaya özel etiketler ayarlamak için Kask gibi SEO modüllerinden birini kullanabilirsiniz.

JavaScript, ayarlamış olabileceğiniz varsayılan değerlerin üzerine yazmak için de kullanılabilir. Google bunu işleyecek ve üzerine yazılan başlığı veya açıklamayı kullanacaktır. Ancak kullanıcılar için başlıklar sorunlu olabilir, çünkü tarayıcıda bir başlık görünebilir ve üzerine yazıldığında bir flaş fark edeceklerdir.

Başlığın yanıp söndüğünü görürseniz Ahrefs'i kullanabilirsiniz. SEO Araç Çubuğu Hem ham HTML hem de işlenmiş sürümleri görmek için.

Google hiçbir şekilde başlıklarınızı veya meta açıklamalarınızı kullanamaz. Bahsettiğim gibi başlıklar kullanıcılar için temizlenmeye değer. Ancak bunu meta açıklamalar için düzeltmek gerçekten bir fark yaratmayacak.

Google'ın yeniden yazımını incelediğimizde şunu bulduk: Google %33.4 oranında başlıkların üzerine yazıyor ve Meta açıklamalar %62.78 oranında. Site Denetiminde, size Google'ın başlık etiketlerinizden hangilerini değiştirdiğini bile göstereceğiz.

Kanonik etiket sorunları

Google yıllarca saygı duymadığını söyledi kanonik etiketler JavaScript ile eklendi. Sonunda, halihazırda bir etiketin bulunmadığı durumlar için belgelere bir istisna eklendi. Bu değişikliğe ben sebep oldum. Google herkese işe yaramadığını söylerken bunun işe yaradığını göstermek için testler yaptım.

URL Denetleme aracı, JavaScript'e eklenen standartlar hakkında ne söylüyor? İşte bir tanesi https://t.co/rZDpYgwK8r (html'de kanonik yok), bir süre önce buna kesinlikle saygı duyuldu ve SERP'lerde değiştirildi, ancak şimdi araçlar bile bana bunu gördüklerini ve saygı duyduklarını söylüyor. @JohnMu pic.twitter.com/vmml2IG7bk

— Patrick Stox (@patrickstox) 3 Ağustos 2018

Zaten bir kanonik etiket mevcutsa ve bir tane daha eklerseniz veya mevcut etiketin üzerine JavaScript ile yazarsanız, onlara iki kanonik etiket vermiş olursunuz. Bu durumda, Google'ın kanonik etiketleri hangisinin kullanacağını veya yoksayacağını diğer etiketler lehine bulması gerekir. kanonikleştirme sinyalleri.

"Her sayfada kendine referans veren bir kanonik etiket bulunmalıdır" şeklindeki standart SEO tavsiyesi birçok SEO'nun başını belaya sokar. Bir geliştirici bu gereksinimi alır ve sonunda eğik çizgi olan ve olmayan sayfaları kendi kendine kanonik hale getirir.

example.com/page kanonik ile example.com/page ve example.com/page/ kanonik ile example.com/page/. Hata, bu yanlış! Muhtemelen bu sürümlerden birini diğerine yönlendirmek istersiniz.

Aynı şey, birleştirmek isteyebileceğiniz parametreli sürümlerde de olabilir, ancak her biri kendi kendine referanslıdır.

Google en kısıtlayıcı meta robot etiketini kullanıyor

İle meta robot etiketleriGoogle, konum ne olursa olsun her zaman gördüğü en kısıtlayıcı seçeneği kullanacaktır. 

Ham HTML'de bir dizin etiketiniz ve oluşturulan HTML'de noindex etiketiniz varsa, Google bunu noindex olarak değerlendirecektir. Ham HTML'de bir noindex etiketiniz varsa ancak JavaScript kullanarak bunun üzerine bir indeks etiketi yazarsanız, o sayfa yine de noindex olarak değerlendirilecektir.

Nofollow etiketleri için de aynı şekilde çalışır. Google en kısıtlayıcı seçeneği kullanacak. 

Görsellerin alt niteliklerini ayarlama

Eksik alt nitelikler erişilebilirlik sorunudur ve hukuki bir soruna dönüşebilir. Çoğu büyük şirkete web sitelerindeki ADA uyumluluk sorunları nedeniyle dava açıldı ve bazıları yılda birden çok kez dava ediliyor. Bunu ana içerik görselleri için düzeltirim ancak alt niteliklerini boş bırakabileceğiniz yer tutucu veya dekoratif görseller gibi şeyler için düzeltmem.

Web araması için, alt niteliklerindeki metin sayfadaki metin olarak sayılır, ancak gerçekte oynadığı tek rol budur. Bana göre SEO açısından önemi genellikle abartılıyor. Ancak görsel arama ve görsel sıralamasında yardımcı olur.

Pek çok JavaScript geliştiricisi alt niteliklerini boş bırakıyor, bu nedenle sizinkilerin orada olup olmadığını bir kez daha kontrol edin. Bak Fotoğraflar rapor etmek Site Denetimi bunları bulmak için.

JavaScript dosyalarının taranmasına izin ver

Sayfanın bir bölümünü oluşturmak veya içeriğe ekleme yapmak için gerekliyse kaynaklara erişimi engellemeyin. Google'ın sayfaları düzgün bir şekilde oluşturabilmesi için kaynaklara erişmesi ve bunları indirmesi gerekiyor. senin içinde robots.txtgerekli kaynakların taranmasına izin vermenin en kolay yolu şunu eklemektir:

User-Agent: Googlebot
Allow: .js
Allow: .css

Ayrıca, API çağrılarınız için olanlar gibi istekte bulunabileceğiniz alt alan adları veya ek alan adları olup olmadığını görmek için robots.txt dosyalarını da kontrol edin.

Kaynakları robots.txt ile engellediyseniz Chrome Geliştirme Araçları'ndaki "Ağ" sekmesindeki engelleme seçeneklerini kullanarak bunun sayfa içeriğini etkileyip etkilemediğini kontrol edebilirsiniz. Dosyayı seçin ve engelleyin, ardından herhangi bir değişiklik yapılıp yapılmadığını görmek için sayfayı yeniden yükleyin.

Google'ın içeriğinizi görüp görmediğini kontrol edin

JavaScript işlevine sahip birçok sayfa, içeriğin tamamını varsayılan olarak Google'a göstermeyebilir. Geliştiricilerinizle konuşursanız, bunun Belge Nesne Modeli (DOM) yüklü olmadığı şeklinde yorumlayabilirler. Bu, içeriğin varsayılan olarak yüklenmediği ve daha sonra tıklama gibi bir işlemle yüklenebileceği anlamına gelir.

Yapabileceğiniz hızlı bir kontrol, içeriğinizin bir kısmını Google'da tırnak işaretleri içinde aramaktır. "İçeriğinizden bazı ifadeler" ifadesini arayın ve sayfanın arama sonuçlarında döndürülüp döndürülmediğine bakın. Öyleyse içeriğiniz büyük ihtimalle görülmüştür.

Ayrıca sağ tıklayıp “İncele” seçeneğini de kullanabilirsiniz. Metni “Öğeler” sekmesinde arayın.

En iyi kontrol, Google Search Console'daki URL Denetleme aracı gibi Google'ın test araçlarından birinin içeriğinde arama yapmak olacaktır. Bu konu hakkında daha sonra daha fazla konuşacağım.

Bir akordeonun veya açılır listenin arkasındaki her şeyi kesinlikle kontrol ederdim. Genellikle bu öğeler, tıklandığında sayfaya içerik yükleyen isteklerde bulunur. Google tıklamadığı için içeriği görmez.

İçerik aramak için inceleme yöntemini kullanıyorsanız, içeriği kopyaladığınızdan ve ardından sayfayı yeniden yüklediğinizden veya arama yapmadan önce gizli bir pencerede açtığınızdan emin olun. 

Bu eylem gerçekleştirilirken öğeye ve yüklenen içeriğe tıkladıysanız içeriği bulacaksınız. Sayfanın yeni yüklenmesiyle aynı sonucu göremeyebilirsiniz.

Yinelenen içerik sorunları

JavaScript'te aynı içerik için birden fazla URL olabilir ve bu da şuna yol açar: yinelenen içerik sorunlar. Bunun nedeni büyük harf kullanımı, sondaki eğik çizgiler, kimlikler, kimlikli parametreler vb. olabilir. Dolayısıyla bunların tümü mevcut olabilir:

domain.com/Abc
domain.com/abc
domain.com/123
domain.com/?id=123

Yalnızca bir sürümün dizine eklenmesini istiyorsanız, kendi kendine referans veren bir kanonik etiket ve ana sürüme referans veren diğer sürümlerden kanonik etiketler ayarlamanız veya ideal olarak diğer sürümleri ana sürüme yönlendirmeniz gerekir.

kontrol çoğaltır rapor etmek Site Denetimi. Hangi yinelenen kümelerin standart etiketlere sahip olduğunu ve hangilerinin sorun yaşadığını ayrıntılı olarak inceliyoruz.

JavaScript çerçeveleriyle ilgili yaygın bir sorun, sayfaların sonunda eğik çizgiyle veya eğik çizgi olmadan var olabilmesidir. İdeal olarak, tercih ettiğiniz sürümü seçer ve bu sürümün kendine referans veren bir kanonik etikete sahip olduğundan emin olur ve ardından diğer sürümü tercih ettiğiniz sürüme yönlendirirsiniz.

Uygulama kabuğu modellerinde, ilk HTML yanıtında çok az içerik ve kod gösterilebilir. Aslında sitedeki her sayfada aynı kod görüntülenebilir ve bu kod, diğer bazı sitelerdeki kodlarla tamamen aynı olabilir. 

Site Denetiminde kelime sayısı düşük çok sayıda URL görüyorsanız bu, bu sorunla karşılaştığınızın göstergesi olabilir. 

Bu bazen sayfaların kopya olarak değerlendirilmesine ve hemen oluşturulmamasına neden olabilir. Daha da kötüsü, arama sonuçlarında yanlış sayfa, hatta yanlış site görünebilir. Bu durum zamanla kendiliğinden çözülecektir ancak özellikle yeni web sitelerinde sorun yaratabilir.

URL'lerde parça (#) kullanmayın

# tarayıcılar için zaten tanımlanmış bir işlevselliğe sahiptir. Blogdaki "içindekiler" özelliğimiz gibi, tıklandığında sayfanın başka bir bölümüne bağlantı verir. Sunucular genellikle # işaretinden sonra hiçbir şeyi işlemez. Yani şöyle bir URL için abc.com/#something# işaretinden sonraki her şey genellikle göz ardı edilir. 

JavaScript geliştiricileri farklı amaçlar için # tetikleyicisini kullanmak istediklerine karar verdiler ve bu da kafa karışıklığına neden oluyor. Kötüye kullanılmalarının en yaygın yolları yönlendirme ve URL parametreleri. Evet çalışıyorlar. Hayır, yapmamalısın.

JavaScript çerçeveleri genellikle rota (yol) adını verdikleri şeyleri eşleyen yönlendiricilere sahiptir. temiz URL'ler. Birçok JavaScript geliştiricisi yönlendirme için karma (#) kullanır. Bu özellikle Vue ve Angular'ın önceki bazı sürümleri için bir sorundur. 

Bunu Vue için düzeltmek amacıyla geliştiricinizle birlikte çalışarak aşağıdakileri değiştirebilirsiniz:

Vue router: 
Use ‘History’ Mode instead of the traditional ‘Hash’ Mode.

const router = new VueRouter ({
mode: ‘history’,
router: [] //the array of router links
)}

İnsanların ? yerine # kullandığı yönünde büyüyen bir trend var. parça tanımlayıcı olarak, özellikle izleme için kullanılanlar gibi pasif URL parametreleri için. Tüm karışıklıklar ve sorunlar nedeniyle buna karşı çıkma eğilimindeyim. Duruma göre, pek çok gereksiz parametreden kurtulmamın bir sakıncası olmayabilir.

Site haritası oluşturun

Temiz URL'lere izin veren yönlendirici seçeneklerinde genellikle site haritaları da oluşturabilen ek bir modül bulunur. Bunları, "Vue yönlendirici site haritası" gibi sistem + yönlendirici site haritanızı arayarak bulabilirsiniz. 

Oluşturma çözümlerinin çoğunda site haritası seçenekleri de bulunabilir. Yine, kullandığınız sistemi bulun ve sistem + "Gatsby site haritası" gibi site haritasını Google'da bulun; zaten var olan bir çözümü bulacağınızdan emin olabilirsiniz.

Durum kodları ve soft 404'ler

JavaScript çerçeveleri sunucu tarafında olmadığından, 404 gibi bir sunucu hatası veremezler. Hata sayfaları için birkaç farklı seçeneğiniz vardır, örneğin:

1. 404 durum koduyla yanıt veren bir sayfaya JavaScript yönlendirmesi kullanma.
2. Başarısız olan sayfaya "404 Sayfa Bulunamadı" gibi bir tür hata mesajıyla birlikte bir noindex etiketi eklemek. Döndürülen gerçek durum kodu 404 tamam olacağından bu, soft 200 olarak ele alınacaktır.

JavaScript yönlendirmeleri sorun yaratmaz ancak tercih edilmez

SEO'lar için kullanılır 301/302 yönlendirmeleri, bunlar sunucu tarafındadır. JavaScript genellikle istemci tarafında çalıştırılır. Sunucu tarafı yönlendirmelerini ve hatta meta yenileme yönlendirmelerini işlemek, Google'ın bunları görmek için sayfayı oluşturmasına gerek kalmayacağından JavaScript yönlendirmelerine göre daha kolay olacaktır.

JavaScript yönlendirmeleri, oluşturma sırasında yine de görülüp işlenecektir ve çoğu durumda sorun yaratmaz; ancak diğer yönlendirme türleri kadar ideal değildirler. Kalıcı yönlendirmeler olarak kabul edilirler ve yine de aşağıdaki gibi tüm sinyalleri iletirler: PageRank.

Bu yönlendirmeleri genellikle kodda “window.location.href” ifadesini arayarak bulabilirsiniz. Yönlendirmeler potansiyel olarak yapılandırma dosyasında da olabilir. Next.js yapılandırmasında, yönlendirmeleri ayarlamak için kullanabileceğiniz bir yönlendirme işlevi vardır. Diğer sistemlerde bunları yönlendiricide bulabilirsiniz.

Uluslararasılaşma sorunları

Uluslararasılaştırma için gerekli olan bazı özellikleri destekleyen farklı çerçeveler için genellikle birkaç modül seçeneği vardır: hreflang. Bunlar genellikle farklı sistemlere taşınmıştır ve i18n, intl içerir veya çoğu kez, gerekli etiketleri eklemek için Kask gibi başlık etiketleri için kullanılan aynı modüller kullanılabilir.

Hreflang sorunlarını şu şekilde işaretliyoruz: Yerelleştirme rapor etmek Site Denetimi. Ayrıca bir çalışma yürüttük ve şunu bulduk: Hreflang kullanan alan adlarının %67'sinde sorun var.

Siteniz belirli bir ülkeden gelen ziyaretçileri engelliyor veya bu ziyaretçilere davranıyorsa ya da belirli bir IP'yi farklı şekillerde kullanıyorsa da dikkatli olmanız gerekir. Bu, içeriğinizin kullanıcılar tarafından görülmemesine neden olabilir. Googlebot. Kullanıcıları yönlendiren bir mantığınız varsa botları bu mantığın dışında bırakmak isteyebilirsiniz.

Site Denetiminde bir proje ayarlarken bunun olup olmadığını size bildireceğiz.

Yapılandırılmış verileri kullanın

JavaScript, sayfalarınıza yapılandırılmış veriler oluşturmak veya eklemek için kullanılabilir. Bunu JSON-LD ile yapmak oldukça yaygındır ve herhangi bir soruna neden olması muhtemel değildir, ancak her şeyin beklediğiniz gibi çıktığından emin olmak için bazı testler yapın.

Şurada gördüğümüz tüm yapılandırılmış verileri işaretleyeceğiz: Sorunlar rapor etmek Site Denetimi. “Yapılandırılmış verilerde schema.org doğrulaması var” hatasını arayın. Size her sayfada tam olarak neyin yanlış olduğunu söyleyeceğiz.

Standart formattaki bağlantıları kullanın

Diğer sayfalara olan bağlantılar web standardı formatında olmalıdır. İç ve dış bağlantıların bir olması gerekir <a> ile etiketleyin href bağlanmak. Arama dostu olmayan JavaScript kullanan kullanıcılar için bağlantıların çalışmasını sağlamanın birçok yolu vardır.

Şunun için iyi:

<a href=”/page”>simple is good</a>

<a href=”/page” onclick=”goTo(‘page’)”>still okay</a>

kötü:

<a onclick=”goTo(‘page’)”>nope, no href</a>

<a href=”javascript:goTo(‘page’)”>nope, missing link</a>

<a href=”javascript:void(0)”>nope, missing link</a>

<span onclick=”goTo(‘page’)”>not the right HTML element</span>

<option value="page">nope, wrong HTML element</option>

<a href=”#”>no link</a>

Düğmeye tıklayın, bunun yanlış yapılmasının daha birçok yolu vardır.

Deneyimlerime göre, Google hala birçok kötü bağlantıyı işliyor ve tarıyor, ancak PageRank gibi uzak geçiş sinyalleri olarak bunları nasıl ele aldığından emin değilim. Web dağınık bir yerdir ve Google'ın ayrıştırıcıları genellikle oldukça bağışlayıcıdır.

Ayrıca bunu fark etmeye değer iç bağlantılar JavaScript ile eklenenler, oluşturma işlemi bitene kadar alınmayacaktır. Bu nispeten hızlı olmalı ve çoğu durumda endişe kaynağı olmamalıdır.

Dizine eklenen imkansız durumları çözmek için dosya sürüm oluşturmayı kullanın

Google, tüm kaynakları kendi tarafında yoğun bir şekilde önbelleğe alır. Bu konu hakkında daha sonra biraz daha konuşacağım, ancak sistemin bazı imkansız durumların indekslenmesine yol açabileceğini bilmelisiniz. Bu, sistemlerinin bir tuhaflığıdır. Bu durumlarda, oluşturma işleminde önceki dosya sürümleri kullanılır ve sayfanın dizine eklenen sürümü, eski dosyaların bölümlerini içerebilir.

Önemli değişiklikler yapıldığında yeni dosya adları oluşturmak için dosya sürümü oluşturma veya parmak izi almayı (file.12345.js) kullanabilirsiniz; böylece Google, oluşturma amacıyla kaynağın güncellenmiş sürümünü indirmek zorunda kalır.

Googlebot'a gösterilenleri göremeyebilirsiniz

Bazı sorunları doğru şekilde teşhis etmek için kullanıcı aracınızı değiştirmeniz gerekebilir. İçerik, farklı kullanıcı aracıları ve hatta IP'ler için farklı şekilde oluşturulabilir. Google'ın test araçlarıyla gerçekte ne gördüğünü kontrol etmelisiniz; bunlara biraz sonra değineceğim.

Belirli kullanıcı aracılarına dayalı olarak önceden oluşturulan sitelerdeki sorunları gidermek için Chrome DevTools ile özel bir kullanıcı aracısı ayarlayabilirsiniz veya bunu şununla kolayca yapabilirsiniz: araç çubuğumuz yanı sıra.

Desteklenmeyen özellikler için çoklu doldurmaları kullanın

Geliştiricilerin kullandığı, Googlebot'un desteklemediği özellikler olabilir. Geliştiricileriniz kullanabilir özellik algılama. Eksik bir özellik varsa, bu işlevi atlamayı veya bir geri dönüş yöntemi kullanmayı seçebilirler. çoklu dolgu işe yarayıp yaramayacağını görmek için.

Bu çoğunlukla SEO'lar için bir bilgidir. Google'ın görmesi gerektiğini düşündüğünüz bir şey görürseniz ve Google bunu görmüyorsa bunun nedeni uygulama olabilir. 

Geç yükleme kullan

Bunu ilk yazdığımdan beri, yavaş yükleme çoğunlukla JavaScript odaklı olmaktan tarayıcılar tarafından işlenmeye dönüştü.

Hala bazı JavaScript odaklı tembel yükleme kurulumlarıyla karşılaşabilirsiniz. Çoğunlukla, tembel yükleme görüntüler içinse muhtemelen sorun olmaz. Kontrol edeceğim en önemli şey içeriğin yavaş yüklenip yüklenmediğini görmek. Yukarıdaki "Google'ın içeriğinizi görüp görmediğini kontrol edin" bölümüne tekrar bakın. Bu tür kurulumlar içeriğin doğru şekilde alınmasında sorunlara neden oldu.

Sonsuz kaydırma sorunları

Sonsuz kaydırma kurulumunuz varsa, Google'ın düzgün bir şekilde tarayabilmesi için yine de sayfalandırılmış sayfa sürümünü öneririm.

Bu kurulumda gördüğüm başka bir sorun da bazen iki sayfanın tek sayfa olarak dizine eklenmesidir. İnsanlar sayfalarının dizine eklenemediğini söylediğinde bunu birkaç kez gördüm. Ancak içeriklerinin, genellikle onlardan önceki gönderi olan başka bir sayfanın parçası olarak dizine eklendiğini buldum.

Benim teorim, Google görünüm alanını daha uzun olacak şekilde yeniden boyutlandırdığında (bu konuya daha sonra değineceğim), sonsuz kaydırmayı tetikledi ve oluşturulurken başka bir makale yükledi. Bu durumda, sonsuz kaydırmayı işleyen JavaScript dosyasını engellemenizi öneririm, böylece işlevsellik tetiklenemez.

Performans sorunları

Birçok JavaScript çerçevesi sizin için bir sürü modern performans optimizasyonuyla ilgilenir.

Tüm geleneksel performans en iyi uygulamaları hala geçerlidir, ancak bazı yeni ve şık seçeneklere sahip olursunuz. Kod bölme, dosyaları daha küçük dosyalara ayırır. Ağacın sallanması gerekli parçaları ortadan kaldırır, dolayısıyla geleneksel monolitik kurulumlarda gördüğünüz gibi her sayfa için her şeyi yüklemezsiniz. 

İyi yapılan JavaScript kurulumları güzel bir şeydir. İyi yapılmayan JavaScript kurulumları şişirilebilir ve uzun yükleme sürelerine neden olabilir.

Check out bizim Önemli Web Verileri kılavuzu Web sitesi performansı hakkında daha fazla bilgi için.

JavaScript siteleri daha fazla tarama bütçesi kullanıyor 

JavaScript XHR istekleri yenir tarama bütçesive demek istediğim onu ​​silip süpürüyorlar. Önbelleğe alınan diğer kaynakların çoğundan farklı olarak bunlar, oluşturma işlemi sırasında canlı olarak getirilir.

Bir diğer ilgi çekici detay ise rendering hizmetinin sayfa içeriğine katkıda bulunmayan kaynakları getirmemeye çalışmasıdır. Eğer bu yanlışsa, bazı içerikleri kaçırıyor olabilirsiniz.

İşçiler desteklenmiyor mu yoksa destekleniyor mu?

Google geçmişte hizmet çalışanlarını reddettiğini ve hizmet çalışanlarının DOM'u düzenleyemediğini söylese de, Google'ın kendi çalışanı Martin Splitt bazen web çalışanlarını kullanmanın yanına kâr kalabileceğini belirtti.

Bu ilginç bir durum. Bu çok basit değil: Görünüşe göre web çalışanları destekleniyor ANCAK görüntü oluşturma, ertelenen çalışmayı beklemiyor gibi görünüyor. (örneğin setTimeout). Yani işinizi hemen planladığınız sürece sorun olmaz. 1/2

— Martin Splitt (@g33konaut) 30 Mayıs 2019

HTTP bağlantılarını kullan

Googlebot, HTTP isteklerini destekler ancak aşağıdakiler gibi diğer bağlantı türlerini desteklemez: WebSockets or WebRTC. Bunları kullanıyorsanız HTTP bağlantılarını kullanan bir yedek sağlayın.

JavaScript sitelerinin bir "başarısı", DOM'un kısmi güncellemelerini yapabilmeleridir. Kullanıcı olarak başka bir sayfaya göz atmak, DOM'daki başlık etiketleri veya kanonik etiketler gibi bazı özellikleri güncellemeyebilir, ancak bu, arama motorları için bir sorun olmayabilir.

Google, her sayfayı yeni bir yükmüş gibi durum bilgisi olmadan yükler. Önceki bilgileri kaydetmemek ve sayfalar arasında gezinmemek.

SEO'ların, bir sayfadan diğerine gittikten sonra gördükleri (güncellenmeyen kanonik etiket gibi) nedeniyle bir sorun olduğunu düşünerek takılıp kaldıklarını gördüm. Ancak Google bu durumu hiçbir zaman göremeyebilir.

Devs, durumu güncelleme adı verilen şeyi kullanarak güncelleyerek bunu düzeltebilir. Geçmiş API'si. Ancak yine de sorun olmayabilir. Çoğu zaman SEO'lar geliştiricilere sorun çıkarıyor çünkü onlara tuhaf geliyor. Sayfayı yenileyin ve ne gördüğünüzü görün. Veya daha da iyisi, ne gördüğünü görmek için onu Google'ın test araçlarından birinde çalıştırın.

Test araçlarından bahsetmişken, biraz da bunlardan bahsedelim.

Google test araçları

Google'ın JavaScript için yararlı olan çeşitli test araçları vardır.

Google Search Console'daki URL Denetleme aracı

Bu sizin gerçeğinizin kaynağı olmalıdır. Bir URL'yi incelediğinizde, Google'ın gördükleri ve sisteminde oluşturulan gerçek HTML hakkında birçok bilgi alırsınız.

Ayrıca canlı test yapma seçeneğiniz de var. 

Ana oluşturucu ile canlı test arasında bazı farklılıklar vardır. Oluşturucu önbelleğe alınmış kaynakları kullanır ve oldukça sabırlıdır. Canlı test ve diğer test araçları canlı kaynakları kullanır ve bir sonuç beklediğiniz için oluşturmayı erkenden keserler. Bu konuyu daha sonra render bölümünde daha ayrıntılı olarak ele alacağım.

Bu araçlardaki ekran görüntüleri aynı zamanda piksellerin boyalı olduğu sayfaları da gösterir; Google bunu aslında bir sayfayı oluştururken yapmaz.

Araçlar, içeriğin DOM yüklü olup olmadığını görmek için kullanışlıdır. Bu araçlarda gösterilen HTML, işlenmiş DOM'dur. Varsayılan olarak yüklenip yüklenmediğini görmek için bir metin parçasını arayabilirsiniz.

Araçlar ayrıca size engellenebilecek kaynakları ve hata ayıklama için yararlı olan konsol hata mesajlarını da gösterecektir.

Bir web sitesinin Google Search Console özelliğine erişiminiz yoksa yine de üzerinde canlı bir test çalıştırabilirsiniz. Google Arama Konsolu erişiminizin olduğu bir mülkteki kendi web sitenize bir yönlendirme eklerseniz, bu URL'yi inceleyebilirsiniz; inceleme aracı yönlendirmeyi takip edecek ve diğer alandaki sayfanın canlı test sonucunu size gösterecektir. 

Aşağıdaki ekran görüntüsünde sitemden Google'ın ana sayfasına bir yönlendirme ekledim. Bunun için canlı test, yönlendirmeyi takip ediyor ve bana Google'ın ana sayfasını gösteriyor. Keşke olsa da aslında Google'ın Google Search Console hesabına erişimim yok.

Zengin Sonuçlar Test aracı

The Zengin Sonuçlar Test aracı oluşturulan sayfanızı Googlebot'un mobil veya masaüstü cihazlarda göreceği şekilde kontrol etmenize olanak tanır.

Mobil Uyumluluk Testi aracı

hala kullanabilirsiniz Mobil Uyumlu Test aracı şimdilik, ancak Google Aralık 2023'te kapatılacağını duyurdu.

Google'ın diğer test araçlarıyla aynı tuhaflıklara sahiptir.

Ahrefs

Ahrefs tek büyük SEO aracıdır. web'de gezinirken web sayfalarını işler, yani JavaScript sitelerinden başka hiçbir aracın sahip olmadığı verilere sahibiz. Günde yaklaşık 200 milyon sayfa oluşturuyoruz ancak bu, taradığımız sayfanın çok küçük bir kısmı.

JavaScript yönlendirmelerini kontrol etmemizi sağlar. Bağlantı raporlarında JS etiketiyle gösterdiğimiz, JavaScript ile eklenmiş olarak bulduğumuz bağlantıları da gösterebiliriz:

Sayfalar için açılır menüde Site Explorer, bir sayfanın geçmişini görmenize ve onu diğer taramalarla karşılaştırmanıza olanak tanıyan bir inceleme seçeneğimiz de vardır. JavaScript etkinken oluşturulan sayfalar için orada bir JS işaretçimiz var.

JavaScript'i şurada etkinleştirebilirsiniz: Site Denetimi denetimlerinizde daha fazla verinin kilidini açmak için tarama yapar.

JavaScript oluşturmayı etkinleştirdiyseniz, her sayfa için ham ve işlenmiş HTML'yi sağlayacağız. Sayfa Gezgini'nde bir sayfanın yanındaki "büyüteç" seçeneğini kullanın ve menüde "Kaynağı görüntüle"ye gidin. Ayrıca sitedeki tüm sayfalarda önceki taramalarla karşılaştırma yapabilir ve ham veya işlenmiş HTML içinde arama yapabilirsiniz.

JavaScript olmadan bir tarama çalıştırırsanız ve ardından onunla başka bir tarama çalıştırırsanız, sürümler arasındaki farkları görmek için tarama karşılaştırma özelliklerimizi kullanabilirsiniz.

Ahrefs' SEO Araç Çubuğu ayrıca JavaScript'i destekler ve HTML'yi etiketlerin oluşturulmuş sürümleriyle karşılaştırmanıza olanak tanır.

Kaynağı görüntüleme ve inceleme

Bir tarayıcı penceresine sağ tıkladığınızda, sayfanın kaynak kodunu görüntülemek ve sayfayı incelemek için birkaç seçenek göreceksiniz. Kaynağı görüntüle, size bir GET isteğinin gösterdiğinin aynısını gösterecektir. Bu, sayfanın ham HTML'sidir.

Inspect, değişiklikler yapıldıktan sonra işlenen DOM'yi size gösterir ve Googlebot'un gördüğü içeriğe daha yakındır. JavaScript çalıştırıldıktan ve üzerinde değişiklik yapıldıktan sonraki sayfadır.

JavaScript ile çalışırken çoğunlukla görünüm kaynağı üzerinden incelemeyi kullanmalısınız.

Bazen görüntüleme kaynağını kontrol etmeniz gerekir

Google bazı sorunlar için hem ham hem de işlenmiş HTML'ye baktığından, yine de zaman zaman görüntüleme kaynağını kontrol etmeniz gerekebilir. Örneğin, Google'ın araçları size sayfanın noindex olarak işaretlendiğini söylüyorsa ancak oluşturulan HTML'de bir noindex etiketi görmüyorsanız, bunun ham HTML'de mevcut olması ve üzerine yazılmış olması mümkündür.

Noindex, nofollow ve canonical etiketler gibi şeylerde sorunlar devam edebileceğinden ham HTML'yi kontrol etmeniz gerekebilir. Google'ın meta robot etiketleri için gördüğü en kısıtlayıcı ifadeleri alacağını ve ona birden fazla kanonik etiket gösterdiğinizde kanonik etiketleri göz ardı edeceğini unutmayın.

JavaScript kapalıyken göz atmayın

Bunun tavsiye edildiğini pek çok kez gördüm. Google, JavaScript'i işler, dolayısıyla JavaScript olmadan gördükleriniz Google'ın gördüklerine hiç benzemez. Bu çok saçma.

Google Önbelleğini kullanmayın

Google'ın önbelleği, Googlebot'un ne gördüğünü kontrol etmenin güvenilir bir yolu değildir. Önbellekte genellikle gördüğünüz şey ham HTML anlık görüntüsüdür. Tarayıcınız daha sonra HTML'de başvurulan JavaScript'i başlatır. Google'ın sayfayı oluşturduğunda gördüğü şey bu değil.

Bunu daha da karmaşık hale getirmek için web sitelerinin kendi Kaynaklar Arası Kaynak Paylaşımı (CORS) politika, gerekli kaynakların farklı bir etki alanından yüklenemeyeceği şekilde ayarlanmıştır.

Önbellek webcache.googleusercontent.com adresinde barındırılmaktadır. Bu etki alanı, gerçek etki alanından kaynak istemeye çalıştığında CORS politikası "Hayır, dosyalarıma erişemezsiniz" diyor. Daha sonra dosyalar yüklenmez ve sayfa önbellekte bozuk görünür.

Önbellek sistemi, bir web sitesi kapalı olduğunda içeriğin görülebilmesi için yapılmıştır. Bir hata ayıklama aracı olarak özellikle kullanışlı değildir.

Arama motorlarının ilk günlerinde, indirilen bir HTML yanıtı çoğu sayfanın içeriğini görmek için yeterliydi. JavaScript'in yükselişi sayesinde arama motorlarının, içeriği kullanıcının gördüğü gibi görebilmesi için artık birçok sayfayı tarayıcı gibi görüntülemesi gerekiyor.

Google'da görüntüleme işlemini yürüten sisteme Web Rendering Service (WRS) adı verilmektedir. Google, bu sürecin nasıl çalıştığını açıklayan basit bir şema sağlamıştır.

İşleme URL’den başladığımızı varsayalım.

1. Paletli

Tarayıcı, sunucuya GET istekleri gönderir. Sunucu, başlıklarla ve dosyanın içeriğiyle yanıt verir ve bu dosya daha sonra kaydedilir. Başlıklar ve içerik genellikle aynı istekle gelir.

Google ison'dan bu yana isteğin bir mobil kullanıcı aracısından gelmesi muhtemeldir mobil ilk indeksleme şimdi, ancak aynı zamanda masaüstü kullanıcı aracısıyla da taramaya devam ediyor. 

İstekler çoğunlukla Mountain View'dan (CA, ABD) geliyor, ancak aynı zamanda yerel ayarlara uygun sayfalar için biraz tarama ABD dışında Daha önce de belirttiğim gibi, sitelerin belirli bir ülkedeki ziyaretçileri engellemesi veya ziyaretçilere farklı şekillerde davranması sorunlara neden olabilir.

Google, yukarıdaki resimde tarama işleminin çıktısını "HTML" olarak belirtirken gerçekte sayfayı oluşturmak için gereken HTML, JavaScript dosyaları ve CSS dosyaları gibi kaynakları tarıyor ve saklıyor olduğunu da unutmamak gerekir. Ayrıca HTML dosyaları için maksimum 15 MB boyut sınırı vardır.

2. İşleme

Görüntüde "İşleniyor" terimi nedeniyle karartılan birçok sistem var. Bunlardan JavaScript ile alakalı birkaçını ele alacağım.

Kaynaklar ve bağlantılar

Google, bir kullanıcının yaptığı gibi sayfadan sayfaya gitmez. "İşleme"nin bir kısmı, sayfayı oluşturmak için gereken diğer sayfalara ve dosyalara bağlantılar açısından sayfayı kontrol etmektir. Bu bağlantılar çıkarılır ve Google'ın taramayı önceliklendirmek ve planlamak için kullandığı tarama kuyruğuna eklenir.

Google, bir sayfa oluşturmak için gereken kaynak bağlantılarını (CSS, JS vb.) aşağıdaki gibi şeylerden alacaktır: <link> etiketleri.

Daha önce bahsettiğim gibi, iç bağlantılar JavaScript ile eklenenler, oluşturma işlemi bitene kadar alınmayacaktır. Bu nispeten hızlı olmalı ve çoğu durumda endişe kaynağı olmamalıdır. Haber siteleri gibi şeyler her saniyenin önemli olduğu istisnalar olabilir.

önbelleğe alma

HTML sayfaları, JavaScript dosyaları, CSS dosyaları vb. dahil Google'ın indirdiği her dosya agresif bir şekilde önbelleğe alınacaktır. Google, önbellek zamanlamalarınızı göz ardı edecek ve istediği zaman yeni bir kopya alacaktır. Bu konu hakkında ve bunun neden önemli olduğu hakkında biraz daha "Renderer" bölümünde konuşacağım.

Tekrarlanan eleme

Yinelenen içerik, oluşturulma işlemine gönderilmeden önce indirilen HTML'den çıkarılabilir veya öncelikleri kaldırılabilir. Yukarıdaki “Yinelenen içerik” bölümünde bundan bahsetmiştim.

En kısıtlayıcı direktifler

Daha önce de belirttiğim gibi Google en kısıtlayıcı olanı seçecektir. ifadeleri HTML ile bir sayfanın işlenmiş sürümü arasında. JavaScript bir ifadeyi değiştirirse ve bu, HTML'deki ifadeyle çelişirse, Google hangisi en kısıtlayıcıysa ona uyacaktır. Noindex, dizini geçersiz kılacak ve HTML'deki noindex, oluşturmayı tamamen atlayacaktır.

3. İşleme kuyruğu

JavaScript ve iki aşamalı indeksleme (HTML daha sonra oluşturulan sayfa) kullanan birçok SEO uzmanının en büyük endişelerinden biri, sayfaların günlerce, hatta haftalarca oluşturulamamasıdır. Google bunu araştırdığında şunu buldu: sayfalar ortalama beş saniyelik bir sürede oluşturucuya gittive 90'ıncı yüzdelik dilim dakikaydı. Bu nedenle, HTML'nin alınması ile sayfaların oluşturulması arasındaki süre çoğu durumda endişe verici olmamalıdır.

Ancak Google tüm sayfaları oluşturmaz. Daha önce de belirttiğim gibi, robots meta etiketi veya noindex etiketi içeren başlığı olan bir sayfa oluşturucuya gönderilmeyecektir. Zaten dizine ekleyemeyeceği bir sayfayı görüntüleyerek kaynakları israf etmez.

Bu süreçte kalite kontrolleri de vardır. HTML'ye bakarsa veya diğer sinyallerden veya kalıplardan bir sayfanın dizine eklenecek kadar kaliteli olmadığını makul bir şekilde belirleyebilirse, bunu oluşturucuya gönderme zahmetine girmez.

Haber sitelerinde de bir tuhaflık var. Google, haber sitelerindeki sayfaları hızlı bir şekilde dizine eklemek istiyor, böylece sayfaları önce HTML içeriğine göre dizine ekleyebilir ve daha sonra bu sayfaları oluşturmak için geri gelebilir.

4. Oluşturucu

Oluşturucu, Google'ın kullanıcının ne gördüğünü görmek için bir sayfayı oluşturduğu yerdir. Burası JavaScript'i ve JavaScript tarafından yapılan değişiklikleri işleyeceği yerdir. KARAR.

Bunun için Google, artık "her zaman yeşil" olan başsız bir Chrome tarayıcısı kullanıyor; bu, en son Chrome sürümünü kullanması ve en yeni özellikleri desteklemesi gerektiği anlamına geliyor. Yıllar önce Google, Chrome 41 ile görüntü oluşturuyordu ve o dönemde pek çok özellik desteklenmiyordu.

Google'da daha fazlası var WRS hakkında bilgi, izinlerin reddedilmesi, durum bilgisinin olmaması, hafif DOM ve gölge DOM'un düzleştirilmesi gibi şeyleri ve okumaya değer daha fazlasını içerir.

Web ölçeğinde görüntü oluşturmak dünyanın sekizinci harikası olabilir. Bu ciddi bir girişimdir ve muazzam miktarda kaynak gerektirir. Ölçek nedeniyle Google, işleri hızlandırmak için oluşturma sürecinde birçok kısayol kullanıyor.

Önbelleğe alınmış kaynaklar

Google büyük ölçüde kaynakları önbelleğe almaya güveniyor. Sayfalar önbelleğe alınır. Dosyalar önbelleğe alınır. Oluşturucuya gönderilmeden önce neredeyse her şey önbelleğe alınır. Her sayfa yüklemesinde her kaynağın indirilmesi söz konusu değil, çünkü bu kendisi ve web sitesi sahipleri için pahalı olacaktır. Bunun yerine, daha verimli olmak için önbelleğe alınmış bu kaynakları kullanır.

Bunun istisnası, oluşturucunun gerçek zamanlı olarak yapacağı XHR istekleridir.

Beş saniyelik zaman aşımı yok

Yaygın bir SEO efsanesi, Google'ın sayfanızı yüklemek için yalnızca beş saniye beklemesidir. Sitenizi daha hızlı hale getirmek her zaman iyi bir fikir olsa da, bu efsane, Google'ın yukarıda bahsedilen dosyaları önbelleğe alma şekliyle pek mantıklı gelmiyor. Halihazırda her şeyin sistemlerinde önbelleğe alındığı bir sayfayı yüklüyor, yeni kaynaklar için talepte bulunmuyor.

Yalnızca beş saniye bekleseydi pek çok içeriği kaçırırdı.

Bu efsane muhtemelen, kaynakların önbelleğe alınmak yerine canlı olarak getirildiği ve makul bir süre içinde kullanıcılara bir sonuç döndürmesi gereken URL Denetleme aracı gibi test araçlarından kaynaklanıyor. Ayrıca sayfaların taranmasında öncelik verilmemesinden de kaynaklanabilir, bu da insanların onları oluşturmak ve dizine eklemek için uzun süre beklediklerini düşünmelerine neden olur.

Oluşturucu için sabit bir zaman aşımı yoktur. Daha sonra herhangi bir şey eklenip eklenmediğini görmek için hızlandırılmış bir zamanlayıcıyla çalışır. Ayrıca tüm eylemlerin ne zaman gerçekleştirildiğini görmek için tarayıcıdaki olay döngüsüne de bakar. Gerçekten sabırlıdır ve belirli bir zaman sınırı konusunda endişelenmemelisiniz.

Sabırlıdır, ancak aynı zamanda bir şeylerin takılıp kalması veya birisinin sayfalarında Bitcoin madenciliği yapmaya çalışması durumunda da güvenlik önlemleri vardır. Evet, bu bir şey. Bitcoin madenciliği için de koruma önlemleri eklemek zorunda kaldık ve hatta bir çalışma yayınladı bu konuda.

Googlebot'un gördükleri

Googlebot web sayfalarında işlem yapmaz. Bir şeylere tıklamayacak veya kaydırma yapmayacak, ancak bu, geçici çözümlerinin olmadığı anlamına gelmez. İçerik gerekli bir işlem yapılmadan DOM'a yüklendiği sürece Google onu görecektir. Bir tıklamaya kadar DOM'a yüklenmezse içerik bulunamaz.

Google'ın içeriğinizi görmek için kaydırma yapmasına da gerek yoktur çünkü içeriği görmek için akıllı bir geçici çözüm vardır. Mobil cihazlar için sayfayı 411×731 piksel ekran boyutunda yükler ve uzunluğu 12,140 piksele yeniden boyutlandırır. 

Esasen 411×12140 piksel ekran boyutuyla gerçekten uzun bir telefon oluyor. Masaüstü için de aynısını yapar ve 1024×768 pikselden 1024×9307 piksele çıkar. Bu sayılar için yakın zamanda herhangi bir test görmedim ve sayfaların uzunluğuna bağlı olarak değişebilir.

Bir başka ilginç kısayol da Google'ın oluşturma işlemi sırasında pikselleri boyamamasıdır. Bir sayfanın yüklenmesini tamamlamak zaman alır ve ek kaynaklar gerektirir ve piksellerin boyalı olduğu son durumu görmeye gerçekten gerek yoktur. Ayrıca grafik kartları oyun, kripto madenciliği ve yapay zeka arasında pahalıdır.

Google'ın yalnızca yapıyı ve düzeni bilmesi gerekiyor ve bunu pikselleri gerçekten boyamaya gerek kalmadan elde ediyor. Gibi kırlangıç şunu koyuyor:

Google aramada pikselleri pek umursamıyoruz çünkü onu gerçekten birine göstermek istemiyoruz. Bilgiyi ve anlamsal bilgiyi işlemek istiyoruz, dolayısıyla ara durumdaki bir şeye ihtiyacımız var. Aslında pikselleri boyamamıza gerek yok.

Bir görsel neyin kesildiğini biraz daha iyi açıklamaya yardımcı olabilir. Chrome Geliştirici Araçları'nda "Performans" sekmesinde bir test çalıştırırsanız bir yükleme grafiği elde edersiniz. Buradaki düz yeşil kısım boyama aşamasını temsil ediyor. Googlebot için bu asla gerçekleşmez, dolayısıyla kaynaklardan tasarruf sağlar.

Gri = İndirilenler
Mavi = HTML
Sarı = JavaScript
Mor = Düzen
Yeşil = Boyama

5. Tarama kuyruğu

Google'ın tarama bütçesinden biraz bahseden bir kaynağı var. Ancak her sitenin kendi tarama bütçesi olduğunu ve her isteğin önceliklendirilmesi gerektiğini bilmelisiniz. Google'ın ayrıca sayfalarınızın taranması ile internetteki diğer sayfaların taranması arasında denge kurması gerekir.

Genel olarak daha yeni siteler veya çok sayıda dinamik sayfaya sahip siteler büyük olasılıkla daha yavaş taranacaktır. Bazı sayfalar diğerlerinden daha az güncellenecektir ve bazı kaynaklar da daha az sıklıkta talep edilebilir.

JavaScript oluşturmaya gelince birçok seçenek var. Google'ın şimdi göstereceğim sağlam bir grafiği var. Her türlü SSR, statik oluşturma ve önceden oluşturma kurulumu, arama motorları için uygun olacaktır. Gatsby, Next, Nuxt vb. hepsi harika.

En sorunlu olanı, tüm işlemenin tarayıcıda gerçekleştiği tam istemci tarafı işleme olacaktır. Her ne kadar Google muhtemelen istemci tarafı oluşturmada sorun yaşamasa da diğerlerini desteklemek için farklı bir oluşturma seçeneği seçmek en iyisidir. arama motorları.

Bing'de de var JavaScript oluşturma desteğiAncak ölçeği bilinmiyor. Gördüğüm kadarıyla Yandex ve Baidu'nun desteği sınırlı ve diğer birçok arama motorunun JavaScript desteği çok az veya hiç yok. Kendi arama motorumuz, Evet, desteği var ve günde ~200 milyon sayfa oluşturuyoruz. Ancak taradığımız her sayfayı oluşturmuyoruz.

seçeneği de var dinamik oluşturma, belirli kullanıcı aracıları için görüntüleniyor. Bu bir geçici çözüm ve dürüst olmak gerekirse bunu hiçbir zaman tavsiye etmedim ve Google'ın artık buna karşı tavsiyede bulunmasına da sevindim.

Duruma göre, bunu arama motorları ve hatta sosyal medya botları gibi belirli botlar için oluşturmak için kullanmak isteyebilirsiniz. Sosyal medya botları JavaScript'i çalıştırmaz, dolayısıyla şöyle şeyler OG etiketleri İçeriği onlara sunmadan önce oluşturmadığınız sürece görülmez.

Pratik olarak, kurulumları daha karmaşık hale getirir ve SEO'ların sorun gidermesini zorlaştırır. Kesinlikle gizleme, Google bunun böyle olmadığını ve sorun olmayacağını söylese de.

Nihai düşünceler

JavaScript SEO uzmanlarının korkacağı bir şey değildir. Umarım bu makale onunla nasıl daha iyi çalışacağınızı anlamanıza yardımcı olmuştur. 

Geliştiricilerinize ulaşmaktan, onlarla çalışmaktan ve onlara sorular sormaktan korkmayın. Arama motorları için JavaScript sitenizi geliştirmeye yardımcı olma konusunda en büyük müttefikleriniz olacaklar.

Sorularım var? Bana bildirin Twitter'da.

• SEO Destekli İçerik ve Halkla İlişkiler Dağıtımı. Bugün Gücünüzü Artırın.
• PlatoData.Network Dikey Üretken Yapay Zeka. Kendine güç ver. Buradan Erişin.
• PlatoAiStream. Web3 Zekası. Bilgi Genişletildi. Buradan Erişin.
• PlatoESG. karbon, temiz teknoloji, Enerji, Çevre, Güneş, Atık Yönetimi. Buradan Erişin.
• PlatoSağlık. Biyoteknoloji ve Klinik Araştırmalar Zekası. Buradan Erişin.
• Kaynak: https://ahrefs.com/blog/javascript-seo/