Artık indeksleme ve tarama arasındaki farkları ve JavaScript’in SEO üzerindeki etkisini tartıştığımıza göre, şimdi JavaScript SEO için en iyi uygulamaları ele alacağı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.
Yazı dizimizin diğer başlıklarına ulaşmak için okumaya devam edin! Önceki yazılar:
JavaScript Destekli Web Sitelerinin SEO Hakkında Dikkat Etmesi Gerekenler