Günümüzde bir web sayfasının yüklenme hızı birçok açıdan önemli hale geldi. Hem arama motorlarının hem de ziyaretçilerin bu konudaki yüksek beklentisi, web siteleri bu konuda aksiyon almak zorunda bırakıyor. Bu konuda da sizlere yardımcı olabilecek ücretsiz bir Google aracı bulunuyor. Adı, Google PageSpeed Insights olan ücretsiz sayfa hızı görüntüleyici sayesinde, hem güncel durumunuzu test edebilir hem de hızlandırmak için çeşitli ipuçları elde edebilirsiniz.
Analiz ve önleyici tedbirler sunan Google PageSpeed Insights, birçoğunuz için hem daha fazla görünürlük ve organik trafik sağlar hem de hemen çıkma oranının ciddi seviyede düşmesini sağlar. İçeriğiniz mükemmel olsa dahi, sayfa hızınız yavaş olduğu takdirde, ziyaretçi beklemeyecektir. Çünkü, arama motoru birçok konuda onlarca alternatif sunuyor. Başka bir alternatif ile istediğine büyük ölçüde ulaşabilir. Bu durumda, siz ziyaretçi kaybetmiş olursunuz. Zaman içerisinde de sıralamalarda ciddi düşüşler yaşamaya başlarsınız.
Ziyaretçilerin büyük bir bölümü, 5 saniyenin üzerinde açılan sayfaları beklemeden çıkış yapma eğilimi gösteriyor. Web sitelerin daha hızlı açılmaya başlaması ile birlikte bu süre 3 saniyeye kadar düşmüş durumda. Ziyaretçiler, kendileri için çok önemli bir bilgiye erişecekleri konusunda emin olmadıkları takdirde 3 saniyeden fazla beklemek istemiyorlar.
Sadece içerik sunan web siteler değil aynı zamanda e-ticaret siteleri de web sayfalarının yavaş açılmasından dolayı ziyaretçi kaybediyor. Bu nedenle, satışları hızlı bir şekilde düşen ya da satışlarını artıramayan çok sayıda işletme var.
Google PageSpeed Insights Nedir?
Google sağlamış olduğu çok sayıda ücretsiz araç ile birlikte, webmasterların daha iyi projeler ortaya çıkarmasına olanak tanıyor. Aynı zamanda, istemiş olduğu talepler için ücretsiz araçlar sunarak, birçok website sahibine talebi yerine getirmesi için yardımcı oluyor.
Google PageSpeed Insights, web sitelerin sayfa hızını ölçen ücretsiz bir çevrimiçi araçtır. Bu ücretsiz araç sayesinde, web siteniz hakkında genel bir hız rekoru elde edebilir, analiz sonuçları ile birlikte iyileştirilmesi gereken noktaları öğrenebilirsiniz. Sunmuş olduğu bilgiler sayesinde, direkt olarak optimize edilmesi gereken noktaları öğrenmiş olursunuz. Ancak bu bilgileri kullanabilecek yeterlilikte de olmak gerekir. Aksi takdirde bir uzmandan destek almanız gerekir.
Google PageSpeed Insights Nasıl Kullanılır?
Google PageSpeed Insights ile birlikte site hızınızı puanlayabileceğinizden bahsettik. Google PageSpeed Insights iki aşamalı bir şekilde çalışır. İlk aşama olarak web sayfasını analiz eder ve yüklenme hızını belirler. Sonrasında da bünyesinde yer alan diğer siteler ile kıyaslayarak bir puanlandırma yapar. Yani vermiş olduğu puanlamayı diğer sitelerin hızına oranlayarak size puanlama sunar. Sadece web sayfanızın puanını değil aynı zamanda geliştirmek için yapabileceğiniz çok sayıda detayı da öğrenmiş olursunuz. 2 temel başlık altında bu konuyu değerlendirebiliriz.
Yükleme süresini analiz etme
Google PageSpeed Insights, sizler için öncelikli olarak web sayfasının yüklenme hızını hesaplar. Site yüklenme hızını ölçerken yüklenen tüm öğeleri farklı farklı dikkate alır. Çok sayıda görsel, eklenti, kod vb. dosya bulunmaktadır. Bir sayfanın yüklenmesi esnasında çok sayıda element yüklenir ve kod çalışır. Tüm bu sürecin sonlanması ile birlikte yükleme hızı ölçülmüş olur.
Verileri karşılaştırma
Google PageSpeed Insights sadece hız ölçümünü yapmaz. Aynı zamanda topladığı verileri karşılaştırır ve size anlamlı bilgiler sunar. Topladığı verileri, genel veriler ile karşılaştırarak ortalamasını alır ve puanınızı belirler. Testin sonlanması ile birlikte size bazı bilgiler sunulacaktır.
Sağlanan bilgileri aşağıdaki gibi sıralayabiliriz;
- Web sayfasının ortalama yüklenme hızı iki farklı cihaz için de hesaplanır. Bunlar masaüstü hız ve mobil hız olarak karşınıza çıkar.
- Hız puanlaması ile birlikte mevcut durumunuzu tahlil edebilirsiniz.
- Sağlamış olduğu son ve önemli bilgi ise optimize edebileceğiniz bir liste çıkartır. Sitenin daha hızlı yüklenmesinin önündeki engelleri size göstererek hedefli bir şekilde çalışma yapmanıza olanak sağlar.
Yapmış olduğu puanlandırma 0 ile 100 aralığında olmaktadır. Aldığınız puanı aşağıdaki yaklaşım ile değerlendirebilirsiniz;
- 80 – 100 aralığında aldığınız puanlar, Google tarafından olumlu karşılanan bir puanlardır.
- 60 – 79 aralığında aldığınız puanlar, ortalama olarak kabul edilen puanlardır. Size karşı olumlu bir bakış açısı oluşturmaz.
- 0 – 59 aralığında aldığınız puanlar ise acil durum puanlarıdır. Hemen bazı şeyleri düzeltmeniz gerekir.
Yapılan hız testi ve puanlandırma iki farklı cihaz için de yapılır. Masaüstü puanınız ile mobil puanınız birbirinden farklı olacaktır. Web sitenizin iki cihaz için de iyi bir performans göstermesi gerekir. Özellikle, son yıllarda artan mobil trafik ile birlikte, mobil puanınız ekstra önem kazanmıştır.
Google PageSpeed Insights Neden Önemlidir?
Google PageSpeed Insights’ın bu kadar önemli olmasının altında iki neden yatmaktadır. Birincisi arama motorları hızlı yüklenen sayfalara daha fazla değer gösterir ve sıralamalarda daha üst sıralarda yer verir. Kısacası, önemli bir SEO kriteri olduğunu söylemek gerekir. Birçok kullanıcının arama yaptığında üst sıralarda çıkan sonuçları ziyaret ettiğini düşünürseniz organik trafik için son derece önemlidir.
“Soft Ajans ile birlikte bütçenize uygun SEO çalışmaları yapabilir ve sıralamanızı hızlı bir şekilde yükseltebilirsiniz. Hemen bizimle iletişime geçin ve web sitenizin durumunu inceleyerek hedefleriniz doğrultusunda en uygun planı sunalım.”
Google, arama sonuçlarını sıralarken birçok faktörü göz önüne alır. Bu faktörlerden biri de web sayfasının yüklenme hızıdır. Kullanıcı deneyimine çok fazla önem veren Google, hemen çıkma oranı yüksek olan ve yavaş yüklenen bir sayfayı üst sıralarda tutmaz. Bu nedenle, web sayfanızın yüklenme hızı arttıkça, sıralamanızdaki yerinizde de artış yaşanır.
Web sayfanın yüklenme hızı düşük seviyede olursa, sıralamalarda artış olmayacağı gibi büyük düşüşler olasıdır.
Google PageSpeed Insights’da Nasıl 100 Puan Alırım?
Google PageSpeed Insights puanınızı yükseltmek ve daha yüksek bir puan elde etmek için öncelikle konunun önemini anlamak gerekir. Yukarıda yer alan başlık altında, web sayfasının hızlı bir şekilde yüklenmesinin, ne gibi pozitif fayda sağlayacağını gördünüz. Tam tersine bir durumda da negatif sonuçları olacaktır.
Web sayfanızın hızlı bir şekilde yüklenmesi için tek bir doğruyu değil birçok doğruyu bir araya getirmeniz gerekir. Bunun için düzeltmeniz ve dikkat etmeniz gereken çok sayıda başlık bulunmaktadır.
Google PageSpeed Insights bu alanda yapacağınız çalışmalarda iyi bir rehber olacaktır. Sadece puanlandırma yapmaz. Aynı zamanda gelişime açık olan noktaları paylaşır. Aşağıdaki başlıklar üzerine dikkatli bir inceleme yaparak, web site hızını optimize edebilir ve 100 puana yakın sonuçlar alabilirsiniz.
Ekran dışı görselleri erteleyin
Tembel yükleme olarak isimlendirilen ekran dışı görsellerin geç yüklenmesi, ziyaretçiler için çok olumlu karşılanmaktadır. Ziyaretçinin karşısına çıkan ilk ekran, önce yüklenmesi gereken görselleri barındırmalıdır. Ziyaretçinin ilk bakışta ve ekranı kaydırmadan göremeyeceği görselleri en başta yüklemenin bir anlamı da yoktur. Sadece ekran içine sığan öğelerin yüklenmesi birçok açıdan avantaj sağlar. Hız konusunda yarattığı avantaj da ilk sırada gelir.
Peki, faydalı olan tembel yükleme nasıl yapılır? Bunu yapmanın çeşitli yöntemleri vardır. WordPress kullanıcıları için çok sayıda lazy load eklentisi bulunmaktadır. Bunlardan birini kullanarak bu sorunu hızlı bir şekilde çözebilirler. Diğer yöntemler ise; kesişim gözlemcisi API seçeneği ve javascript işleyici uygulamasıdır. Bu yöntemleri tercih ederseniz, kodlama bilginiz olması gerekir. Kodlama konusunda bilgiye sahip değilseniz, bir uzmandan yardım almanız gerekecektir.
Görselleri yeni nesil biçimlerde sunun
Görseller için kullandığınız formatların, yüklenme hızı üzerinden büyük etkisi bulunmaktadır. Birçok websitenin, görseller için .jpeg ve .png formatlarında görsel kullandığını görülür. Ancak bu formatların yüklenmesi, yeni formatlara oranla çok daha uzun zaman almaktadır. Bu formatların yerine .webp formatında görseller kullanarak, çok daha hızlı bir şekilde sayfanın yüklenmesini sağlayabilirsiniz.
WebP formatındaki görseller boyut olarak büyük farkla daha az yer kaplar. Bu nedenle de, yüklenme süresi diğer formatlara göre çok daha kısa zamanda gerçekleşir. Yarı yarıya fark oluşturan bu format, Google tarafından şiddetle tavsiye edilmektedir. Bu konuda yer alan handikap ise Safari tarayıcı tarafından desteklenmemesidir. Ama bu konuda da çözüm bulunmaktadır. Çeşitli eklentiler ve CDN kullanımı ile birlikte Safari üzerinde de sorunsuz bir şekilde, görseller, normal formatları (.jpeg, .png…) ile gösterilir.
Oluşturmayı engelleyen kaynakları ortadan kaldırın
Bir web sitenin yüklenme sırasında, her işlem tek tek işlenir ve yüklenme gerçekleşir. Bu sıralama esnasında, alakasız ve ilk etapta ihtiyaç duyulmayacak çok sayıda yükleme yapılabilir. Kritik olmayan öğelerin yüklenmeye çalışılması nedeniyle, web sayfasının yüklenmesi gecikebilir.
Sizin ve ziyaretçi için kritik olmayan dosyaları belirleyerek ikincil duruma getirebilirsiniz. Bu konuda WordPress kullanıcıları için çeşitli eklentiler yer almaktadır. Bu eklentileri inceleyerek kullanmayı deneyebilirsiniz.
Bazı bozuk komutlar ve eklentilerden dolayı yüklemenin çok fazla geciktiğini sıklıkla görüyoruz. Web sitenizde çok uzun bekleyişler sonucunda sayfanız yükleniyorsa ve birçok nedeni kontrol ettiğiniz halde gelişme yoksa, eklentileri deaktif hale getirin. Her eklentiyi tek tek deaktif hale getirerek hangisinin sorun çıkardığını bulabilirsiniz.
Kullanılmayan CSS’i azaltın
Bir sayfa yüklenmeye başladığı anda sahip olduğu tüm CSS dosyalarını yüklemeye başlar. Kullanılıp kullanılmadığını umursamadan bu işlemi gerçekleştirir. Sizin, kullanılmayan CSS dosyalarını tespit edip kaldırmanız gerekir. Aksi takdirde, bir anlam ifade etmeyen CSS dosyaları boş yere kaynak tüketecek ve sayfanın açılış hızını yavaşlatacaktır.
WordPress kullanıcıları için çeşitli eklentiler ile bu sorunu giderebilirsiniz. Bu eklentiler arasında en çok kullanılanlardan biri, Asset CleanUp eklentisidir. Uygulamayı yükledikten sonra sahip olduğunuz CSS ve JS dosyalarına erişim sağlayabilirsiniz. Liste üzerinden kullanılmayan CSS ve JS dosyalarını kolay bir şekilde kaldırabilirsiniz.
JavaScript ve CSS’yi küçültün
Sahip olduğunuz JavaScript ve CSS dosyalarını daha yalın hale getirebilirsiniz. Kodlama bilginiz olmadığı takdirde, bir uzmandan yardım almanız gerekecektir. Çok daha yalın hale gelen dosyalar daha kısa süre içerisinde yüklenir. Bu sayede, sayfa hızınız artacaktır.
CSS ve JavaScript dosyalarını daha yalın hale getirmek için, kodda yer alan fazla boşlukları ve anlam ifade etmeyen değişkenleri kaldırabilirsiniz. Olumlu bir şey yapmak isterken uzman olmadığınız bir konuya girmek mantıklı olmaz. Kodlama birinden yardım almanız çoğunlukla daha sağlıklı bir yaklaşımdır. WordPress kullanıcıları bu konuda yardımı WP Rocket eklentisinden alabilir.
İlk sunucu yanıt süresini azaltın
“Time to first byte” kelimelerinin kısaltması ile TTFB olarak karşımıza çıkan sunucu yanıt süresi önemli bir konudur. İlk bayta kadar geçen süre için, 200 milisaniyeden daha az bir zamanda gerçekleşmesi istenir. İlk sunucu yanıt süresini azaltarak, daha hızlı bir web siteye sahip olabilirsiniz.
Bunu gerçekleştirmek için hosting hizmeti için kaliteli bir ürün kullanmanız gerekir. Bu konuda, ürün özelliklerine bakarak karşılaştırma yapabilir ve hosting firmanızdan detaylı bilgi alabilirsiniz. Ayrıca, CDN kullanımı sayesinde de ilk yanıt süresinde çok büyük avantaj elde etmiş olursunuz.
Aşırı DOM boyutundan kaçının
Eğer ki Google PageSpeed Insights tarafından sunulan hatalar arasında bu hatayı alıyorsanız, düzeltmeniz için bazı konulara dikkat etmelisiniz. Öncelikle bu hata, çok fazla DOM düğümü ya da HTML etiketi barındıran sayfalar için çıkar. Bu hataya hiç yakalanmamak için kullandığınız eklentileri iyi bir şekilde kodlandığından emin olun. Her eklentiyi kullanmayın. Ayrıca çok sayıda HTML kodundan oluşan ve yalın olmayan temalar da kullanmayın.
Metin sıkıştırmayı etkinleştir
Birçok web sitenin aldığı hatalardan biridir. Sayfada yer alan sıkıştırılmamış CSS ve JavaScript’lerin varlığını bildirir. Metinleri .gzip dosyalarına sıkıştıran araçları kullanabilirsiniz. Bu araçlar sayesinde, sayfa yüklenme hızında %10’luk bir avantaj elde edebilirsiniz.
Büyük düzen kaymalarından kaçının
Düzen kaymasının ne olduğunu öğrenmekle başlayabiliriz. İçeriğin içerisinde yer alan bir öğenin çok büyük olmasından dolayı, yükleme esnasında kalan içeriğin konumunda farklılık yaratabilir. Bu duruma büyük düzen kayması denir. İçerik içerisinde yer alan yazı tipi ve boyutunda çok büyük farklılıklar olduğunda bu gibi durumlar gözükebilir.
Bu şekilde bir hata yaşamamak için, kullandığınız görsellerin boyutlarına dikkat edin. Büyük görsellerin boyutlarını yeniden yapılandırın. Eklediğiniz reklamların boyutuna ve sayısına dikkat edin.
Ana iş parçacığı çalışmasını en aza indirin
Bu hata ile karşı karşıya geldiğinizde aklınıza iki farklı konu gelmelidir. Birincisi, CSS kodlamasının çok uzun olduğu; ikincisi ise JavaScript’in çok uzun olduğudur. Bu konuda yardımcı olan eklentiler vardır. Minify JS ve Defer JS eklentilerini kullanabilirsiniz. Bu eklentiler sayesinde, gereksiz kodlardan kurulmuş olacaksınız.
Kullanılmayan JavaScript’i azaltın
Kullanılmayan JavaScript de sayfanın tüm öğeleri gibi yüklenir. Hiçbir amaca hizmet etmeyen kodun yüklenmesi gereksiz bir şekilde yüklenme süresini uzatacaktır. Bu gibi bir sorunla karşı karşıya kalıyorsanız, JavaScript kodlarının yüklenmesini olabildiğince erteleyebilirsiniz. Daha sağlıklı yöntem ise sadece gerekenlerin yüklenmesini sağlamaktır.
Kullanılmayan kodları nasıl bulacağınızı merak ediyorsanız, Google PageSpeed Insights tarafından sunulan raporlar kullanılmayan JavaScript kodlarını görebileceksiniz.
Kritik istekleri zincirlemekten kaçının
Bir web sayfasının yüklenmesi belirli bir sıra ile gerçekleşir. Önemli ve ilk yüklenmesi gereken kaynakların sonlara kalması ile birlikte hatalar zinciri oluşabilir. Bu gibi sorunları yaşamamak için yükleme esnasında doğru sıranın takip edildiğinden emin olmanız gerekir. Sayfa üzerinde yer alan kritik kaynakları optimize ettiğiniz takdirde, bu sorun çözülecektir. Bu sayede, yüklenmesi gerekenin önce yüklenmesini sağlayabilirsiniz. Kaynakların sayısını da azaltarak daha hızlı bir yükleme elde edebilirsiniz.
JavaScript yürütme süresini azaltın
Çok fazla JavaScript kodu yürütülüyorsa, bu hata mesajını alırsınız. Bu gibi bir durum, kesinlikle sayfanın daha yavaş yüklenmesine neden olur. Kullanılmayan komut dosyalarını erteleyerek bu sorundan kurtulabilirsiniz. Kullanılmayan dosyaları ortadan kaldırmak da doğru tercih olabilir. Ama dikkatli olmakta fayda var. Bu konuda destek alabileceğiniz WordPress eklentilerini inceleyebilirsiniz.
Görüntüleri verimli bir şekilde kodlayın
Görselleri optimize etmediğiniz takdirde bu hata mesajını alırsınız. Görsellerin hızlı bir şekilde yüklenebilmesi için optimize edilmesi gerekir. Görsellerin doğru boyutlandırılması, bu sorunun çözümünde en kritik faktördür. Doğru boyutlandırma ve sıkıştırma sağlayan eklentiler kullanabilirsiniz.
Statik varlıkları verimli bir önbellek ilkesiyle sunun
Önbellek süreniz çok kısa olduğu takdirde, bu gibi bir hata alabilirsiniz. Bir ziyaretçi siteye girdiğinde tarayıcı üzerinde önbellek oluşturur. Bu önbellek oluşumu sayesinde, başka bir ziyaretçi siteye girdiğinde, sunucunun yüklemesini beklemek yerine direkt olarak önbellekten alır. Bu sayede çok hızlı bir şekilde içeriğe erişilmiş olunur.
CDN ya da önbellek eklentisi kullanarak ışık hızında sayfa yüklemesine ulaşabilirsiniz. Bu konuda çok sayıda eklenti bulunmaktadır. Kullandığınız eklentinin sağlıklı çalıştığından emin olun.
İstek sayılarını düşük ve aktarım boyutlarını küçük tutun
Çok sayıda istek ve yüksek boyutta dosyalardan dolayı sayfa yükleme hızı yavaşlayacak ve süre artacaktır. Bu konuda dikkat etmeniz gereken nokta; DOM boyutunu küçültmek ve görselleri optimize etmektir. Bir sayfa üzerinde çok sayıda görsel ve aynı zamanda da yüksek boyutta görsel bulunması, açılması için saniyeler alabilir. Bu nedenle, birçok site, içeriği sayfalara bölerek, görselleri galeri olarak sunuyor. Ayrıca, görselleri optimize ederek, aynı kalitede tutup boyutlarını azaltabilirsiniz.
Google PageSpeed Insight Genel Bakış
Google PageSpeed Insights ile birlikte web sitenizin hızını ve daha hızlı olması için optimize edilmesi gereken noktaları öğrenebilirsiniz. Bu bilgiler ile birlikte alacağınız aksiyonlarla çok daha hızlı yüklenen bir siteye kavuşabilirsiniz. Bu gelişim ile birlikte hem arama motoru sıralamalarında daha üst sıralarda yer almış olursunuz hem de ziyaretçileriniz çok daha sağlıklı bir deneyim yaşamış olur.
Google PageSpeed Insights tarafından verilen puanı artırmak için aşağıda yer alan temel ipuçlarını kullanabilirsiniz;
- Görselleri .webp gibi yeni nesil formatlarda sunun
- Görselleri uygun şekilde boyutlandırın
- Kullanılmayan CSS ve Javascript’i azaltın
- Sunucunuz tarafından sağlanan ilk sunucu yanıt süresini azaltın
- Metin sıkıştırmayı aktif hale getirin
- Autoptimize ile kullanılmayan Javascript’i azaltın
- JavaScript çalıştırma süresini azaltın
- İstek sayılarını azaltın ve aktarım boyutlarını düşük seviyede tutun
