Title: Kümülatif Düzen Kayması (CLS) Author: Kriko Published: 8 Mart 2021 Last modified: 12 Temmuz 2026 --- 1. [Anasayfa](https://kriko.io/tr/) / 2. [Sözlük](https://kriko.io/tr/sozluk) / 3. K Harfi # Kümülatif Düzen Kayması **(CLS)** Kümülatif düzen kayması (Cumulative Layout Shift - CLS), bir web sayfasının yüklenmesi esnasında sayfadaki resim, video, yazı gibi ögelerin titremesi, kayması ya da değişmesidir. **Kümülatif düzen kayması**, İngilizcede Cumulative Layout Shift olarak adlandırılan ve CLS şeklinde kısaltılan, bir web sayfasındaki görsel stabiliteyi ölçen Core Web Vitals metriğidir. Sayfa yüklenirken veya kullanıcı sayfada gezinirken görsel öğelerin beklenmedik şekilde yer değiştirmesi CLS skorunu etkileyebilir. Örneğin bir kullanıcı makale okurken üst alandaki reklam, görsel, video veya banner geç yüklenirse, okunan metin bir anda aşağı kayabilir. Bu durum kullanıcı deneyimini olumsuz etkileyen tipik bir düzen kayması örneğidir. CLS, özellikle kullanıcının sayfadaki içerikle etkileşim kurduğu anlarda önemlidir. Bir haber yazısı okurken metnin aşağı kayması, bir e-ticaret sitesinde ürüne tıklamak üzereyken butonun yer değiştirmesi veya form doldururken alanların aniden kayması kullanıcıyı rahatsız eder. Bu tür kaymalar yalnızca görsel bir sorun değildir; yanlış tıklamalara, satın alma sürecinin bozulmasına ve kullanıcının sayfadan ayrılmasına da neden olabilir. Bu nedenle CLS, kullanıcı deneyimi ve sayfa kalitesi açısından kritik bir metriktir. Google, CLS’yi Core Web Vitals metriklerinden biri olarak değerlendirir. Core Web Vitals; sayfa yüklenme performansı, etkileşim hızı ve görsel stabilite gibi kullanıcı deneyimiyle ilişkili temel alanları ölçmek için kullanılır. CLS bu üçlü içinde görsel stabilite tarafını temsil eder. Yani sayfanın yalnızca hızlı açılması değil, açılırken ve kullanılırken düzeninin stabil kalması da önemlidir. CLS skoru için genel kabul gören eşikler vardır. 0,1 veya daha düşük CLS değeri iyi kabul edilir. 0,1 ile 0,25 arasındaki değerler geliştirilmesi gereken aralık olarak değerlendirilir. 0,25’in üzerindeki CLS skorları ise zayıf kullanıcı deneyimine işaret eder. Bu değerler PageSpeed Insights, Lighthouse, Chrome User Experience Report ve Google Search Console’daki Core Web Vitals raporları üzerinden takip edilebilir. Kümülatif düzen kaymasının en yaygın nedenlerinden biri, boyutları tanımlanmamış görsel ve video öğeleridir. Bir görselin genişlik ve yükseklik değerleri belirtilmezse, tarayıcı bu alan için önceden yer ayıramayabilir. Görsel yüklendiğinde sayfadaki diğer içerikler aşağıya veya yana kayabilir. Bu sorunu azaltmak için görsellerde` width` ve `height` değerleri tanımlanmalı veya CSS ile uygun aspect ratio alanı ayrılmalıdır. Reklam alanları, embed içerikler ve iframe kullanımları da CLS sorunlarına yol açabilir. Özellikle haber siteleri, bloglar ve reklam yoğunluğu yüksek yayıncı sitelerinde geç yüklenen reklam kutuları sayfa düzenini bozabilir. Reklam alanları için önceden sabit bir yükseklik ayrılmadığında, reklam yüklendiği anda içerik kayabilir. Bu nedenle reklam, video, harita, sosyal medya gömüleri ve benzeri dinamik alanlar için sayfa içinde önceden yer ayrılması önemlidir. Geç yüklenen fontlar ve dinamik içerikler de düzen kaymasına neden olabilir. Web fontları geç yüklendiğinde metin görünümü değişebilir ve satır uzunlukları farklılaşabilir. Benzer şekilde çerez bannerları, kampanya pop-up’ları, bildirim alanları veya sonradan eklenen öneri modülleri sayfanın mevcut düzenini iterek CLS değerini artırabilir. Bu öğeler mümkün olduğunca sayfa düzenini bozmayacak şekilde konumlandırılmalı ve kullanıcıya beklenmedik bir kayma yaşatmamalıdır. CLS’i iyileştirmek için öncelikle hangi öğelerin kaymaya neden olduğu tespit edilmelidir. PageSpeed Insights ve Lighthouse raporları bu konuda başlangıç analizi sunabilir. Ancak gerçek kullanıcı verileri de mutlaka takip edilmelidir; çünkü laboratuvar testlerinde görünmeyen bazı reklam, cihaz, bağlantı hızı veya kullanıcı davranışı kaynaklı kaymalar gerçek kullanıcı deneyiminde ortaya çıkabilir. Bu nedenle CLS analizi hem test ortamı hem de saha verileriyle birlikte yapılmalıdır. Kısacası **Cumulative Layout Shift**, bir web sayfasının görsel olarak ne kadar stabil kaldığını ölçen önemli bir kullanıcı deneyimi metriğidir. Düşük CLS skoru, kullanıcının sayfada daha rahat okuma, gezinme, tıklama ve işlem yapma deneyimi yaşamasına yardımcı olur. Görsel boyutlarının tanımlanması, reklam ve iframe alanları için yer ayrılması, font yüklemelerinin optimize edilmesi ve dinamik içeriklerin dikkatli yönetilmesi CLS performansını iyileştirmek için temel adımlardır. ## Sözlükte keşfedin ### Arama Motoru Pazarlaması (SEM) Arama motoru pazarlaması (Search Engine Marketing - SEM), arama motoru sonuç sayfalarında kullanıcıların karşısına çıkan ücretli reklamlardır. ### Hreflang Etiketi Hreflang etiketi, içeriklerinizin farklı dil ve bölge hedeflerine de ulaşmasını sağlayabilen bir HTML kodudur. ### Genişletilebilir İşaretleme Dili (XML) Genişletilebilir işaretleme dili (Extensible Markup Language – XML), en basit ifade ile bir dosyadaki çeşitli verileri tanımlamak için sözdizimi etiketlerini kullanan bir dildir. ### Perakende Analitiği Perakende analitiği, perakende sektöründeki verileri analiz etme ve anlama sürecidir. Tam olarak perakende işleyişini tanımlamaktadır. ### Google İndeks Google indeks (Google Index), Google arama sonuçlarında yer almanızı sağlar. ### R Programlama Dili R, istatistik ve veri analizi alanlarında kullanın bir programlama dilidir. Açık kaynaklı bir yazılım olmasında dolayı içerisinde pek çok paket ve kütüphane içermektedir. ### İçerik Stratejisi İçerik stratejisi (Content Strategy), basılı ya da dijital yayında yer alan içeriklerin planlanması, geliştirilmesi ve yönetilmesi anlamına geliyor. ### NoSQL İlişkisel olmayan veri tabanı anlamına gelen NoSQL, verileri depolamak ve almak üzerine yönetilen bir veri tabanı sistemidir. Modern uygulamalar yaratmaya uygun olup esnek şema modellerine sahiptir. ### Sayfa Gösterimi Sayfa gösterimi (Page View), internet kullanıcılarının web sitenizdeki sayfaları gezmesi ve gün içerisinde bu sayfalara birden fazla kez girmesine deniyor. ## Dijitalin nabzını bizimle takip et Dijital dünyayı şekillendiren seçilmiş içgörüler, haberler ve fikirlerden haberdar olmak için abone olun. Bu kutucuğu işaretleyerek [gizlilik ve aydınlatma](https://kriko.io/tr/gizlilik-politikasi) metnimizi kabul ettiğinizi onaylamış olursunuz.