Tes Cumulative Layout Shift (CLS)
Tes Cumulative Layout Shift SEOptimer menampilkan CLS halaman Anda dibandingkan dengan ambang batas Google, menggunakan data lapangan Google sendiri dari pengunjung nyata.
Audit SEO Situs Apa Pun dalam Hitungan Detik
+ Alat SEO / GEO Komprehensif untuk Setiap Kebutuhan
Jalankan lebih dari 100 pemeriksaan di situs web Anda yang mencakup SEO On-Page, Kegunaan, Performa, Sosial, dan Tautan. Kini dengan GEO di setiap laporan. SEOptimer juga menawarkan riset kata kunci, pelacakan peringkat, backlink, dan perayap situs lengkap.
Tentang Cumulative Layout Shift
Apa itu Cumulative Layout Shift?
Cumulative Layout Shift mengukur seberapa banyak halaman berpindah-pindah saat dimuat. Setiap kali elemen yang terlihat berpindah ke posisi baru tanpa disebabkan oleh pengunjung, perpindahan tersebut dinilai, dan nilainya diakumulasikan.
Ini adalah metrik dengan gejala yang paling umum: Anda hendak mengeklik sebuah tautan, tetapi justru menekan sesuatu yang lain karena iklan atau gambar dimuat di atasnya dan menggeser halaman ke bawah.
Tidak seperti dua metrik lainnya, metrik ini tidak diukur berdasarkan waktu. Metrik ini merupakan rasio yang menggambarkan seberapa banyak bagian layar yang bergeser dan seberapa jauh pergeserannya. Itulah sebabnya angkanya kecil, dan skor 0.1 saja sudah menunjukkan adanya pergeseran yang terlihat.
Apa yang dianggap sebagai CLS yang baik?
Google menganggap nilai 0.1 atau kurang sebagai baik, nilai 0.1 hingga 0.25 sebagai perlu ditingkatkan, dan nilai di atas 0.25 sebagai buruk, berdasarkan persentil ke-75 dari pemuatan halaman yang sebenarnya.
Perubahan tata letak yang disebabkan langsung oleh pengunjung tidak dihitung. Membuka akordeon atau menutup banner menyebabkan halaman bergeser secara wajar, dan hanya pergeseran dalam waktu setengah detik setelah interaksi yang dimaafkan—kurang lebih merupakan rentang waktu ketika seseorang mengaitkan pergeseran tersebut dengan tindakannya sendiri.
Biasanya, metrik ini adalah yang paling mudah dicapai dari ketiganya. Jika LCP dan INP memerlukan peningkatan performa, sebagian besar perubahan tata letak dapat diperbaiki dengan menyediakan ruang terlebih dahulu, yang merupakan perubahan pada markup, bukan pada arsitektur.
Penyebab perubahan tata letak yang umum
- Gambar dan video tanpa atribut lebar dan tinggi, sehingga tidak ada ruang yang disediakan hingga elemen tersebut selesai dimuat.
- Iklan dan sematan yang dimasukkan ke dalam kontainer yang tidak memiliki ukuran yang ditetapkan.
- Font web ditampilkan dengan ukuran yang berbeda dari font fallback, sehingga teks mengalami reflow.
- Banner, pemberitahuan, dan bilah cookie yang disisipkan di atas konten yang sudah ada.
- Konten yang disisipkan oleh skrip setelah halaman selesai dirender.
Pola di balik semuanya sama: sesuatu muncul terlambat dan memerlukan ruang yang tidak disediakan sebelumnya. Semua yang berada di bawahnya terdorong ke bawah, dan apa pun yang hendak disentuh pengunjung berpindah.
Cara memperbaikinya
- Tetapkan lebar dan tinggi pada setiap gambar dan video agar browser mencadangkan ruangnya.
- Berikan slot iklan dan embed ukuran minimum tetap, meskipun kosong.
- Muat font utama terlebih dahulu dan sesuaikan metrik font fallback agar pergantian font tidak menyebabkan tata letak ulang.
- Sisipkan banner dan pemberitahuan di bawah konten yang sudah ada, atau tampilkan sebagai overlay alih-alih mendorong konten.
- Sisakan ruang untuk apa pun yang nantinya akan ditambahkan oleh skrip.
- Perhatikan hal ini di perangkat seluler, karena kolom yang sempit dapat mengubah pergeseran kecil menjadi pergeseran besar.
Yang diperiksa alat ini
Pengujian CLS membaca data lapangan Google untuk halaman tersebut—pengukuran yang dikumpulkan dari pengunjung nyata di Chrome—dan menunjukkan posisinya terhadap ambang batas di atas.
Jika tidak ada hasil yang ditampilkan, berarti trafik ke halaman tersebut tidak cukup bagi Google untuk melaporkannya. Sementara itu, pergeseran tata letak adalah satu-satunya metrik yang dapat Anda periksa secara manual dengan andal: muat halaman di ponsel dengan koneksi lambat, lalu perhatikan apa yang bergerak.
Untuk dua metrik lainnya, atau ketiganya sekaligus, gunakan Pengujian Core Web Vitals.
Ke mana selanjutnya
Sebagian besar pergeseran tata letak disebabkan oleh gambar dan aset yang dimuat terlambat. Periksa pengoptimalan gambar di halaman tersebut, ukurannya dengan pemeriksaan ukuran file halaman web, dan perilakunya di ponsel dengan pengujian responsif seluler.
Kotak Alat SEO Komprehensif dengan Lebih dari 55 Alat
Periksa Title, Meta Description, Heading, Schema, Core Web Vitals, SSL, dan Robots.txt. Buat Meta Tag, Sitemap, dan aturan .htaccess, lakukan minifikasi pada CSS, JS, dan HTML, serta buat draf konten dengan Alat Penulisan AI kami—secara instan dan gratis.
Bacaan Selengkapnya
Lihat Lebih Banyak
Core Web Vitals: What are They? How are They Crucial to SEO?
You should optimize your web pages for a seamless user experience. But how can you measure the quality of user experience on a site? That’...
SEOptimer's Core Web Vitals Checks
What are Core Web Vitals?
Google launched the Core Web Vitals (CWV) initiative in 2020 - "essential metrics for a healthy site". T...
Page Speed: What It Is, and How It Impacts SEO
What is Page Speed?
The term page speed refers to the amount of time your media content or web page will take to download from the...
Webpage Size - Why is it important? And how do you optimize it?
What is Webpage Size?
The term webpage size in the SEO world refers to the downloaded file size of a given web page.
The...