CLS (Cumulative Layout Shift)
Tanım
Cumulative Layout Shift (CLS, kümülatif düzen kayması), bir sayfa yüklenirken görünen içeriğin ne kadar yer değiştirdiğini ölçer; örneğin bir görsel ya da afiş belirip metni aşağı ittiğinde. Birimsiz bir puandır ve Google'ın iyi eşiği, ziyaretlerin 75. yüzdeliğinde 0,1 veya daha azdır. Kaymalar ziyaretçileri rahatsız eder ve butonlara yanlış dokunmaya yol açar.
Mağazanız için neden önemli
Ziyaretçi "Sepete ekle"ye uzanır, sayfa kayar ve onun yerine "Karşılaştır"a dokunur. Ya da bir açıklamayı okumaya başlar ve metin, geç gelen bir afişin altına atlar. Her kayma küçüktür; bir araya geldiklerinde mağazayı güvenilmez hissettirirler. Google bunları sayar ve toplamı bir sıralama sinyali olarak kullanır.
Nedenler neredeyse her zaman tekniktir ve neredeyse her zaman şablon düzeyinde düzeltilebilir. Tarayıcının yer ayırabilmesi için görsellerin boyutları belirtilmelidir. Yazı tiplerinin, gerçek yazı tipi geldiğinde metin yeniden akmasın diye benzer boyutta bir yedeği olmalıdır. Duyuru çubuğu ya da sohbet bileşeni gibi yüklemeden sonra eklenen her şey için aynı yükseklikte bir yer tutucu gerekir.
Kambloo bunu nasıl ele alıyor
Kambloo'nun vitrin bütçesi CLS'i 0,1'in altına koyar ve derleme hattı bunu her değişiklikte ölçer. Her görsel genişlik ve yükseklik ya da en boy oranı taşır; ürün görselleri sabit boyutlarda önceden üretilir, böylece tarayıcı dosya gelmeden doğru yeri ayırır.
Yükleme yer tutucularının (iskeletlerin) boyutları sabittir. Özel yazı tipi kullanan temaların, boyut ayarlı bir yedek yazı tipi sunması ve font-display swap kullanması gerekir; böylece geçiş sayfayı yeniden akıtmaz. Temalar kabul edilmeden önce bu kurallara karşı denetlenir.
Gerçek kullanıcı CLS değeri, hafif bir ölçüm betiğiyle toplanır ve mağazanın SEO sağlık raporunda gösterilir.
CLS (Cumulative Layout Shift) hakkında sorular
Bir mağaza sayfasında düzen kaymasına ne yol açar?
Genişlik ve yükseklik verilmemiş görseller, yüklemeden sonra sayfaya eklenen afiş ya da duyurular, farklı boyutta devreye giren web yazı tipleri ve içeriği aşağı iten reklam ya da bileşenler. Her biri, yer önceden ayrılarak düzeltilebilir.
Sayfa bana düzgün görünüyorsa CLS yine de sorun olabilir mi?
Olabilir. Kaymalar yükleme sırasında olur ve hızlı bir bağlantıda gözden kaçması kolaydır. Google'ın ölçtüğü şey, daha yavaş bağlantılardaki gerçek ziyaretçilerden gelen saha verisidir.