Bildiğiniz üzere Google için artık en önemli kriter hız.
Peki bunu nasıl sağlayacağız. "hızlı" hale getirmekten bahsettiğimiz olgular neler.
"Bu yazım da beta sürümdeki lighthouse 6 da bize sunulan 6 metriğin skorlarını sadece hangi maddeler üzerinden arttırabileceğimizi yazacağım. Maddelerin açıklamaları şimdilik yer vermeyeceğim."
Google ilk önce aşağıdaki önemli sorulara cevap vermemizi ister.
Gezinme başarıyla başlatıldı mı? Sunucu yanıt verdi mi?
Kullanıcıların etkileşime girebileceği yeterli içerik oluşturuldu mu?
Kullanıcılar sayfa ile etkileşime girebilir mi?
Etkileşimler doğal mı, gecikme var mı?
Biz Nasıl Ölçeceğiz ?
Google bu değerleri ölçmemiz için hem pagespeed insight üzerinden hem de beta olan lighthouse 6 üzerinden metrikler sunuyor. Bunlar ise;
First Contentful Paint (FCP)
Kısaca sayfanın yüklenmeye başlamasından sayfa içeriğinin herhangi bir bölümünün ekranda görüntülenmesine kadar geçen süreyi ölçer.
FCP Lighthouse 5 de %20'lik bir ağırlığa sahipken Lighthouse 6 ile %15'e inmiştir.
FCP zamanlaması olarak 0-2 saniye aralığında olursa yeşil, 2-4 saniye aralığında olursa turuncu, 4 saniye üzerinde olursa da kırmızı renk olarak gösteriyor.
Nasıl Yükseltiriz?
Google'ın FCP hesaplamasında kullandığı rehber maddeleri;
Largest Contentful Paint (LCP)
Lighthouse 6 ile hayatımıza girecek olan LCP kısaca, ekranda görünen en büyük içerik öğesinin oluşturma süresini bildirir.
LCP Lighthouse 5 de yokken Lighthouse 6 ile %25 olarak gelmiştir.
Google arama sayfası için ise;
Google'a göre en iyi LCP değerleri 2.5 saniye içerisinde gerçekleşmesi gerekmektedir.
En önemli kullandığı rehber maddeleri;
Ayrıca optimize etmek için kullandığı diğer rehber maddeleri;
First Input Delay (FID)
FID kısaca, kullanıcının sitenizle ilk etkileşimde bulunduğu zamanı (yani bir bağlantıyı tıkladığında, bir düğmeye dokunduğunda veya özel, JavaScript destekli bir kontrol kullandığında) tarayıcının bu etkileşime yanıt verebileceği süreyi ölçer.
FID Lighthouse 5 de %27 iken, Lighthouse 6 ile %15'e inmiştir.
Google'ın FID hesaplamasında kullandığı rehber maddeleri;
Time To Interactive (TTI)
TTI kısaca; sayfanın yüklenmeye başlamasından ana alt kaynaklarının yüklenmesine kadar geçen süreyi ölçmesi ve kullanıcı girişine hızlı bir şekilde güvenilir bir şekilde yanıt vermesidir.
TTI Lighthouse 5 de %33'lük bir ağırlığa sahipken Lighthouse 6 ile %15'e inmiştir.
Google'a göre iyi bir kullanıcı deneyimi sağlamak için, ortalama TTI 5 saniyeden az olmalıdır.
Google'ın TTI hesaplamasında kullandığı rehber maddeleri;
Total Blocking Time (TBT)
TBT kısaca; main thread bloklandığında FCP ve TTI arasındaki zamanı ölçer.
TBT Lighthouse 5 de yokken Lighthouse 6 ile %25 olmuştur.
Google'a göre iyi bir kullanıcı deneyimi sağlamak için, ortalama TTI 300 milisaniyeden az olmalıdır.
Google'ın TBT hesaplamasında kullandığı rehber maddeleri;
Cumulative Layout Shift (CLS)
Yeni metriklerden biri olan CLS kısaca; sayfanın yüklenmeye başlaması ile yaşam döngüsü sırasında aniden gerçekleşen her beklenmedik düzen kaymasının toplamını ölçer.
Bu metrik aslında sitede herhangi bir tuşa basacakken bir anda yüklenilmemesinden kaynaklı yeni gelen tuştur.
Yukarıdaki grafikte çerçevenin en altında yazı, beni tıkla tuşunun geç yüklenmesinden kaynaklı yüksekliği %25 kayar.
CLS Lighthouse 5 de yokken Lighthouse 6 ile %5 olmuştur.
Google'ın CLS hesaplamasında kullandığı rehber maddeleri;