21.07.2022
Cumulative Layout Shift (CLS) yani kümülatif düzen kayması, core web vitals metriklerinden biridir. CLS, bir web sitesi indirilmeye devam ederken öğelerin konumlarının kaymasını yani görsel kararlılığını ölçen bir metriktir. Düzen kaymasına sebep olabilecek öğeler; videolar, resimler, formlar, düğmeler ve farklı içerik türleridir.
Cumulative Layout Shift birçok sebepten olabilir:
Bunların dışında, site hızının çok düşük olması ve HTML üzerinde width ve height değerlerinin girilmemesi görsel kararlılığı kötü yönde etkiler bu da CLS’ in yükselmesine sebep olur.
CLS metriğini ölçmek için kullanabileceğimiz toollardan biri Google PageSpeed Insights’tır. Bunun dışında kullanabileceğimiz bir diğer tool ise Google Chrome Lighthouse eklentisidir. Peki CLS’in varlığını tool kullanmadan anlayabilir miyiz? Evet, sitemizi ilk yüklemeye başladığımızda büyük öğelerdeki kaymaları fark edebiliriz daha net bir şekilde fark edebilmek için, siteyi yüklemeyi düşük internet hızında başlatmak yeterlidir.
CLS sorununu ortadan kaldırmak için öncelikle sitemizde görsel kararlılığı korumamız gerekmektedir. Örnek olarak görsellerden bahsedecek olursak, eğer width ve height değerlerini HTML üzerinde belirlemezseniz sayfa yüklenene kadar görselin olduğu kısıma görselden önce gelen öğe yüklenecektir. Görsel yüklendikten sonra, görsel kendi yerine geçecek ve onun yerine gelen öğe aşağı kayacaktır. Peki görsellerin width height değerlerini HTML üzerinde belirlersek responsive açıdan sıkıntı yaratmayacak mı? diye herkes düşünmeye başladı. Doğru bir düşünce, sadece HTML üzerinden belirlersek mobilde görseller sorun yaratacak. Bundan dolayı img etiketleri için aşağıdaki css kullanmamız gerekli;
img
{
width: 100%;
height: auto;
}
Detaylı bilgi için aşağıdaki videoyu izleyebilirsiniz.
CLS değerini düşürmek ve bu sorunları onarmak için CSS’in font-display özelliğini ve auto, optional, swap gibi kodları kullanabilirsiniz.
font-display: auto;
0.0 – 0.1 | 0.1 – 0.25 | 0.25++ |
Başarılı | Geliştirmeye Açık & Kabul Edilebilir | Başarısız |
SEO sadece doğru içerik planlaması ve anahtar kelime optimizasyonu ile sıralama elde edilen bir konumdan çıkalı uzun yıllar oldu. Artık Google Anahtar kelime üzerinden doğru hedefleme ve kullanıcı deneyimi iyi olan sayfaları ilk sıralara çıkarıyor. Kullanıcı deneyimini ölçümlemek için core web vitals gibi çekirdek güncellemesi ile hayatımıza CLS metriği girdi. Eğer siteniz hızlı yükleniyor ve görsel kararlılığı yüksek ise sitemize giren kullanıcı daha fazla oturum süresi geçiriyor ve buda hemen çıkma (Bounce Rate) oranlarımıza yansıyor.
Perfist Blog
Benzer Yazılar
Arama Niyeti (Search Intent) Nedir? Arama niyeti (Search Intent), kullanıcıların bir sorguyu gerçekleştirirken ulaşmak istediği asıl amacı ifade eder. Google ve diğer arama motorları, yalnızca kelimeleri değil, bu kelimelerin bağlamını ve kullanıcının ne aradığını anlamaya odaklanır. Arama niyeti, bilgilendirici, gezinsel, ticari araştırma ve işlemsel olmak üzere dört ana kategoriye ayrılır. Kullanıcılar bazen bilgi edinmek, bazen […]
Devamını Oku
Mid Level SEOSemantik SEO Nedir? Semantik SEO, arama motorlarının kullanıcı niyetini daha iyi anlamasına yardımcı olan bir optimizasyon yöntemidir. Bu yaklaşım, kelimeler arasındaki anlam ilişkisini, bağlamı ve kullanıcı sorgularının arkasındaki amacı analiz ederek içeriklerin daha doğru eşleşmesini sağlar. Dijital pazarlama alanında uzun süre çalışan bir ekip olarak edindiğimiz tecrübeye dayanarak söyleyebiliriz ki, semantik SEO stratejisiyle oluşturulan içerikler, […]
Devamını Oku
Senior Level SEOYapısal Veri Nedir? Yapısal veri, arama motorlarının bir web sitesinin içeriğini daha iyi anlaması için kullanılan kodlama sistemidir. JSON-LD, Microdata gibi formatlarla uygulanır ve siteye ürünler, etkinlikler, işletme bilgileri gibi detaylı bilgilerin anlaşılır şekilde sunulmasını sağlar. Bu, özellikle e-ticaret siteleri için, ürünlerin özelliklerini ve faydalarını doğru aktarmak açısından büyük bir avantaj sunar. SEO açısından yapısal […]
Devamını Oku
Mid Level SEOSite Hızı Nedir? Site hızı, bir web sayfasının ne kadar hızlı yüklendiğini ifade eder.(Site hızının içinde birden fazla faktör vardır. Bunlardan en önemlileri ilk yüklenme süresi ve yüklenme hızıdır.) Bu hız, ziyaretçilerin deneyimini doğrudan etkiler. Yavaş yüklenen bir site, kullanıcıların siteden çıkmasına ve başka sayfaları tercih etmesine neden olabilir. Aynı zamanda, arama motorları site hızını […]
Devamını Oku
Mid Level SEO