Apa itu Cumulative Layout Shift (CLS) dan Bagaimana Optimasinya

Cumulative Layout Shift atau CLS adalah metrik yang menilai user experience pengguna website dengan cara menghitung tingkat halaman website mengalami pergeseran. Walaupun elemen web yang berpengaruh pada pengalaman pengguna bukan hanya satu, tetapi tetap saja CLS yang kurang baik juga memberikan dampak pada SEO. 

Pengaruh CLS pada SEO

CLS menjadi faktor yang mempengaruhi peringkat di Google dan mempengaruhi peforma website serta pengalaman pengguna. Bukan hanya itu, CLS juga menjadi metrik core web vitals. Sehingga, website dapat menerima sanksi bila standar Google tidak terpenuhi. 

Buruknya nilai CLS menunjukkan jika website kurang kredibel. Sehingga, pengunjung akan enggan membukanya lama-lama. Oleh sebab itu, optimasi website agar dapat memperoleh nilai CLS tinggi juga menjadi komponen penting dalam strategi SEO. 

Perlu diketahui, tingginya nilai CLS menandakan jika banyak pergeseran layout dari halaman website. Halaman yang sepenuhnya statis dapat memperoleh nilai rendah, bahkan sampai 0. Google sudah menetapkan standar untuk semua metrik. Berikut skor CLS yang bagus:

• Bagus. Kurang dari 0,1 menjadi nilai yang dapat diterima sesuai dengan standar Google. 

• Membutuhkan peningkatan. Sedangkan skor 0,1 hingga 0,25 memperlihatkan bila Anda harus melakukan sejumlah perubahan agar mengurangi pergeseran yang tidak terduga. 

• Buruk. Skor yang lebih dari 0,25 dapat menurunkan peringkat website dengan signifikan. 

Menariknya, satu website bisa saja mempunyai nilai CLS berbeda untuk setiap halaman web-nya, serta jenis tempat aksesnya. 

Penyebab Buruknya Nilai CLS

Buruknya nilai CLS pada halaman website disebabkan karena sejumlah elemen. Ada beberapa elemen yang dapat dicek untuk mengetahui penyebab buruknya nilai CLS, seperti:

• Iklan banner, iFrame, sematan, video, dan gambar yang ukurannya tidak ditentukan.

• Konten yang tidak menggunakan placeholder.

• Font kustom. 

Berbagai hal tersebut umumnya menunggu respons jaringan saat mengunggah elemen, sehingga pergeseran layout menjadi semakin besar, bahkan tidak terduga. 

Cara Mengoptimasi CLS

Ada beberapa cara yang dapat dilakukan untuk meningkatkan CLS. Berikut adalah poin-poin dan penjelasan ringkasnya:

1. Menentukan Dimensi Gambar

Seluruh elemen gambar dan video di website harus diatur ukuran lebar dan tingginya. Hal ini dilakukan agar dapat menghindari pergeseran yang tidak terduga. Namun, pada gambar responsif harus menggunakan rasio lebar serta tinggi yang sama, sehingga browser dapat menghitung ruang yang dibutuhkan untuk menampilkan gambar dengan baik. 

2. Atur Lebar serta Tinggi Iklan Banner

Iklan banner dapat mendorong konten yang dilihat pengguna, dan menyebabkan layout bergeser. Jika hal ini terjadi, user experience website menjadi tidak optimal. Agar dapat menghindarinya, Anda dapat menyiapkan ukuran ruang terlebih dahulu sehingga nilai CLS akan optimal dan tidak mengalami penurunan. 

Anda juga dapat mengatur gaya elemen sebelum tag iklan dibuat, sehingga iklan banner tidak akan mendorong konten yang berada di layar. Langkah ini juga dapat dilakukan ketika iklan mengisi seluruh baris dan kolom halaman. 

Konklusi

Setelah mengetahui berbagai langkah yang dapat dilakukan untuk meningkatkan CLS, tentu hal tersebut tidak bisa dilakukan dengan cepat. Apalagi bila perusahaan Anda tidak memiliki tim khusus di bidang ini. 

Karena begitu pentingnya CLS untuk optimasi website, Anda dapat menyerahkan masalah CLS ini pada agensi digital profesional. WEBARQ dapat dijadikan sebagai pilihannya!

Memiliki pengalaman selama 10 tahun, WEBARQ akan membuat website Anda memiliki skor CLS yang bagus. Jadi, tunggu apalagi? Bersama dengan WEBARQ, optimasi website dapat dilakukan dengan lebih mudah!