Bilgisayar programlama dili JavaScript, başka bir dil olan Java ile karıştırılmamalıdır. JavaScript, dünyanın en hızlı büyüyen dillerinden biridir.

JavaScript (JS) başlangıçta HTML web sayfalarının Java web uygulamaları ile etkileşime girmesini sağlamak amacıyla oluşturuldu.

JS o zamandan beri çoğunlukla sayfaları daha dinamik hale getirmek için animasyonlar ve efektler eklemek için kullanıldı. Bu, temel yapıyı ayarladığınız ve ardından sayfanın nasıl görünmesi gerektiğini tasarladığınız mevcut HTML ve CSS dillerinden doğal olarak farklıdır.

Bu kapsamlı JavaScript SEO kılavuzu, geliştiricileri ve SEO uzmanlarını JavaScript’i etkili bir şekilde kullanma bilgisiyle donatmayı amaçlamaktadır.

JavaScript’in Avantajları ve Dezavantajları

JavaScript’in Avantajları

• Tüm modern tarayıcılarda desteklenir.
• Kullanıcı dostu, son derece etkileşimli web siteleri oluşturmaya izin verir.
• JavaScript kodu satır satır yorumlandığı için hata ayıklaması ve test etmesi nispeten kolaydır.
• Hem ön uç hem de arka uç geliştiriciler tarafından kullanılabilir.

JavaScript’in Dezavantajları

• Google, JavaScript’te oluşturulan açılış sayfalarını potansiyel olarak oluşturamıyor ve dizine ekleyemiyor.
• JavaScript’in bir sayfada oluşturulmasını zorunlu kılmak, iki temel alanı olumsuz etkileyebilir:

1. Site hızı
2. Arama motoru tarama ve dizine ekleme

Bununla birlikte, kullandığınız oluşturma yöntemine bağlı olarak, sayfa yükleme hızını azaltabilir ve içeriğin tarama ve dizine ekleme için arama motorları tarafından erişilebilir olduğundan emin olabilirsiniz.

JavaScript, sayfaların hızlı bir şekilde yüklenmesini sağlar, zengin bir arayüz sunar ve uygulaması kolaydır; ancak, tarayıcı akışkanlığı kullanıcı etkileşimine göre değişir ve arama motorlarının sayfayı anlamasını ve içerikle bir değer ilişkilendirmesini zorlaştırır.

JavaScript içeriği taşıyan web sayfalarını işlerken arama motorlarının kendi sınırlamaları vardır. Google, sayfanın ilk taramasını gerçekleştirir ve bulduklarını dizine ekler. Kaynaklar mevcut olduğunda, botlar bu sayfalarda JS’yi oluşturmaya geri döner. Bu, JavaScript’e dayanan içerik ve bağlantıların arama motorları tarafından görülmeme riski taşıdığı ve potansiyel olarak sitenin SEO’suna zarar verebileceği anlamına gelir.

JavaScript Oluşturma

Oluşturma, bir sayfayı ve görsel düzen şablonlarını ve bileşenlerini doldurmak için ilgili verileri getirmeye ve ardından bir web tarayıcısının görüntüleyebileceği HTML oluşturmak için bunları birleştirmeye odaklanır. Burada iki temel kavramı tanıtmamız gerekiyor; sunucu tarafında işleme ve istemci tarafında işleme. JavaScript web sitelerini yöneten her SEO’nun ikisi arasındaki farkı tanıması çok önemlidir.

Yerleşik yaklaşım, sunucu tarafı işleme, sayfayı tam olarak açıklayan HTML’yi alan bir tarayıcı veya bir arama motoru botunu (tarayıcı) içerir. Dolayısıyla tarayıcınız veya arama motoru botunuz, sayfanın nasıl tasarlandığını göstermek için ekli varlıkları (CSS, resimler, vb.) indirmelidir. Bu geleneksel yaklaşım olduğundan, arama motorlarının genellikle sunucu tarafında oluşturulan içerikle ilgili bir sorunu yoktur. Geleneksel olarak bu şekilde işleyen web siteleri PHP, ASP veya Ruby’de programlanır ve Kentico, WordPress veya Magento gibi popüler içerik yönetim sistemlerini kullanmış olabilir.

Bununla birlikte, daha modernize edilmiş istemci tarafı oluşturma yaklaşımı çok farklıdır. Birçok arama motoru botunun, birincil yüklemenin bir sonucu olarak, çok az içeriğe sahip boş bir HTML sayfasını bota geri yansıtması nedeniyle bu yolla mücadele ettiği belirtilmiştir. Dahil edilen JavaScript kodu daha sonra sunucuya bir istek gönderir ve geri aldığı verileri sayfayı oluşturmak ve oluşturmak için kullanır.

DOM ile JavaScript Oluşturma

JavaScript oluşturma, sayfanın Belge Nesne Modeli (DOM) yeterince yüklendiğinde çalışır. Daha fazla açıklamak gerekirse DOM, dinamik olarak oluşturulan sayfanın temelidir. Standart HTML sayfaları, değiştirilmedikleri yerlerde statiktir, dinamik sayfalar ise değiştirme yeteneğine sahip olan ve anında oluşturulabilen sayfalardır.
Daha önce belirtildiği gibi JavaScript ve kaynaklar, JavaScript çalıştırmanın daha sonra gerçekleştirileceği bir sayfayı oluşturmak için hayati öneme sahiptir. JavaScript daha sonra DOM içinde değişiklikler yapar ve belirli web sayfasının HTML kodunu sunar. Seçilen arama motoru botu, oluşturulan HTML kodunun anlık görüntüsünü almadan önce genellikle yaklaşık üç saniye bekler.

JavaScript Oluşturma Googlebot ile Nasıl Çalışır?

Googlebot, JavaScript’i üç ana aşamada işler, bunlar:

1. Emekleme
2. Rendering
3. Endeksleme

Google’ın şemasında gösterildiği gibi, Googlebot, sayfaları tarama ve oluşturma işlemleri için bir sıraya yerleştirir. Googlebot tarama sırasından bir URL alır ve URL’ye izin verilip verilmediğini görmek için robots.txt dosyasını okur.
Googlebot buradan sonra HTML yanıtını diğer URL’ye ayrıştırır ve tarama kuyruğuna ekler. Googlebot’un kaynakları izin verdiğinde, bir Chromium sayfayı işler ve JavaScript’i çalıştırır. Oluşturulan HTML daha sonra sayfayı dizine eklemek için kullanılır.

Google iki ayrı indeksleme dalgası yürüttüğü için, indeksleme işlemi sırasında bazı detayların gözden kaçması mümkündür. Örneğin, sunucu tarafında önemli başlık etiketlerini ve meta açıklamaları oluşturmuyorsanız, Google bunu ikinci yoldan gözden kaçırabilir ve SERP’lerdeki organik görünürlüğünüz üzerinde olumsuz etkileri olabilir.

Tarama ve Dizine Ekleme Arasındaki Fark Nedir?

Tarama ve indeksleme, SEO endüstrisinde karıştırılabilecek iki farklı şeydir. Tarama, Googlebot gibi bir arama motoru botuyla ilişkilendirilir, bir web sayfasındaki tüm içeriği veya kodu keşfeder ve analiz eder. Öte yandan indeksleme, sayfanın Arama Motoru Sonuçları Sayfasında (SERP’ler) görünme olasılığının yüksek olduğu anlamına gelir.

Tarama ve indekslemede botların iyileştirilmesine rağmen, JavaScript bu süreci çok daha az verimli ve daha pahalı hale getiriyor. JavaScript’in yerleşik içeriği ve bağlantıları, tarayıcıların tüm web sayfalarını oluşturması için muazzam bir çaba gerektirir. Bu arama motorları JavaScript tarafından oluşturulan sayfaları tarayacak ve dizine ekleyecektir, ancak tarayıcı ve dizinleyici arasında gidip gelme nedeniyle bu muhtemelen statik bir sayfadan daha uzun sürer. Googlebot’un HTML ve CSS dosyalarından bağlantıları indirip çıkararak sayfayı dizine eklemesine izin vermenin aksine, JavaScript fazladan bir adım oluşturur. JavaScript oluşturma süreci bir bütün olarak çok daha karmaşıktır.

JavaScript Destekli Web Siteleri İçin SEO Püf Noktaları

İç Bağlantı

Dahili bağlantı web yöneticilerinin en önemli önceliklerinden biri olduğu için, kullanıcıların site genelinde web sayfasından sayfaya geçiş yapmasına olanak sağlamak için JavaScript onclick etkinlikleri gibi JavaScript işlevlerinden yararlanmanın aksine HTML veya DOM içinde normal bağlantı etiketleri kullanılmalıdır. Dahili bağlantı, tam web sitesi mimarisi ve sayfaların genel önemi ile ilgili olarak arama motorlarına güçlü bir sinyal olarak kabul edilir.

İçerik Erişilebilirliği

İçeriğin hem kullanıcı hem de arama motoru botları için net olması için, içeriğin yükleme etkinliği içinde dizine eklenebilir olması, dizine eklenebilir bir URL gerektirmesi ve JavaScript sitelerini oluşturmak için HTML için en iyi SEO uygulamalarını kullanması gerekir. Sadece bu değil, aynı zamanda temel SEO uygulamaları ile uyumlu olduğu için, bir web sitesindeki her içerik parçası, web sitesinin kendisinden ve internetteki diğer kaynaklardan benzersiz olmalıdır.

Elde Edilebilirlik

Arama motorlarının, web sayfalarına erişebilen ancak kullanıcıyı göstermeyen ve web sayfasının içeriğini arka uçta çalışan başka bir programa aktaran bir yazılım türü olan başsız taramayı uyguladığı bildirildi. Başsız bir tarayıcı, kullanıcının deneyimini ve sayfadaki içerik durumlarını daha iyi anlamak için DOM’u oluşturmaya yardımcı olur.
Bununla birlikte, JavaScript’in nasıl çalıştırıldığını ve arama motorları botlarıyla nasıl etkileşime girdiğini anlamak önemlidir, aksi takdirde çok büyük organik sonuçlar doğurur.

Rendering

JavaScript, bir web sayfasının genel olarak oluşturulmasını etkileyebilir. Bu nedenle, oluşturmayı engelleyen bir şey varsa, bu, sayfanın yüklenmesini geciktirebilir. Genel bir kural olarak, Google, bir web sitesinde içerik katının üst kısmının yüklenmesini engelleyen herhangi bir JavaScript’i tamamen kaldırmanızı veya en azından ertelemenizi önerir.

Ekranın üst kısmı, web sayfasının sayfa ilk yüklendiğinde görünen kısmını ifade eder. Sayfanın sonraki bölümü kaydırma gerektiren “ekranın alt kısmı” olarak adlandırılır.

Tek Sayfa Uygulama Hususları

Tek sayfalık bir uygulama (SPA), öncelikle web üzerinde verimli bir şekilde çalışmak üzere tasarlanmış ve oluşturulmuş bir web uygulaması / web sitesidir. Sunucudan bir sayfanın tamamını yüklemenin aksine, bu sayfalar dinamik olarak yeniden yazılır ve ihtiyaç duyduğunuz parçalarla yüklenir.

SPA yaklaşımı, hızlı bir yükleme süresi sağlar, daha az bant genişliği kullanır ve uygulamanın daha çok bir masaüstü uygulaması gibi davranmasını sağlayarak kullanıcıya keyifli bir deneyim sunar. Uygulamanın kullanımına bağlı olarak birçok farklı SPA çerçeve seçeneğinin mevcut olduğu unutulmamalıdır. Bunlar arasında; React.js, Angular.js, Backbone.js, Preact, Next.js vb sayılabilir.

Google, SPA’daki içeriği taramaya ve dizine eklemeye çalıştığında birçok engel olabilir. Bu nedenle, SPA kullanıyorsanız, Google’ın neleri alabildiğini anlamak için “Getirme” komutunu kullanarak birçok kez test etmeniz önerilir.

JavaScript SEO Araçları: JavaScript’inizi Kontrol Edin

JavaScript’in sahip olduğu sonsuz yeteneklerle, JavaScript koduyla ilgili sorunları değerlendirmek ve düzeltmek için çok sayıda yardımcı araç mevcuttur. İşte bir SEO olarak yararlı bulacağınız birkaç tanesi:

URL İnceleme Aracı

“Google Arama Konsolu”nda bulunan “URL İnceleme Aracı”, Google’ın bir sayfayı tarayıp / dizine ekleyip ekleyemediğine, herhangi bir hatanın oluşup oluşmadığına ve neden olduğuna ilişkin bilgileri gösterir.

DeepCrawl

DeepCrawl, bir web sitesinin tüm farklı sayfalarında, Google’ın yapacağı aynı modelde JavaScript’i taramak ve oluşturmak için kullanılabilir. Bu akıllı araç, oluşturmayı kitlesel ölçekte etkili bir şekilde test etmenize ve izlemenize olanak tanır ve bunun karşılığında JavaScript’in arama motorları botları tarafından taranıp dizine eklenip eklenemeyeceğini anlamanıza yardımcı olur.

Mobil Uyumluluk Testi

Google’ın mobil uyumluluk testçisi, bir ziyaretçinin bir mobil cihaz üzerinden web sitenizde gezinmesinin ne kadar kolay / zor olduğu hakkında bilgi sağlar.

Sayfa Hızı Bilgileri

Google’ın sayfa hızı analiz aracı (PSI), mobil ve masaüstü cihazların performansını etkili bir şekilde ayrıntılarıyla açıklar. Buna ek olarak, bu araç, bunun nasıl geliştirilebileceğine dair öneriler de sağlar.

Site: Komut

Site: Command, Google’ın içeriğinizi doğru bir şekilde dizine ekleyip dizine eklemediğini görmenize yardımcı olan en doğrudan araçlardan biridir. Bunu yapmak için Google’da şu komutu tamamlayabilirsiniz – site: [web sitenizin URL’si] “metin içeriği veya sorgu”

Fark Denetleyici

Diffchecker, iki tür metin dosyasını karşılaştırmanıza ve her ikisi arasındaki farkları gözden geçirmenize olanak tanıyan benzersiz bir araçtır. Bu, özellikle web sayfalarının orijinal kaynak kodunun işlenen koda göre analizini gerçekleştirmek için kullanışlıdır. Bu araç, içeriğin oluşturulduktan sonra nasıl değiştiğine dair kapsamlı karşılaştırmalar sunar.

Chrome Geliştirme Araçları

Chrome DevTools, deneyimli web geliştiricilerinin doğrudan Google’ın Chrome tarayıcısına eklemeler yapabilecekleri bir dizi araçtır. Chrome DevTools, bir metin düzenleyici kullanmanıza gerek kalmadan düzenlemenize ve hızlı stil değişiklikleri yapmanıza yardımcı olabilir.

5 Saniyelik Zaman Aşımı

Google resmi olarak belirtilmemiş olsa da, Google’ın 5 saniyeden fazla beklememesi gerektiği biliniyor. Bu nedenle, yükleme olayındaki herhangi bir içerik (yaklaşık 5 saniye) dizine eklenebilir.

Dizine Eklenebilir URL’ler

Sayfalar, her açılış sayfası için sunucu tarafı desteği sunan dizine eklenebilir URL’ler gerektirir. Bu, her kategoriyi, alt kategoriyi ve ürün sayfasını içerir.

Tarayıcınızın “İnceleme” Özelliğini Kullanma

Oluşturulan HTML elde edildiğinde ve Google’ın beklediği geleneksel bir açılış sayfası düzeyini karşıladığında, birçok etkileyen faktör kendi kendine çözülecektir.

Oluşturulan HTML ve genel JavaScript ögelerini incelemek için, Google Chrome’un “İnceleme Ögesi”, web sayfası hakkında kullanıcıların görünümünden gizlenen daha fazla bilgiyi keşfetmelerine yardımcı olmak için kullanılabilir. Bir web sayfasıyla etkileşimde bulunurken kullanıcı davranışı gibi gizli JavaScript dosyalarını keşfetmek için, bu bilgiyi “İnceleme Öge”sinin “Kaynaklar” sekmesinden elde edebilirsiniz.

İnceleme ögesinde içeriğinizin tamamını göremiyorsanız, tarayıcı içinde oluşturmak için istemci tarafı oluşturma olarak bilinen JavaScript kullanıyor olma olasılığınız yüksektir.

GSC’de URL İnceleme Aracı

URL inceleme aracı, Google’ın onu nasıl görüntülediğinin tam durumunu anlamak için web sitenizdeki belirli bir URL’yi analiz etmenize olanak tanır. URL inceleme aracı, tarama, dizine ekleme ve sorunlara neden olan yapılandırılmış veri hataları gibi Google’ın dizininden daha fazla bilgi sağlar.

Sayfa Yükleme Hızını Artırın

Google, sayfa hızının, karmaşık algoritmaları tarafından sayfaları sıralamak için kullanılan sinyallerden biri olduğunu ve daha hızlı bir sayfa hızının, arama motoru botlarının bir sitenin genel endekslenmesine yardımcı olan sayfa sayısını artırmasına izin verdiğini belirtti. JavaScript açısından, web sayfasını kullanıcılar için daha etkileşimli ve dinamik hale getirmek, sayfa hızıyla ilgili bazı maliyetler getirebilir. Bunu azaltmak için, genellikle ekranın üst kısmında tamamen gerekli olmayan belirli bileşenler için geç yüklemenin kullanılması önerilebilir.

Sayfa İçi SEO Çabalarınızda Israrcı Olun

Arama motorlarında sıralanmalarına yardımcı olmak için sayfanızı optimize etmeye giden tüm sayfa içi SEO kuralları hala geçerlidir. Başlık etiketlerinizi, meta açıklamalarınızı, resimlerdeki alt özniteliklerinizi ve meta robot etiketlerinizi optimize edin. Benzersiz ve açıklayıcı başlıklar ve meta açıklamalar, kullanıcıların ve arama motorlarının içeriği kolayca tanımlamasına yardımcı olur. Anlamsal olarak alakalı anahtar kelimelerin arama amacına ve stratejik yerleşimine dikkat edin.

Ayrıca, SEO dostu bir URL yapısına sahip olmak da iyidir. Birkaç durumda, web siteleri URL’de bir pushState değişikliği uygular ve Google’ın standart olanı bulmaya çalışırken kafasını karıştırır. Bu tür sorunlar için URL’leri kontrol ettiğinizden emin olun.

JavaScript’inizin DOM Ağacında Göründüğünden Emin Olun

JavaScript oluşturma, bir sayfanın DOM’u yeterince yüklendiğinde çalışır. DOM veya Belge Nesne Modeli, sayfa içeriğinin yapısını ve her bir ögenin diğeriyle ilişkisini gösterir. Bunu, tarayıcının sayfa kodundaki “İnceleme Ögesi” içinde bulabilirsiniz. DOM, dinamik olarak oluşturulan sayfanın temelidir.

İçeriğiniz DOM’da görülebiliyorsa, içeriğiniz büyük olasılıkla Google tarafından ayrıştırılıyor demektir. DOM’u kontrol etmek, sayfalarınıza arama motoru botları tarafından erişilip erişilmediğini belirlemenize yardımcı olacaktır.

Arama Motorlarının JS İçeriğine Erişimini Engellemekten Kaçının

Google’ın JavaScript içeriğini bulamaması sorununu önlemek için, birkaç web yöneticisi JS içeriğini kullanıcılara sunan ancak tarayıcılardan gizleyen “Gizleme” adı verilen bir işlem kullanır. Ancak, bu yöntem Google’ın Web Yöneticisi Yönergelerinin ihlali olarak kabul edilir ve bu nedenle cezalandırılabilirsiniz. Bunun yerine, temel sorunları belirlemeye ve JS içeriğini arama motorları için erişilebilir hale getirmeye çalışın.

İlgili HTTP Durum Kodlarını Kullanın

Google’ın tarayıcıları, bir sayfayı tararken sorunları tanımlamak için HTTP durum kodlarını kullanır. Bu nedenle, botlara bir sayfanın taranmaması veya dizine eklenmemesi gerektiğini bildirmek için anlamlı bir durum kodu kullanmalısınız. Örneğin, botlara bir sayfanın yeni bir URL’ye taşındığını söylemek için 301 HTTP durumunu kullanabilir ve Google’ın dizinini buna göre güncellemesine izin verebilirsiniz.

Yinelenen İçeriği Düzeltin

JavaScript web siteleri için kullanıldığında, aynı içerik için farklı URL’ler olabilir. Bu tür sayfaları bulduğunuzda, dizine eklenmesini istediğiniz orijinal / tercih edilen URL’yi seçtiğinizden ve arama motorlarının kafasının karışmasını önlemek için kanonik etiketler ayarladığınızdan emin olun.

Geç Yüklenen İçeriği ve Görüntüleri Düzeltin

SEO için site hızı çok önemlidir. Geç yükleme, kritik olmayan veya görünür olmayan içeriğin yüklenmesini geciktiren ve böylece ilk sayfa yükleme süresini azaltan bu tür bir kullanıcı deneyimi en iyi uygulamasıdır. Ancak sayfaların daha hızlı yüklenmesini sağlamanın yanı sıra, içeriğinizin arama motoru tarayıcıları tarafından erişilebilir olmasını sağlamanız gerekir. Bu tarayıcılar, SEO’nuzu olumsuz yönde etkileyerek, JavaScript’inizi çalıştırmaz.

Dahası, görsel aramaları ayrıca ek organik trafik kaynağıdır. Dolayısıyla, geç yüklenen görselleriniz varsa, arama motorları bunları seçmeyecektir.

JavaScript’i Erteleme ve Asenkron

JavaScript <head></head> kodları arasına dizilir ve kodlar yukarıdan aşağıya doğru çalıştırılır. Eğer JavaScript komut dosyanıda çok sayıda kod varsa web sitenizin açılması da bir o kadar uzun sürecektir. Ama bazı önemsiz adımları erteleyerek JS’nin onları ayrıştırmasını engelleyebilir ve site hızınızı artırabilirsiniz.

async/await Komutu: async / await komutları tüm programlama dillerinde bulunur. async komutu bir fonksiyona ya da metoda “asenkron” yani ana dizin akışından bağımsız çalışabilme yeteneği kazandırır. async fonksiyonları kod dizilimini takip etmeyeceği için akışa paralel çalışabilirler. Bu aşamada da metodu await komutu ile bekletebilirsiniz. async ve await eşzamansız da denilen asenkron kodları yazmak için thread’den daha yeni modern bir yoldur.

defer Komutu: Defer etiketi JavaScript dosyalarını sayfada en son açar. Bu komut sayfanın çalışma hızında artış sağlar.

preload Komutu: Preload komutu ile sitenize yüklediğiniz görsellerin diğer içeriklerden daha sonra görüntülenmesini sağlayabilirsiniz. Bu da site hızını artırmanın bir yoludur.

JavaScript İçin SEO’da Kaçınmanız Gereken Hatalar

Web sitenizde JavaScript kullanıyorsanız, Google artık yükleme olayından sonra ögeleri oldukça iyi bir şekilde oluşturabilir ve nihayet anlık görüntüyü geleneksel bir HTML sitesi gibi okuyabilir ve dizine ekleyebilir.

JavaScript ve SEO ile ilgili çoğu sorun yanlış uygulamadan kaynaklanmaktadır. Bu nedenle, birçok yaygın SEO en iyi uygulaması JavaScript SEO için de kullanılabilir. Bunlar, meydana gelebilecek en yaygın hatalardan birkaçıdır:

1. Dizine Eklenebilir URL’ler: Her web sitesi, sitelerin tamamen dizine eklenebilmesi için benzersiz ve ayırt edici URL’ler gerektirir. Ancak JavaScript ile oluşturulduğu gibi bir pushState, bir URL oluşturmaz. Bu nedenle, JavaScript siteniz, bir istemciye veya bot sorgusuna sunucu yanıtı olarak 200 OK durum kodu verebilen kendi web belgesini de gerektirir. JS ile sunulan her ürün (veya JS ile gerçekleştirilen web sitenizin her kategorisi) bu nedenle sitenizin dizine eklenebilmesi için bir sunucu tarafı URL’si ile donatılmalıdır.

2. PushState Hataları: PushState yöntemi ile JavaScript URL’leri değiştirilebilir. Bu nedenle, orijinal URL’nin sunucu tarafı desteği ile aktarıldığından kesinlikle emin olmalısınız. Aksi takdirde, yinelenen içerik riskiyle karşılaşırsınız.

3. Eksik Meta Veriler: JavaScript kullanımıyla, birçok web yöneticisi veya SEO temel bilgileri unutur ve meta verileri bota aktarmaz. Bununla birlikte, JavaScript içeriği için HTML siteleriyle aynı SEO standartları geçerlidir. Bu nedenle, görseller için alt etiketlerinin başlığı ve meta açıklamasını mutlaka kullanın.

4. href ve img: Googlebot, daha fazla site bulabilmesi için izleyebileceği bağlantılara ihtiyaç duyar. Bu nedenle, JS belgelerinizde href veya src özniteliklerine sahip bağlantılar da sağlamalısınız.

5. Birleşik Sürümler Oluşturun: JavaScript’in oluşturulmasıyla preDOM ve postDOM sürümleri ortaya çıkar. Mümkünse, hiçbir çelişkinin girmediğinden ve örneğin, kanonik etiketlerin veya sayfalandırmaların doğru şekilde yorumlanabildiğinden emin olun. Bu şekilde gizlemeden kurtulursunuz.

6. Tüm Botlar İçin Erişim Oluşturun: Tüm botlar, Googlebot gibi JavaScript ile başa çıkamaz. Bu nedenle, HTML koduna başlık, meta bilgi ve sosyal etiket yerleştirmeniz önerilir.

7. robots.txt Üzerinden JS’yi Devre Dışı Bırakmayın: JavaScript’inizin Googlebot tarafından da taranabildiğinden emin olun. Bunun için dizinler robots.txt dosyasında hariç tutulmamalıdır.

8. Geçerli Bir Site Haritası Kullanın: Google’a JavaScript içeriğindeki olası değişiklikleri göstermek için, XML site haritanızda “lastmod” özniteliğini her zaman güncel tutmalısınız.

5 Saniyelik Zaman Aşımı

Google resmi olarak belirtilmemiş olsa da, Google’ın 5 saniyeden fazla beklememesi gerektiği biliniyor. Bu nedenle, yükleme olayındaki herhangi bir içerik (yaklaşık 5 saniye) dizine eklenebilir.

Dizine Eklenebilir URL’ler

Sayfalar, her açılış sayfası için sunucu tarafı desteği sunan dizine eklenebilir URL’ler gerektirir. Bu, her kategoriyi, alt kategoriyi ve ürün sayfasını içerir.

Tarayıcınızın “İnceleme” Özelliğini Kullanma

Oluşturulan HTML elde edildiğinde ve Google’ın beklediği geleneksel bir açılış sayfası düzeyini karşıladığında, birçok etkileyen faktör kendi kendine çözülecektir.

Oluşturulan HTML ve genel JavaScript ögelerini incelemek için, Google Chrome’un “İnceleme Ögesi”, web sayfası hakkında kullanıcıların görünümünden gizlenen daha fazla bilgiyi keşfetmelerine yardımcı olmak için kullanılabilir. Bir web sayfasıyla etkileşimde bulunurken kullanıcı davranışı gibi gizli JavaScript dosyalarını keşfetmek için, bu bilgiyi “İnceleme Öge”sinin “Kaynaklar” sekmesinden elde edebilirsiniz.

İnceleme ögesinde içeriğinizin tamamını göremiyorsanız, tarayıcı içinde oluşturmak için istemci tarafı oluşturma olarak bilinen JavaScript kullanıyor olma olasılığınız yüksektir.

GSC’de URL İnceleme Aracı

URL inceleme aracı, Google’ın onu nasıl görüntülediğinin tam durumunu anlamak için web sitenizdeki belirli bir URL’yi analiz etmenize olanak tanır. URL inceleme aracı, tarama, dizine ekleme ve sorunlara neden olan yapılandırılmış veri hataları gibi Google’ın dizininden daha fazla bilgi sağlar.

Sayfa Yükleme Hızını Artırın

Google, sayfa hızının, karmaşık algoritmaları tarafından sayfaları sıralamak için kullanılan sinyallerden biri olduğunu ve daha hızlı bir sayfa hızının, arama motoru botlarının bir sitenin genel endekslenmesine yardımcı olan sayfa sayısını artırmasına izin verdiğini belirtti. JavaScript açısından, web sayfasını kullanıcılar için daha etkileşimli ve dinamik hale getirmek, sayfa hızıyla ilgili bazı maliyetler getirebilir. Bunu azaltmak için, genellikle ekranın üst kısmında tamamen gerekli olmayan belirli bileşenler için geç yüklemenin kullanılması önerilebilir.

Sayfa İçi SEO Çabalarınızda Israrcı Olun

Arama motorlarında sıralanmalarına yardımcı olmak için sayfanızı optimize etmeye giden tüm sayfa içi SEO kuralları hala geçerlidir. Başlık etiketlerinizi, meta açıklamalarınızı, resimlerdeki alt özniteliklerinizi ve meta robot etiketlerinizi optimize edin. Benzersiz ve açıklayıcı başlıklar ve meta açıklamalar, kullanıcıların ve arama motorlarının içeriği kolayca tanımlamasına yardımcı olur. Anlamsal olarak alakalı anahtar kelimelerin arama amacına ve stratejik yerleşimine dikkat edin.

Ayrıca, SEO dostu bir URL yapısına sahip olmak da iyidir. Birkaç durumda, web siteleri URL’de bir pushState değişikliği uygular ve Google’ın standart olanı bulmaya çalışırken kafasını karıştırır. Bu tür sorunlar için URL’leri kontrol ettiğinizden emin olun.

JavaScript’inizin DOM Ağacında Göründüğünden Emin Olun

JavaScript oluşturma, bir sayfanın DOM’u yeterince yüklendiğinde çalışır. DOM veya Belge Nesne Modeli, sayfa içeriğinin yapısını ve her bir ögenin diğeriyle ilişkisini gösterir. Bunu, tarayıcının sayfa kodundaki “İnceleme Ögesi” içinde bulabilirsiniz. DOM, dinamik olarak oluşturulan sayfanın temelidir.

İçeriğiniz DOM’da görülebiliyorsa, içeriğiniz büyük olasılıkla Google tarafından ayrıştırılıyor demektir. DOM’u kontrol etmek, sayfalarınıza arama motoru botları tarafından erişilip erişilmediğini belirlemenize yardımcı olacaktır.

Arama Motorlarının JS İçeriğine Erişimini Engellemekten Kaçının

Google’ın JavaScript içeriğini bulamaması sorununu önlemek için, birkaç web yöneticisi JS içeriğini kullanıcılara sunan ancak tarayıcılardan gizleyen “Gizleme” adı verilen bir işlem kullanır. Ancak, bu yöntem Google’ın Web Yöneticisi Yönergelerinin ihlali olarak kabul edilir ve bu nedenle cezalandırılabilirsiniz. Bunun yerine, temel sorunları belirlemeye ve JS içeriğini arama motorları için erişilebilir hale getirmeye çalışın.

İlgili HTTP Durum Kodlarını Kullanın

Google’ın tarayıcıları, bir sayfayı tararken sorunları tanımlamak için HTTP durum kodlarını kullanır. Bu nedenle, botlara bir sayfanın taranmaması veya dizine eklenmemesi gerektiğini bildirmek için anlamlı bir durum kodu kullanmalısınız. Örneğin, botlara bir sayfanın yeni bir URL’ye taşındığını söylemek için 301 HTTP durumunu kullanabilir ve Google’ın dizinini buna göre güncellemesine izin verebilirsiniz.

Yinelenen İçeriği Düzeltin

JavaScript web siteleri için kullanıldığında, aynı içerik için farklı URL’ler olabilir. Bu tür sayfaları bulduğunuzda, dizine eklenmesini istediğiniz orijinal / tercih edilen URL’yi seçtiğinizden ve arama motorlarının kafasının karışmasını önlemek için kanonik etiketler ayarladığınızdan emin olun.

Geç Yüklenen İçeriği ve Görüntüleri Düzeltin

SEO için site hızı çok önemlidir. Geç yükleme, kritik olmayan veya görünür olmayan içeriğin yüklenmesini geciktiren ve böylece ilk sayfa yükleme süresini azaltan bu tür bir kullanıcı deneyimi en iyi uygulamasıdır. Ancak sayfaların daha hızlı yüklenmesini sağlamanın yanı sıra, içeriğinizin arama motoru tarayıcıları tarafından erişilebilir olmasını sağlamanız gerekir. Bu tarayıcılar, SEO’nuzu olumsuz yönde etkileyerek, JavaScript’inizi çalıştırmaz.

Dahası, görsel aramaları ayrıca ek organik trafik kaynağıdır. Dolayısıyla, geç yüklenen görselleriniz varsa, arama motorları bunları seçmeyecektir.

JavaScript’i Erteleme ve Asenkron

JavaScript <head></head> kodları arasına dizilir ve kodlar yukarıdan aşağıya doğru çalıştırılır. Eğer JavaScript komut dosyanıda çok sayıda kod varsa web sitenizin açılması da bir o kadar uzun sürecektir. Ama bazı önemsiz adımları erteleyerek JS’nin onları ayrıştırmasını engelleyebilir ve site hızınızı artırabilirsiniz.

async/await Komutu: async / await komutları tüm programlama dillerinde bulunur. async komutu bir fonksiyona ya da metoda “asenkron” yani ana dizin akışından bağımsız çalışabilme yeteneği kazandırır. async fonksiyonları kod dizilimini takip etmeyeceği için akışa paralel çalışabilirler. Bu aşamada da metodu await komutu ile bekletebilirsiniz. async ve await eşzamansız da denilen asenkron kodları yazmak için thread’den daha yeni modern bir yoldur.

defer Komutu: Defer etiketi JavaScript dosyalarını sayfada en son açar. Bu komut sayfanın çalışma hızında artış sağlar.

preload Komutu: Preload komutu ile sitenize yüklediğiniz görsellerin diğer içeriklerden daha sonra görüntülenmesini sağlayabilirsiniz. Bu da site hızını artırmanın bir yoludur.

JavaScript İçin SEO’da Kaçınmanız Gereken Hatalar

Web sitenizde JavaScript kullanıyorsanız, Google artık yükleme olayından sonra ögeleri oldukça iyi bir şekilde oluşturabilir ve nihayet anlık görüntüyü geleneksel bir HTML sitesi gibi okuyabilir ve dizine ekleyebilir.

JavaScript ve SEO ile ilgili çoğu sorun yanlış uygulamadan kaynaklanmaktadır. Bu nedenle, birçok yaygın SEO en iyi uygulaması JavaScript SEO için de kullanılabilir. Bunlar, meydana gelebilecek en yaygın hatalardan birkaçıdır:

1. Dizine Eklenebilir URL’ler: Her web sitesi, sitelerin tamamen dizine eklenebilmesi için benzersiz ve ayırt edici URL’ler gerektirir. Ancak JavaScript ile oluşturulduğu gibi bir pushState, bir URL oluşturmaz. Bu nedenle, JavaScript siteniz, bir istemciye veya bot sorgusuna sunucu yanıtı olarak 200 OK durum kodu verebilen kendi web belgesini de gerektirir. JS ile sunulan her ürün (veya JS ile gerçekleştirilen web sitenizin her kategorisi) bu nedenle sitenizin dizine eklenebilmesi için bir sunucu tarafı URL’si ile donatılmalıdır.

2. PushState Hataları: PushState yöntemi ile JavaScript URL’leri değiştirilebilir. Bu nedenle, orijinal URL’nin sunucu tarafı desteği ile aktarıldığından kesinlikle emin olmalısınız. Aksi takdirde, yinelenen içerik riskiyle karşılaşırsınız.

3. Eksik Meta Veriler: JavaScript kullanımıyla, birçok web yöneticisi veya SEO temel bilgileri unutur ve meta verileri bota aktarmaz. Bununla birlikte, JavaScript içeriği için HTML siteleriyle aynı SEO standartları geçerlidir. Bu nedenle, görseller için alt etiketlerinin başlığı ve meta açıklamasını mutlaka kullanın.

4. href ve img: Googlebot, daha fazla site bulabilmesi için izleyebileceği bağlantılara ihtiyaç duyar. Bu nedenle, JS belgelerinizde href veya src özniteliklerine sahip bağlantılar da sağlamalısınız.

5. Birleşik Sürümler Oluşturun: JavaScript’in oluşturulmasıyla preDOM ve postDOM sürümleri ortaya çıkar. Mümkünse, hiçbir çelişkinin girmediğinden ve örneğin, kanonik etiketlerin veya sayfalandırmaların doğru şekilde yorumlanabildiğinden emin olun. Bu şekilde gizlemeden kurtulursunuz.

6. Tüm Botlar İçin Erişim Oluşturun: Tüm botlar, Googlebot gibi JavaScript ile başa çıkamaz. Bu nedenle, HTML koduna başlık, meta bilgi ve sosyal etiket yerleştirmeniz önerilir.

7. robots.txt Üzerinden JS’yi Devre Dışı Bırakmayın: JavaScript’inizin Googlebot tarafından da taranabildiğinden emin olun. Bunun için dizinler robots.txt dosyasında hariç tutulmamalıdır.

8. Geçerli Bir Site Haritası Kullanın: Google’a JavaScript içeriğindeki olası değişiklikleri göstermek için, XML site haritanızda “lastmod” özniteliğini her zaman güncel tutmalısınız.

Bilgisayar programlama dili JavaScript, başka bir dil olan Java ile karıştırılmamalıdır. JavaScript, dünyanın en hızlı büyüyen dillerinden biridir.

JavaScript (JS) başlangıçta HTML web sayfalarının Java web uygulamaları ile etkileşime girmesini sağlamak amacıyla oluşturuldu.

JS o zamandan beri çoğunlukla sayfaları daha dinamik hale getirmek için animasyonlar ve efektler eklemek için kullanıldı. Bu, temel yapıyı ayarladığınız ve ardından sayfanın nasıl görünmesi gerektiğini tasarladığınız mevcut HTML ve CSS dillerinden doğal olarak farklıdır.

Bu kapsamlı JavaScript SEO kılavuzu, geliştiricileri ve SEO uzmanlarını JavaScript’i etkili bir şekilde kullanma bilgisiyle donatmayı amaçlamaktadır.

JavaScript’in Avantajları ve Dezavantajları

JavaScript’in Avantajları

• Tüm modern tarayıcılarda desteklenir.
• Kullanıcı dostu, son derece etkileşimli web siteleri oluşturmaya izin verir.
• JavaScript kodu satır satır yorumlandığı için hata ayıklaması ve test etmesi nispeten kolaydır.
• Hem ön uç hem de arka uç geliştiriciler tarafından kullanılabilir.

JavaScript’in Dezavantajları

• Google, JavaScript’te oluşturulan açılış sayfalarını potansiyel olarak oluşturamıyor ve dizine ekleyemiyor.
• JavaScript’in bir sayfada oluşturulmasını zorunlu kılmak, iki temel alanı olumsuz etkileyebilir:

1. Site hızı
2. Arama motoru tarama ve dizine ekleme

Bununla birlikte, kullandığınız oluşturma yöntemine bağlı olarak, sayfa yükleme hızını azaltabilir ve içeriğin tarama ve dizine ekleme için arama motorları tarafından erişilebilir olduğundan emin olabilirsiniz.

JavaScript, sayfaların hızlı bir şekilde yüklenmesini sağlar, zengin bir arayüz sunar ve uygulaması kolaydır; ancak, tarayıcı akışkanlığı kullanıcı etkileşimine göre değişir ve arama motorlarının sayfayı anlamasını ve içerikle bir değer ilişkilendirmesini zorlaştırır.

JavaScript içeriği taşıyan web sayfalarını işlerken arama motorlarının kendi sınırlamaları vardır. Google, sayfanın ilk taramasını gerçekleştirir ve bulduklarını dizine ekler. Kaynaklar mevcut olduğunda, botlar bu sayfalarda JS’yi oluşturmaya geri döner. Bu, JavaScript’e dayanan içerik ve bağlantıların arama motorları tarafından görülmeme riski taşıdığı ve potansiyel olarak sitenin SEO’suna zarar verebileceği anlamına gelir.

JavaScript Oluşturma

Oluşturma, bir sayfayı ve görsel düzen şablonlarını ve bileşenlerini doldurmak için ilgili verileri getirmeye ve ardından bir web tarayıcısının görüntüleyebileceği HTML oluşturmak için bunları birleştirmeye odaklanır. Burada iki temel kavramı tanıtmamız gerekiyor; sunucu tarafında işleme ve istemci tarafında işleme. JavaScript web sitelerini yöneten her SEO’nun ikisi arasındaki farkı tanıması çok önemlidir.

Yerleşik yaklaşım, sunucu tarafı işleme, sayfayı tam olarak açıklayan HTML’yi alan bir tarayıcı veya bir arama motoru botunu (tarayıcı) içerir. Dolayısıyla tarayıcınız veya arama motoru botunuz, sayfanın nasıl tasarlandığını göstermek için ekli varlıkları (CSS, resimler, vb.) indirmelidir. Bu geleneksel yaklaşım olduğundan, arama motorlarının genellikle sunucu tarafında oluşturulan içerikle ilgili bir sorunu yoktur. Geleneksel olarak bu şekilde işleyen web siteleri PHP, ASP veya Ruby’de programlanır ve Kentico, WordPress veya Magento gibi popüler içerik yönetim sistemlerini kullanmış olabilir.

Bununla birlikte, daha modernize edilmiş istemci tarafı oluşturma yaklaşımı çok farklıdır. Birçok arama motoru botunun, birincil yüklemenin bir sonucu olarak, çok az içeriğe sahip boş bir HTML sayfasını bota geri yansıtması nedeniyle bu yolla mücadele ettiği belirtilmiştir. Dahil edilen JavaScript kodu daha sonra sunucuya bir istek gönderir ve geri aldığı verileri sayfayı oluşturmak ve oluşturmak için kullanır.

DOM ile JavaScript Oluşturma

JavaScript oluşturma, sayfanın Belge Nesne Modeli (DOM) yeterince yüklendiğinde çalışır. Daha fazla açıklamak gerekirse DOM, dinamik olarak oluşturulan sayfanın temelidir. Standart HTML sayfaları, değiştirilmedikleri yerlerde statiktir, dinamik sayfalar ise değiştirme yeteneğine sahip olan ve anında oluşturulabilen sayfalardır.
Daha önce belirtildiği gibi JavaScript ve kaynaklar, JavaScript çalıştırmanın daha sonra gerçekleştirileceği bir sayfayı oluşturmak için hayati öneme sahiptir. JavaScript daha sonra DOM içinde değişiklikler yapar ve belirli web sayfasının HTML kodunu sunar. Seçilen arama motoru botu, oluşturulan HTML kodunun anlık görüntüsünü almadan önce genellikle yaklaşık üç saniye bekler.

JavaScript Oluşturma Googlebot ile Nasıl Çalışır?

Googlebot, JavaScript’i üç ana aşamada işler, bunlar:

1. Emekleme
2. Rendering
3. Endeksleme

Google’ın şemasında gösterildiği gibi, Googlebot, sayfaları tarama ve oluşturma işlemleri için bir sıraya yerleştirir. Googlebot tarama sırasından bir URL alır ve URL’ye izin verilip verilmediğini görmek için robots.txt dosyasını okur.
Googlebot buradan sonra HTML yanıtını diğer URL’ye ayrıştırır ve tarama kuyruğuna ekler. Googlebot’un kaynakları izin verdiğinde, bir Chromium sayfayı işler ve JavaScript’i çalıştırır. Oluşturulan HTML daha sonra sayfayı dizine eklemek için kullanılır.

Google iki ayrı indeksleme dalgası yürüttüğü için, indeksleme işlemi sırasında bazı detayların gözden kaçması mümkündür. Örneğin, sunucu tarafında önemli başlık etiketlerini ve meta açıklamaları oluşturmuyorsanız, Google bunu ikinci yoldan gözden kaçırabilir ve SERP’lerdeki organik görünürlüğünüz üzerinde olumsuz etkileri olabilir.

Tarama ve Dizine Ekleme Arasındaki Fark Nedir?

Tarama ve indeksleme, SEO endüstrisinde karıştırılabilecek iki farklı şeydir. Tarama, Googlebot gibi bir arama motoru botuyla ilişkilendirilir, bir web sayfasındaki tüm içeriği veya kodu keşfeder ve analiz eder. Öte yandan indeksleme, sayfanın Arama Motoru Sonuçları Sayfasında (SERP’ler) görünme olasılığının yüksek olduğu anlamına gelir.

Tarama ve indekslemede botların iyileştirilmesine rağmen, JavaScript bu süreci çok daha az verimli ve daha pahalı hale getiriyor. JavaScript’in yerleşik içeriği ve bağlantıları, tarayıcıların tüm web sayfalarını oluşturması için muazzam bir çaba gerektirir. Bu arama motorları JavaScript tarafından oluşturulan sayfaları tarayacak ve dizine ekleyecektir, ancak tarayıcı ve dizinleyici arasında gidip gelme nedeniyle bu muhtemelen statik bir sayfadan daha uzun sürer. Googlebot’un HTML ve CSS dosyalarından bağlantıları indirip çıkararak sayfayı dizine eklemesine izin vermenin aksine, JavaScript fazladan bir adım oluşturur. JavaScript oluşturma süreci bir bütün olarak çok daha karmaşıktır.

JavaScript Destekli Web Siteleri İçin SEO Püf Noktaları

İç Bağlantı

Dahili bağlantı web yöneticilerinin en önemli önceliklerinden biri olduğu için, kullanıcıların site genelinde web sayfasından sayfaya geçiş yapmasına olanak sağlamak için JavaScript onclick etkinlikleri gibi JavaScript işlevlerinden yararlanmanın aksine HTML veya DOM içinde normal bağlantı etiketleri kullanılmalıdır. Dahili bağlantı, tam web sitesi mimarisi ve sayfaların genel önemi ile ilgili olarak arama motorlarına güçlü bir sinyal olarak kabul edilir.

İçerik Erişilebilirliği

İçeriğin hem kullanıcı hem de arama motoru botları için net olması için, içeriğin yükleme etkinliği içinde dizine eklenebilir olması, dizine eklenebilir bir URL gerektirmesi ve JavaScript sitelerini oluşturmak için HTML için en iyi SEO uygulamalarını kullanması gerekir. Sadece bu değil, aynı zamanda temel SEO uygulamaları ile uyumlu olduğu için, bir web sitesindeki her içerik parçası, web sitesinin kendisinden ve internetteki diğer kaynaklardan benzersiz olmalıdır.

Elde Edilebilirlik

Arama motorlarının, web sayfalarına erişebilen ancak kullanıcıyı göstermeyen ve web sayfasının içeriğini arka uçta çalışan başka bir programa aktaran bir yazılım türü olan başsız taramayı uyguladığı bildirildi. Başsız bir tarayıcı, kullanıcının deneyimini ve sayfadaki içerik durumlarını daha iyi anlamak için DOM’u oluşturmaya yardımcı olur.
Bununla birlikte, JavaScript’in nasıl çalıştırıldığını ve arama motorları botlarıyla nasıl etkileşime girdiğini anlamak önemlidir, aksi takdirde çok büyük organik sonuçlar doğurur.

Rendering

JavaScript, bir web sayfasının genel olarak oluşturulmasını etkileyebilir. Bu nedenle, oluşturmayı engelleyen bir şey varsa, bu, sayfanın yüklenmesini geciktirebilir. Genel bir kural olarak, Google, bir web sitesinde içerik katının üst kısmının yüklenmesini engelleyen herhangi bir JavaScript’i tamamen kaldırmanızı veya en azından ertelemenizi önerir.

Ekranın üst kısmı, web sayfasının sayfa ilk yüklendiğinde görünen kısmını ifade eder. Sayfanın sonraki bölümü kaydırma gerektiren “ekranın alt kısmı” olarak adlandırılır.

Tek Sayfa Uygulama Hususları

Tek sayfalık bir uygulama (SPA), öncelikle web üzerinde verimli bir şekilde çalışmak üzere tasarlanmış ve oluşturulmuş bir web uygulaması / web sitesidir. Sunucudan bir sayfanın tamamını yüklemenin aksine, bu sayfalar dinamik olarak yeniden yazılır ve ihtiyaç duyduğunuz parçalarla yüklenir.

SPA yaklaşımı, hızlı bir yükleme süresi sağlar, daha az bant genişliği kullanır ve uygulamanın daha çok bir masaüstü uygulaması gibi davranmasını sağlayarak kullanıcıya keyifli bir deneyim sunar. Uygulamanın kullanımına bağlı olarak birçok farklı SPA çerçeve seçeneğinin mevcut olduğu unutulmamalıdır. Bunlar arasında; React.js, Angular.js, Backbone.js, Preact, Next.js vb sayılabilir.

Google, SPA’daki içeriği taramaya ve dizine eklemeye çalıştığında birçok engel olabilir. Bu nedenle, SPA kullanıyorsanız, Google’ın neleri alabildiğini anlamak için “Getirme” komutunu kullanarak birçok kez test etmeniz önerilir.

JavaScript SEO Araçları: JavaScript’inizi Kontrol Edin

JavaScript’in sahip olduğu sonsuz yeteneklerle, JavaScript koduyla ilgili sorunları değerlendirmek ve düzeltmek için çok sayıda yardımcı araç mevcuttur. İşte bir SEO olarak yararlı bulacağınız birkaç tanesi:

URL İnceleme Aracı

“Google Arama Konsolu”nda bulunan “URL İnceleme Aracı”, Google’ın bir sayfayı tarayıp / dizine ekleyip ekleyemediğine, herhangi bir hatanın oluşup oluşmadığına ve neden olduğuna ilişkin bilgileri gösterir.

DeepCrawl

DeepCrawl, bir web sitesinin tüm farklı sayfalarında, Google’ın yapacağı aynı modelde JavaScript’i taramak ve oluşturmak için kullanılabilir. Bu akıllı araç, oluşturmayı kitlesel ölçekte etkili bir şekilde test etmenize ve izlemenize olanak tanır ve bunun karşılığında JavaScript’in arama motorları botları tarafından taranıp dizine eklenip eklenemeyeceğini anlamanıza yardımcı olur.

Mobil Uyumluluk Testi

Google’ın mobil uyumluluk testçisi, bir ziyaretçinin bir mobil cihaz üzerinden web sitenizde gezinmesinin ne kadar kolay / zor olduğu hakkında bilgi sağlar.

Sayfa Hızı Bilgileri

Google’ın sayfa hızı analiz aracı (PSI), mobil ve masaüstü cihazların performansını etkili bir şekilde ayrıntılarıyla açıklar. Buna ek olarak, bu araç, bunun nasıl geliştirilebileceğine dair öneriler de sağlar.

Site: Komut

Site: Command, Google’ın içeriğinizi doğru bir şekilde dizine ekleyip dizine eklemediğini görmenize yardımcı olan en doğrudan araçlardan biridir. Bunu yapmak için Google’da şu komutu tamamlayabilirsiniz – site: [web sitenizin URL’si] “metin içeriği veya sorgu”

Fark Denetleyici

Diffchecker, iki tür metin dosyasını karşılaştırmanıza ve her ikisi arasındaki farkları gözden geçirmenize olanak tanıyan benzersiz bir araçtır. Bu, özellikle web sayfalarının orijinal kaynak kodunun işlenen koda göre analizini gerçekleştirmek için kullanışlıdır. Bu araç, içeriğin oluşturulduktan sonra nasıl değiştiğine dair kapsamlı karşılaştırmalar sunar.

Chrome Geliştirme Araçları

Chrome DevTools, deneyimli web geliştiricilerinin doğrudan Google’ın Chrome tarayıcısına eklemeler yapabilecekleri bir dizi araçtır. Chrome DevTools, bir metin düzenleyici kullanmanıza gerek kalmadan düzenlemenize ve hızlı stil değişiklikleri yapmanıza yardımcı olabilir.

Bilgisayar programlama dili JavaScript, başka bir dil olan Java ile karıştırılmamalıdır. JavaScript, dünyanın en hızlı büyüyen dillerinden biridir.

JavaScript (JS) başlangıçta HTML web sayfalarının Java web uygulamaları ile etkileşime girmesini sağlamak amacıyla oluşturuldu.

JS o zamandan beri çoğunlukla sayfaları daha dinamik hale getirmek için animasyonlar ve efektler eklemek için kullanıldı. Bu, temel yapıyı ayarladığınız ve ardından sayfanın nasıl görünmesi gerektiğini tasarladığınız mevcut HTML ve CSS dillerinden doğal olarak farklıdır.

Bu kapsamlı JavaScript SEO kılavuzu, geliştiricileri ve SEO uzmanlarını JavaScript’i etkili bir şekilde kullanma bilgisiyle donatmayı amaçlamaktadır.

JavaScript’in Avantajları ve Dezavantajları

JavaScript’in Avantajları

• Tüm modern tarayıcılarda desteklenir.
• Kullanıcı dostu, son derece etkileşimli web siteleri oluşturmaya izin verir.
• JavaScript kodu satır satır yorumlandığı için hata ayıklaması ve test etmesi nispeten kolaydır.
• Hem ön uç hem de arka uç geliştiriciler tarafından kullanılabilir.

JavaScript’in Dezavantajları

• Google, JavaScript’te oluşturulan açılış sayfalarını potansiyel olarak oluşturamıyor ve dizine ekleyemiyor.
• JavaScript’in bir sayfada oluşturulmasını zorunlu kılmak, iki temel alanı olumsuz etkileyebilir:

1. Site hızı
2. Arama motoru tarama ve dizine ekleme

Bununla birlikte, kullandığınız oluşturma yöntemine bağlı olarak, sayfa yükleme hızını azaltabilir ve içeriğin tarama ve dizine ekleme için arama motorları tarafından erişilebilir olduğundan emin olabilirsiniz.

JavaScript, sayfaların hızlı bir şekilde yüklenmesini sağlar, zengin bir arayüz sunar ve uygulaması kolaydır; ancak, tarayıcı akışkanlığı kullanıcı etkileşimine göre değişir ve arama motorlarının sayfayı anlamasını ve içerikle bir değer ilişkilendirmesini zorlaştırır.

JavaScript içeriği taşıyan web sayfalarını işlerken arama motorlarının kendi sınırlamaları vardır. Google, sayfanın ilk taramasını gerçekleştirir ve bulduklarını dizine ekler. Kaynaklar mevcut olduğunda, botlar bu sayfalarda JS’yi oluşturmaya geri döner. Bu, JavaScript’e dayanan içerik ve bağlantıların arama motorları tarafından görülmeme riski taşıdığı ve potansiyel olarak sitenin SEO’suna zarar verebileceği anlamına gelir.

JavaScript Oluşturma

Oluşturma, bir sayfayı ve görsel düzen şablonlarını ve bileşenlerini doldurmak için ilgili verileri getirmeye ve ardından bir web tarayıcısının görüntüleyebileceği HTML oluşturmak için bunları birleştirmeye odaklanır. Burada iki temel kavramı tanıtmamız gerekiyor; sunucu tarafında işleme ve istemci tarafında işleme. JavaScript web sitelerini yöneten her SEO’nun ikisi arasındaki farkı tanıması çok önemlidir.

Yerleşik yaklaşım, sunucu tarafı işleme, sayfayı tam olarak açıklayan HTML’yi alan bir tarayıcı veya bir arama motoru botunu (tarayıcı) içerir. Dolayısıyla tarayıcınız veya arama motoru botunuz, sayfanın nasıl tasarlandığını göstermek için ekli varlıkları (CSS, resimler, vb.) indirmelidir. Bu geleneksel yaklaşım olduğundan, arama motorlarının genellikle sunucu tarafında oluşturulan içerikle ilgili bir sorunu yoktur. Geleneksel olarak bu şekilde işleyen web siteleri PHP, ASP veya Ruby’de programlanır ve Kentico, WordPress veya Magento gibi popüler içerik yönetim sistemlerini kullanmış olabilir.

Bununla birlikte, daha modernize edilmiş istemci tarafı oluşturma yaklaşımı çok farklıdır. Birçok arama motoru botunun, birincil yüklemenin bir sonucu olarak, çok az içeriğe sahip boş bir HTML sayfasını bota geri yansıtması nedeniyle bu yolla mücadele ettiği belirtilmiştir. Dahil edilen JavaScript kodu daha sonra sunucuya bir istek gönderir ve geri aldığı verileri sayfayı oluşturmak ve oluşturmak için kullanır.

DOM ile JavaScript Oluşturma

JavaScript oluşturma, sayfanın Belge Nesne Modeli (DOM) yeterince yüklendiğinde çalışır. Daha fazla açıklamak gerekirse DOM, dinamik olarak oluşturulan sayfanın temelidir. Standart HTML sayfaları, değiştirilmedikleri yerlerde statiktir, dinamik sayfalar ise değiştirme yeteneğine sahip olan ve anında oluşturulabilen sayfalardır.
Daha önce belirtildiği gibi JavaScript ve kaynaklar, JavaScript çalıştırmanın daha sonra gerçekleştirileceği bir sayfayı oluşturmak için hayati öneme sahiptir. JavaScript daha sonra DOM içinde değişiklikler yapar ve belirli web sayfasının HTML kodunu sunar. Seçilen arama motoru botu, oluşturulan HTML kodunun anlık görüntüsünü almadan önce genellikle yaklaşık üç saniye bekler.

JavaScript Oluşturma Googlebot ile Nasıl Çalışır?

Googlebot, JavaScript’i üç ana aşamada işler, bunlar:

1. Emekleme
2. Rendering
3. Endeksleme

Google’ın şemasında gösterildiği gibi, Googlebot, sayfaları tarama ve oluşturma işlemleri için bir sıraya yerleştirir. Googlebot tarama sırasından bir URL alır ve URL’ye izin verilip verilmediğini görmek için robots.txt dosyasını okur.
Googlebot buradan sonra HTML yanıtını diğer URL’ye ayrıştırır ve tarama kuyruğuna ekler. Googlebot’un kaynakları izin verdiğinde, bir Chromium sayfayı işler ve JavaScript’i çalıştırır. Oluşturulan HTML daha sonra sayfayı dizine eklemek için kullanılır.

Google iki ayrı indeksleme dalgası yürüttüğü için, indeksleme işlemi sırasında bazı detayların gözden kaçması mümkündür. Örneğin, sunucu tarafında önemli başlık etiketlerini ve meta açıklamaları oluşturmuyorsanız, Google bunu ikinci yoldan gözden kaçırabilir ve SERP’lerdeki organik görünürlüğünüz üzerinde olumsuz etkileri olabilir.

Tarama ve Dizine Ekleme Arasındaki Fark Nedir?

Tarama ve indeksleme, SEO endüstrisinde karıştırılabilecek iki farklı şeydir. Tarama, Googlebot gibi bir arama motoru botuyla ilişkilendirilir, bir web sayfasındaki tüm içeriği veya kodu keşfeder ve analiz eder. Öte yandan indeksleme, sayfanın Arama Motoru Sonuçları Sayfasında (SERP’ler) görünme olasılığının yüksek olduğu anlamına gelir.

Tarama ve indekslemede botların iyileştirilmesine rağmen, JavaScript bu süreci çok daha az verimli ve daha pahalı hale getiriyor. JavaScript’in yerleşik içeriği ve bağlantıları, tarayıcıların tüm web sayfalarını oluşturması için muazzam bir çaba gerektirir. Bu arama motorları JavaScript tarafından oluşturulan sayfaları tarayacak ve dizine ekleyecektir, ancak tarayıcı ve dizinleyici arasında gidip gelme nedeniyle bu muhtemelen statik bir sayfadan daha uzun sürer. Googlebot’un HTML ve CSS dosyalarından bağlantıları indirip çıkararak sayfayı dizine eklemesine izin vermenin aksine, JavaScript fazladan bir adım oluşturur. JavaScript oluşturma süreci bir bütün olarak çok daha karmaşıktır.

JavaScript Destekli Web Siteleri İçin SEO Püf Noktaları

İç Bağlantı

Dahili bağlantı web yöneticilerinin en önemli önceliklerinden biri olduğu için, kullanıcıların site genelinde web sayfasından sayfaya geçiş yapmasına olanak sağlamak için JavaScript onclick etkinlikleri gibi JavaScript işlevlerinden yararlanmanın aksine HTML veya DOM içinde normal bağlantı etiketleri kullanılmalıdır. Dahili bağlantı, tam web sitesi mimarisi ve sayfaların genel önemi ile ilgili olarak arama motorlarına güçlü bir sinyal olarak kabul edilir.

İçerik Erişilebilirliği

İçeriğin hem kullanıcı hem de arama motoru botları için net olması için, içeriğin yükleme etkinliği içinde dizine eklenebilir olması, dizine eklenebilir bir URL gerektirmesi ve JavaScript sitelerini oluşturmak için HTML için en iyi SEO uygulamalarını kullanması gerekir. Sadece bu değil, aynı zamanda temel SEO uygulamaları ile uyumlu olduğu için, bir web sitesindeki her içerik parçası, web sitesinin kendisinden ve internetteki diğer kaynaklardan benzersiz olmalıdır.

Elde Edilebilirlik

Arama motorlarının, web sayfalarına erişebilen ancak kullanıcıyı göstermeyen ve web sayfasının içeriğini arka uçta çalışan başka bir programa aktaran bir yazılım türü olan başsız taramayı uyguladığı bildirildi. Başsız bir tarayıcı, kullanıcının deneyimini ve sayfadaki içerik durumlarını daha iyi anlamak için DOM’u oluşturmaya yardımcı olur.
Bununla birlikte, JavaScript’in nasıl çalıştırıldığını ve arama motorları botlarıyla nasıl etkileşime girdiğini anlamak önemlidir, aksi takdirde çok büyük organik sonuçlar doğurur.

Rendering

JavaScript, bir web sayfasının genel olarak oluşturulmasını etkileyebilir. Bu nedenle, oluşturmayı engelleyen bir şey varsa, bu, sayfanın yüklenmesini geciktirebilir. Genel bir kural olarak, Google, bir web sitesinde içerik katının üst kısmının yüklenmesini engelleyen herhangi bir JavaScript’i tamamen kaldırmanızı veya en azından ertelemenizi önerir.

Ekranın üst kısmı, web sayfasının sayfa ilk yüklendiğinde görünen kısmını ifade eder. Sayfanın sonraki bölümü kaydırma gerektiren “ekranın alt kısmı” olarak adlandırılır.

Tek Sayfa Uygulama Hususları

Tek sayfalık bir uygulama (SPA), öncelikle web üzerinde verimli bir şekilde çalışmak üzere tasarlanmış ve oluşturulmuş bir web uygulaması / web sitesidir. Sunucudan bir sayfanın tamamını yüklemenin aksine, bu sayfalar dinamik olarak yeniden yazılır ve ihtiyaç duyduğunuz parçalarla yüklenir.

SPA yaklaşımı, hızlı bir yükleme süresi sağlar, daha az bant genişliği kullanır ve uygulamanın daha çok bir masaüstü uygulaması gibi davranmasını sağlayarak kullanıcıya keyifli bir deneyim sunar. Uygulamanın kullanımına bağlı olarak birçok farklı SPA çerçeve seçeneğinin mevcut olduğu unutulmamalıdır. Bunlar arasında; React.js, Angular.js, Backbone.js, Preact, Next.js vb sayılabilir.

Google, SPA’daki içeriği taramaya ve dizine eklemeye çalıştığında birçok engel olabilir. Bu nedenle, SPA kullanıyorsanız, Google’ın neleri alabildiğini anlamak için “Getirme” komutunu kullanarak birçok kez test etmeniz önerilir.

JavaScript SEO Araçları: JavaScript’inizi Kontrol Edin

JavaScript’in sahip olduğu sonsuz yeteneklerle, JavaScript koduyla ilgili sorunları değerlendirmek ve düzeltmek için çok sayıda yardımcı araç mevcuttur. İşte bir SEO olarak yararlı bulacağınız birkaç tanesi:

URL İnceleme Aracı

“Google Arama Konsolu”nda bulunan “URL İnceleme Aracı”, Google’ın bir sayfayı tarayıp / dizine ekleyip ekleyemediğine, herhangi bir hatanın oluşup oluşmadığına ve neden olduğuna ilişkin bilgileri gösterir.

DeepCrawl

DeepCrawl, bir web sitesinin tüm farklı sayfalarında, Google’ın yapacağı aynı modelde JavaScript’i taramak ve oluşturmak için kullanılabilir. Bu akıllı araç, oluşturmayı kitlesel ölçekte etkili bir şekilde test etmenize ve izlemenize olanak tanır ve bunun karşılığında JavaScript’in arama motorları botları tarafından taranıp dizine eklenip eklenemeyeceğini anlamanıza yardımcı olur.

Mobil Uyumluluk Testi

Google’ın mobil uyumluluk testçisi, bir ziyaretçinin bir mobil cihaz üzerinden web sitenizde gezinmesinin ne kadar kolay / zor olduğu hakkında bilgi sağlar.

Sayfa Hızı Bilgileri

Google’ın sayfa hızı analiz aracı (PSI), mobil ve masaüstü cihazların performansını etkili bir şekilde ayrıntılarıyla açıklar. Buna ek olarak, bu araç, bunun nasıl geliştirilebileceğine dair öneriler de sağlar.

Site: Komut

Site: Command, Google’ın içeriğinizi doğru bir şekilde dizine ekleyip dizine eklemediğini görmenize yardımcı olan en doğrudan araçlardan biridir. Bunu yapmak için Google’da şu komutu tamamlayabilirsiniz – site: [web sitenizin URL’si] “metin içeriği veya sorgu”

Fark Denetleyici

Diffchecker, iki tür metin dosyasını karşılaştırmanıza ve her ikisi arasındaki farkları gözden geçirmenize olanak tanıyan benzersiz bir araçtır. Bu, özellikle web sayfalarının orijinal kaynak kodunun işlenen koda göre analizini gerçekleştirmek için kullanışlıdır. Bu araç, içeriğin oluşturulduktan sonra nasıl değiştiğine dair kapsamlı karşılaştırmalar sunar.

Chrome Geliştirme Araçları

Chrome DevTools, deneyimli web geliştiricilerinin doğrudan Google’ın Chrome tarayıcısına eklemeler yapabilecekleri bir dizi araçtır. Chrome DevTools, bir metin düzenleyici kullanmanıza gerek kalmadan düzenlemenize ve hızlı stil değişiklikleri yapmanıza yardımcı olabilir.

5 Saniyelik Zaman Aşımı

Google resmi olarak belirtilmemiş olsa da, Google’ın 5 saniyeden fazla beklememesi gerektiği biliniyor. Bu nedenle, yükleme olayındaki herhangi bir içerik (yaklaşık 5 saniye) dizine eklenebilir.

Dizine Eklenebilir URL’ler

Sayfalar, her açılış sayfası için sunucu tarafı desteği sunan dizine eklenebilir URL’ler gerektirir. Bu, her kategoriyi, alt kategoriyi ve ürün sayfasını içerir.

Tarayıcınızın “İnceleme” Özelliğini Kullanma

Oluşturulan HTML elde edildiğinde ve Google’ın beklediği geleneksel bir açılış sayfası düzeyini karşıladığında, birçok etkileyen faktör kendi kendine çözülecektir.

Oluşturulan HTML ve genel JavaScript ögelerini incelemek için, Google Chrome’un “İnceleme Ögesi”, web sayfası hakkında kullanıcıların görünümünden gizlenen daha fazla bilgiyi keşfetmelerine yardımcı olmak için kullanılabilir. Bir web sayfasıyla etkileşimde bulunurken kullanıcı davranışı gibi gizli JavaScript dosyalarını keşfetmek için, bu bilgiyi “İnceleme Öge”sinin “Kaynaklar” sekmesinden elde edebilirsiniz.

İnceleme ögesinde içeriğinizin tamamını göremiyorsanız, tarayıcı içinde oluşturmak için istemci tarafı oluşturma olarak bilinen JavaScript kullanıyor olma olasılığınız yüksektir.

GSC’de URL İnceleme Aracı

URL inceleme aracı, Google’ın onu nasıl görüntülediğinin tam durumunu anlamak için web sitenizdeki belirli bir URL’yi analiz etmenize olanak tanır. URL inceleme aracı, tarama, dizine ekleme ve sorunlara neden olan yapılandırılmış veri hataları gibi Google’ın dizininden daha fazla bilgi sağlar.

Sayfa Yükleme Hızını Artırın

Google, sayfa hızının, karmaşık algoritmaları tarafından sayfaları sıralamak için kullanılan sinyallerden biri olduğunu ve daha hızlı bir sayfa hızının, arama motoru botlarının bir sitenin genel endekslenmesine yardımcı olan sayfa sayısını artırmasına izin verdiğini belirtti. JavaScript açısından, web sayfasını kullanıcılar için daha etkileşimli ve dinamik hale getirmek, sayfa hızıyla ilgili bazı maliyetler getirebilir. Bunu azaltmak için, genellikle ekranın üst kısmında tamamen gerekli olmayan belirli bileşenler için geç yüklemenin kullanılması önerilebilir.

Sayfa İçi SEO Çabalarınızda Israrcı Olun

Arama motorlarında sıralanmalarına yardımcı olmak için sayfanızı optimize etmeye giden tüm sayfa içi SEO kuralları hala geçerlidir. Başlık etiketlerinizi, meta açıklamalarınızı, resimlerdeki alt özniteliklerinizi ve meta robot etiketlerinizi optimize edin. Benzersiz ve açıklayıcı başlıklar ve meta açıklamalar, kullanıcıların ve arama motorlarının içeriği kolayca tanımlamasına yardımcı olur. Anlamsal olarak alakalı anahtar kelimelerin arama amacına ve stratejik yerleşimine dikkat edin.

Ayrıca, SEO dostu bir URL yapısına sahip olmak da iyidir. Birkaç durumda, web siteleri URL’de bir pushState değişikliği uygular ve Google’ın standart olanı bulmaya çalışırken kafasını karıştırır. Bu tür sorunlar için URL’leri kontrol ettiğinizden emin olun.

JavaScript’inizin DOM Ağacında Göründüğünden Emin Olun

JavaScript oluşturma, bir sayfanın DOM’u yeterince yüklendiğinde çalışır. DOM veya Belge Nesne Modeli, sayfa içeriğinin yapısını ve her bir ögenin diğeriyle ilişkisini gösterir. Bunu, tarayıcının sayfa kodundaki “İnceleme Ögesi” içinde bulabilirsiniz. DOM, dinamik olarak oluşturulan sayfanın temelidir.

İçeriğiniz DOM’da görülebiliyorsa, içeriğiniz büyük olasılıkla Google tarafından ayrıştırılıyor demektir. DOM’u kontrol etmek, sayfalarınıza arama motoru botları tarafından erişilip erişilmediğini belirlemenize yardımcı olacaktır.

Arama Motorlarının JS İçeriğine Erişimini Engellemekten Kaçının

Google’ın JavaScript içeriğini bulamaması sorununu önlemek için, birkaç web yöneticisi JS içeriğini kullanıcılara sunan ancak tarayıcılardan gizleyen “Gizleme” adı verilen bir işlem kullanır. Ancak, bu yöntem Google’ın Web Yöneticisi Yönergelerinin ihlali olarak kabul edilir ve bu nedenle cezalandırılabilirsiniz. Bunun yerine, temel sorunları belirlemeye ve JS içeriğini arama motorları için erişilebilir hale getirmeye çalışın.

İlgili HTTP Durum Kodlarını Kullanın

Google’ın tarayıcıları, bir sayfayı tararken sorunları tanımlamak için HTTP durum kodlarını kullanır. Bu nedenle, botlara bir sayfanın taranmaması veya dizine eklenmemesi gerektiğini bildirmek için anlamlı bir durum kodu kullanmalısınız. Örneğin, botlara bir sayfanın yeni bir URL’ye taşındığını söylemek için 301 HTTP durumunu kullanabilir ve Google’ın dizinini buna göre güncellemesine izin verebilirsiniz.

Yinelenen İçeriği Düzeltin

JavaScript web siteleri için kullanıldığında, aynı içerik için farklı URL’ler olabilir. Bu tür sayfaları bulduğunuzda, dizine eklenmesini istediğiniz orijinal / tercih edilen URL’yi seçtiğinizden ve arama motorlarının kafasının karışmasını önlemek için kanonik etiketler ayarladığınızdan emin olun.

Geç Yüklenen İçeriği ve Görüntüleri Düzeltin

SEO için site hızı çok önemlidir. Geç yükleme, kritik olmayan veya görünür olmayan içeriğin yüklenmesini geciktiren ve böylece ilk sayfa yükleme süresini azaltan bu tür bir kullanıcı deneyimi en iyi uygulamasıdır. Ancak sayfaların daha hızlı yüklenmesini sağlamanın yanı sıra, içeriğinizin arama motoru tarayıcıları tarafından erişilebilir olmasını sağlamanız gerekir. Bu tarayıcılar, SEO’nuzu olumsuz yönde etkileyerek, JavaScript’inizi çalıştırmaz.

Dahası, görsel aramaları ayrıca ek organik trafik kaynağıdır. Dolayısıyla, geç yüklenen görselleriniz varsa, arama motorları bunları seçmeyecektir.

JavaScript’i Erteleme ve Asenkron

JavaScript <head></head> kodları arasına dizilir ve kodlar yukarıdan aşağıya doğru çalıştırılır. Eğer JavaScript komut dosyanıda çok sayıda kod varsa web sitenizin açılması da bir o kadar uzun sürecektir. Ama bazı önemsiz adımları erteleyerek JS’nin onları ayrıştırmasını engelleyebilir ve site hızınızı artırabilirsiniz.

async/await Komutu: async / await komutları tüm programlama dillerinde bulunur. async komutu bir fonksiyona ya da metoda “asenkron” yani ana dizin akışından bağımsız çalışabilme yeteneği kazandırır. async fonksiyonları kod dizilimini takip etmeyeceği için akışa paralel çalışabilirler. Bu aşamada da metodu await komutu ile bekletebilirsiniz. async ve await eşzamansız da denilen asenkron kodları yazmak için thread’den daha yeni modern bir yoldur.

defer Komutu: Defer etiketi JavaScript dosyalarını sayfada en son açar. Bu komut sayfanın çalışma hızında artış sağlar.

preload Komutu: Preload komutu ile sitenize yüklediğiniz görsellerin diğer içeriklerden daha sonra görüntülenmesini sağlayabilirsiniz. Bu da site hızını artırmanın bir yoludur.

JavaScript İçin SEO’da Kaçınmanız Gereken Hatalar

Web sitenizde JavaScript kullanıyorsanız, Google artık yükleme olayından sonra ögeleri oldukça iyi bir şekilde oluşturabilir ve nihayet anlık görüntüyü geleneksel bir HTML sitesi gibi okuyabilir ve dizine ekleyebilir.

JavaScript ve SEO ile ilgili çoğu sorun yanlış uygulamadan kaynaklanmaktadır. Bu nedenle, birçok yaygın SEO en iyi uygulaması JavaScript SEO için de kullanılabilir. Bunlar, meydana gelebilecek en yaygın hatalardan birkaçıdır:

1. Dizine Eklenebilir URL’ler: Her web sitesi, sitelerin tamamen dizine eklenebilmesi için benzersiz ve ayırt edici URL’ler gerektirir. Ancak JavaScript ile oluşturulduğu gibi bir pushState, bir URL oluşturmaz. Bu nedenle, JavaScript siteniz, bir istemciye veya bot sorgusuna sunucu yanıtı olarak 200 OK durum kodu verebilen kendi web belgesini de gerektirir. JS ile sunulan her ürün (veya JS ile gerçekleştirilen web sitenizin her kategorisi) bu nedenle sitenizin dizine eklenebilmesi için bir sunucu tarafı URL’si ile donatılmalıdır.

2. PushState Hataları: PushState yöntemi ile JavaScript URL’leri değiştirilebilir. Bu nedenle, orijinal URL’nin sunucu tarafı desteği ile aktarıldığından kesinlikle emin olmalısınız. Aksi takdirde, yinelenen içerik riskiyle karşılaşırsınız.

3. Eksik Meta Veriler: JavaScript kullanımıyla, birçok web yöneticisi veya SEO temel bilgileri unutur ve meta verileri bota aktarmaz. Bununla birlikte, JavaScript içeriği için HTML siteleriyle aynı SEO standartları geçerlidir. Bu nedenle, görseller için alt etiketlerinin başlığı ve meta açıklamasını mutlaka kullanın.

4. href ve img: Googlebot, daha fazla site bulabilmesi için izleyebileceği bağlantılara ihtiyaç duyar. Bu nedenle, JS belgelerinizde href veya src özniteliklerine sahip bağlantılar da sağlamalısınız.

5. Birleşik Sürümler Oluşturun: JavaScript’in oluşturulmasıyla preDOM ve postDOM sürümleri ortaya çıkar. Mümkünse, hiçbir çelişkinin girmediğinden ve örneğin, kanonik etiketlerin veya sayfalandırmaların doğru şekilde yorumlanabildiğinden emin olun. Bu şekilde gizlemeden kurtulursunuz.

6. Tüm Botlar İçin Erişim Oluşturun: Tüm botlar, Googlebot gibi JavaScript ile başa çıkamaz. Bu nedenle, HTML koduna başlık, meta bilgi ve sosyal etiket yerleştirmeniz önerilir.

7. robots.txt Üzerinden JS’yi Devre Dışı Bırakmayın: JavaScript’inizin Googlebot tarafından da taranabildiğinden emin olun. Bunun için dizinler robots.txt dosyasında hariç tutulmamalıdır.

8. Geçerli Bir Site Haritası Kullanın: Google’a JavaScript içeriğindeki olası değişiklikleri göstermek için, XML site haritanızda “lastmod” özniteliğini her zaman güncel tutmalısınız.