PageSpeed Insights

24/04/2021

PageSpeed Insights

PageSpeed Insights web sitelerini kullanıcı kullanımı, kolaylığı, hızlı açılması ve yüklenmesi gibi oldukça önemli değerleri ile ölçen ve buna bağlı puanlama yapan sistemdir. PageSpeed Insights aynı zamanda web sitenizi kullanıcı deneyimine göre puanlarken, düşük aldığınız unsurlar ile ilgili neler yapmanız gerektiğini ya da neden düşük puan aldığınızı da size bildiren bir uygulamadır. İlgili uygulama bu puanları belirli teknik kategoriler altında size sunar. Biraz karışık gibi görünen bu terim ve kategoriler aslında sandığınız kadar zor ya da anlaşılmaz değildir. Bu ölçümlemelerdeki ana amaç Google arama motorunun beklediği bazı değerleri sağlayabilmenizdir. Google kullanıcılarını oldukça önemseyen düşünce yapısına sahiptir, bu yüzden her kullanıcısını memnun etmek için kendini geliştirmeye oldukça özen göstermektedir. Google arama sonuçlarında ziyaretçilerine sunduğu sıralama listesinde de kullanıcı deneyimine oldukça önem verir. Bu yüzden PageSpeed Insights ölçümleri SEO çalışmalarında yani arama sonuçlarında giderek önemli hale gelen bir unsur olarak karşımıza çıkmaktadır. Şöyle düşünebilirsiniz: Google ana amaç olarak kullanıcı memnuniyetini önde tuttuğu için, arama sorgusu yapıldığında o arama ile ilgili ilgili kullanıcıyı en mutlu edecek sonucu 1. sırada çıkartmak ve aynı düzene bağlı sonuçları bu sonucunun peşinde sıralamak için algoritma üretmektedir. Google bunu tespit edebilmek için bazı kriterleri değerlendirir. Bunları kullanıcı deneyimi, mobil uyum, site hızı, içeriğin anlaşılır olması, site içi gezinimin kusursuz sağlanması gibi değerler olarak belirtebiliriz. PageSpeed Insights uygulaması da bu bahsettiğimiz değerleri kendi içerisinde ölçümleyebilen bir algoritmaya sahiptir.

Web sitenize ait ölçümlere PageSpeed Insights adresinden erişebilirsiniz.

Chrome tarayıcısı kullanıyorsanız, taratmak istediğiniz web sayfasını açtıktan sonra tarayıcı ana menüsünde Görüntüle -> Geliştirici -> Geliştirici Araçları -> Lighthouse sekmesinden web sitenizi - sayfanızı ölçümleyebilirisiniz.

Çok fazla teknik terime girmeden bu uygulamanın neleri ölçtüğünü, temel amacının ne olduğunu herkesin anlayabileceği şekilde kısaca anlatmaya çalışayım:

Hızlı Yüklenen Sayfalar

Kullanıcı memnuniyeti sağlamanın ön koşullarından birisi hızlı yüklenen web sayfalarıdır. Pagespeed Insights uygulaması da temel olarak web sitenizin hızının yeterli olup olmadığını tespit eder. Sitenizde var olan yavaşlıkları ya da buna sebebiyet veren harici kaynakları size gösterir ve bunlara karşı önlem almanızı sağlar.

Metinlerin Okunabilir Olması

Web sitesindeki içeriklerin kolay okunabilip, anlaşılır olması ziyaretçi memnuniyeti için oldukça önemlidir. Örneğin beyaz bir arkaplan üzerinde doğru paragraf aralığı (line-height) ile ve renk olarak siyah ya da lacivert ile oluşturulan yazılar ziyaretçiler için kolay okunabilir durumdadır. Ancak dikkat çekici olması adına örneğin gri bir zemin üzerinde koyu gri ile oluşturulan metinler kullanıcıların okumasını zorlaştırabilir. Bunu bizler tasarımsal açıdan doğruymuş gibi düşünürken aslında bunun böyle olmadığını bize bu uygulama gösterir. Zemin ve yazı arasındaki renklere karar verirken tam zıt renkleri tercih etmenizde fayda olduğunu belirtebilirim. Bu uygulama bu tip konularda ziyaretçilere sorun çıkartacak olan sorunları size bildirir.

Linklerin Anlaşılabilir Olması ve Tıklamada Karışıklık Sağlamaması

Web sitenizdeki bağlantılar zaman zaman yan yana dizilebilir. Bu durumda kullanıcıların özellikle mobil cihazlarda bu linklere kolayca tıklayabilmesi ya da istediği bağlantı yerine diğerine tıklamaması için gerekli önlemleri almalısınız. Bu kullanıcı deneyimi için oldukça önemli bir unsurdur. Pageinsights uygulaması bu konuda olan eksiklerinizi size raporlar ve nerede bu sıkıntının oluştuğunu size gösterir.

Gereksiz Javascript ve CSS Kullanımı

Javascript ve CSS dosyaları web sitelerini yavaşlatan dosyalardır. Dolayısı ile gereksiz dosyaları web sitenizden kaldırmalısınız. Pagespeed Insights uygulaması size tüm javascript ve CSS kullanımlarınıza göre ayrıntılı bir rapor sunar. Burada önerim çok gerekli olmadıkça javascript kullanmadan web sitenizi yayınlamanızdır. CSS içinde mevcut CSS dosyanızı sıkıştırarak kullanmanız ve bir sayfa için belirlediğiniz stil tanımlamalarını tüm sayfalarınızda boşu boşuna göstermek yerine sadece o sayfa için bir stil dosyası oluşturmanızdır. Örneğin her sayfanız için kullandığınız genel tasarım komutlarını belirttiğiniz tema.css dosyasında, sadece hakkımızda sayfanızda oluşturduğunuz bir stile yer vermeyin. Bunun yerine hakkımızda sayfanız için ayrı bir css dosyası oluşturun ve onu sadece bu sayfada kullanın. Böylelikle sadece hakkımızda sayfasında kullanacağınız bir stil komutu diğer sayfalarınızda gereksiz yüklemeye yol açmaz. Aynı durumu javascript kullanımlarınızda da değerlendirebilir ve optimize edebilirsiniz. Pagespeed Insights uygulaması size gereksiz olan ya da sıkıştırılmamış javascript ve css dosyalarınızı gösterecektir. Uygulamanın önerilerine göre gerekli işlemleri sağlamanızı öneririm.

Görsel ve Stil Dosyalarının Önbellekten Gösterilmesi

Jpg, Png, Css ve Javascript gibi dosyalar her defasında ziyaretçi tarafından çağrıldığında gereksiz olarak yükleme ve trafik yapar. Bu yüzden bu tip dosyaları sitenizi önceden ziyaret etmiş kişiler için önbellekten çağırabilirsiniz. Bunun için htaccess dosyası üzerinden işlem yapmak bir seçenektir. Bu web sitenizin hızlı yüklenmesi, sayfalar arası geçişin kolay sağlanması için oldukça faydalı bir işlemdir.

Görsellerin Optimize Edilmesi

Web sitenizdeki görseller web site hızını belirleyecek belki de en önemli unsurlardır. Bu yüzden web sitenize görsel yüklerken dikkat etmeniz gereken detaylar vardır. Web sitenizdeki görseller öncelikli olarak ziyaretçi ekranında görüntülenebilir ve taşmayacak şekilde görüntülenmelidir. Ek olarak düşük çözünürlükte ya da kalitesiz görünümde olmamalıdır. Ancak bütün bunlara rağmen de haddinden fazla bir en boy boyutuna da sahip olmamalıdır. Bunun için görsel optimizasyonuna tahmin ettiğinizden fazla zaman ayırmalısınız. Ispat edilmiş ya da resmi olarak açıklanmış bir veri olmadığını belirterek, kendi fikrimce web site içeriklerinizde kullandığınız görsellerin 2000px*700px ölçüde olması lakin görüntü kalitesi kaybolmadan 100kb'lik bir boyutu geçmemesi gerektiğini söyleyebilirim. Aynı ölçü ve boyutları ana sayfanızda kullandığınız bannerlar için de söyleyebilirim. Lisanlı yazımlarınız yoksa görsel boyutlandırma için Photopea, görsel sıkıştırma için de Tinypng online uygulamalarından yararlanabilirsiniz.

PageSpeed Insights elbette sadece yukarıda bahsettiğim konular için ölçümleme ya da değerlendirme yapmıyor. Ancak herkesin anlayacağı şekilde temel olarak bakıldığında yukarıdaki maddelere dikkat ettiğinizde iyi bir kullanıcı deneyimi yakalıyor ve Pagespeed Insights üzerinden yüksek skorlar alabiliyorsunuz.

Şimdi PageSpeed Insights'ın teknik olarak adlandırdığı kriterleri incelemeye başlayalım:

First Contentful Paint (FCP)

Web sitenize tıklama hemen sağlandıktan sonra sayfa içeriğinin herhangi bir elemanının ilk ekranda görüntülenmesine kadar geçen süreyi ölçer. FCP skorunuz 1 saniyenin altında ise çok iyi ve güncel durumlara göre ideal bir puana sahipsiniz demektir. Puanınız sıfıra yaklaştıkça bu skorunuzun daha da etkili olduğunu da belirtebilirim... Bu değer 1-3 saniye aralığında ise başarılı olmanız için biraz daha çalışma yapmanız gerektiğini anlamalısınız. 3 saniyeden uzun bir FCP skoruna sahipseniz bu sizin açınızdan oldukça kötü bir puana sahip olduğunuz anlamına gelir. Kötü bir FCP skoru aldıysanız, yukarıda belirttiğim maddeleri tekrar gözden geçirin ve buna yol açan unsurları web sitenizden kaldırın. Büyük ihtimalle çok yüksek boyuta sahip bir görsel, harici çektiğiniz bir javascript buna yol açıyor olabilir.

Largest Contentful Paint (LCP)

LCP web siteniz tıklandığı an ile ilgili sayfadaki en yüksek boyutlu dosyanın yüklenmesinin bitişi arasındaki süreyi ölçen değerdir. Yani ilgili içerikteki en yüksek boyuta sahip öğe tamamen yüklenene kadar geçen süreyi Largest Contentful Paint olarak adlandırabiliriz. Bu süreç 2.5 saniyenin altında ise bu değer için puanınız güncel verilere göre oldukça başarılı demektir. Burada olumlu puan almanıza rağmen yine de bu puanı sıfıra yaklaştırmak için çalışmalarınıza devam etmenizi öneririm... Bu değer 2.5 - 4 saniye aralığında ise iyileştirmeler yapmanız gerektiğini belirtebilirim, burada aldığınız puan 4 saniye üzerinde ise ciddi bir geliştirme yapmanızın hayati önem taşıdığını belirtmemde fayda var. Largest Contentful Paint skorunu sayfanızın net açılma süresi olarak da değerlendirebilirsiniz. Yani size ait URL'ye ilk tıklama ile ilgili URL'nin tamamının yüklenmesi arasındaki süre olarak düşünebilirsiniz. Bu skoru iyileştirmek için yine yukarıda saydığım konuları gözden geçirebilirsiniz.

Cumulative Layout Shift (CLS)

Bir web sitesine tıklama yapıldığı ve sayfanın yükleme yaptığı andan itibaren yüklemesinin bittiği an sırasındaki kaymaları - düzen bozulmalarını ölçen bir algoritmadır. Yani ilgili web sayfası yüklenmeye başladıktan sonra diğerlerine göre daha geç yüklenen elemanların ilgili sayfanın düzenini bozup bozmadığını - içeriği okumayı zorlaştıran kaymalar yapıp yapmadığını ölçen hassas bir sistem olarak da belirtebiliriz. Bu konuda web sitesinin hızlı yüklenmesi yine çok önemli bir kriter olarak karşımıza çıkmakta. Bu yüzden içeriklerde kullandığımız görsellere en ve genişlik ölçüsü tanımı yapmalıyız. Bu sayfa yüklenirken ilgili içeriğe ait alanın boş bırakılıp altındaki içeriğin doğru yerinde gösterilmesini sağlar. Bu düzen kaymalarının önüne geçecek ve CLS skorumuzu 0 yani başarılı yapacaktır. CLS ölçümü yaptığınızda web sitenizin CLS skoru 0.1'in altında ise başarılı bir skora sahipsiniz demektir. Eğer bu skor 0.1 ile 0.25 arasında ise biraz iyileştirme ile CLS sorunlarınızın üstesinden gelebilirsiniz demektir. Ancak skorunuz 0.25'in üzerinde ise konuyla ilgili ciddi kafa yormanız gerektiğini anlayabilirsiniz.

Yazımda Pagespeed Insights ile ilgili değerleri öncelikli olarak basit şekilde, sonrasında ise teknik terimleri ile inceleyip sizlere aktarmaya çalıştım. Gördüğünüz üzere burada yapılan ölçümün amacını teknik kavramlar ile ele almadığımızda esas amacı hızlı, kullanıcıyı memnun eden, sorunsuz kodlamaya sahip bir web sitesine sahip olmak gibi yorumlayabiliriz. Özet olarak gördüğümüz kullanıcısını memnun eden, onlara kolay gezinim sağlayan ve iyi içerik sunan web sitelerinin değerli olduğudur. Bahsettiğim tüm değerler sadece açılış sayfanız için değil tüm içerikleriniz yani web sitenizde ziyaretçilere açık tüm sayfalar için geçerlidir. Yani sadece ana sayfanızı Pagespeed Insights üzerinde geçer not alır hale getirmenin yeterli olmayacağını da yeri gelmişken belirteyim. Web sitenize ait tüm sayfaları tek tek kontrol etmeli ve geçerli skoru aldığınızdan emin olarak SEO çalışmalarında başarılı olmak için yapmalısınız.

Pagespeed Insights skorlarınızı detaylı olarak sorgulayabileceğiniz ve çıkan sonuçlara göre önerilerimi bulabileceğiniz Pagespeed Insights Testi aracım ilginizi çekebilir.

SEO Danışmanlığında Takip Ettiğim Süreçler başlıklı yazımı okumak ister misiniz?

CLS - LCP ya da SEO konusunda profesyonel destek almak isterseniz bana ulaşın: 0(546) 586 74 76

Yorumlar
12/Mayıs/2021 (23:05:57) tarihinde Arda Sert yazdı:
Valla süper anlatim olmuş, elinize kolunuza sağlık...
Bu yoruma cevap yaz
Yorum Yazın
Yorumunuz
Eposta (Yayınlanmayacaktır)
İsim
Web Sitesi

Konuyla alakalı ilginizi çekebilicek içerikler:

Desteğe mi ihtiyacınız Var?

Eticaret ve SEO konularında profesyonel hizmeti bizden alabilirsiniz.

Eğitime mi ihtiyacınız Var?

Online SEO Eğitimi
Kendi siteniz üzerinden örnek anlatımlı 1:1 SEO eğitimi... Detaylar
Online Google ADS Eğitimi
Google ADS hesabınız üzerinden örnek anlatımlı 1:1 Google ADS eğitimi... Detaylar

Mert Şener Kimdir?

Eticaret ve SEO alanında 16 yıllık bir tecrübe ile yüzlerce firmaya hizmet vermiş, profesyonel bir geliştiricidir...