Mengenal Apa itu LCP, FID, dan CLS

Sekarang ini Google secara bertahap memang sudah mengimplementasikan berbagai macam kriteria baru agar bisa menentukan apakah website tersebut layak memperoleh posisi teratas atau tidak. Serangkaian faktor penting sengaja digunakan Google agar bisa menentukan UX atau User Experience di halaman website. 

Google Page Experience Update

Google Page Experience update ini adalah sejumlah faktor resmi yang dipergunakan oleh Google agar bisa menentukan posisi dari website di halaman pencarian. Mengingat Google mempergunakan core web vitals untuk menentukan page experience dari halaman, agar bisa meningkatkan performa website menjadi langkah yang harus Anda ambil. 

3 Pilar Page Experience

Pada dasarnya page experience ini akan mempengaruhi kenyamanan dan pengalaman pengunjung ketika mengakses sebuah website dan akan mempengaruhi peringkat website di pencarian Google. 

Google menilai jika pengalaman pengunjung jauh lebih berarti bila dibandingkan dengan konten menarik. tetapi, bukan berarti konten tidak penting diperhatikan, karena kualitas konten juga menentukan kenyamanan pengunjung. Berikut sejumlah pilar page experience, antara lain:

• Kecepatan loading website

• Response elemen di website

• Layout yang stabil. 

Apa itu LCP, FID, dan CLS?

Dalam core web vitals, terdapat indikator yang harus diperhatikan, seperti: 

1. LCP: Largest Contentful Paint

Indikator LCP erat kaitannya dengan kecepatan website. LCP merupakan waktu yang dibutuhkan untuk elemen website yang besar dimuat di sebuah halaman web. Elemen besar yang ada dalam LCP bukan hanya video atau gambar yang mempunyai muatan besar, tetapi juga tulisan panjang. 

 

Pada LCP, nantinya Google akan melakukan evaluasi kinerja web ketika pengunjung mengakses web tersebut. Load website yang dinilai optimal, maksimal hanya 2.5 detik semenjak pengunjung melakukan akses website pertama kali. 

 

Hal ini dilakukan agar dapat memberi pengalaman baik ke pengunjung. Dari PageSpeed Insight, kamu bisa melihat apa saja elemen yang menjadi penghambat LCP. Ada beberapa optimasi yang bisa dilakukan agar bisa meningkatkan skor LCP, seperti:

• Meningkatkan waktu loading web

Agar bisa memperoleh load time yang cepat, Anda dapat menggunakan CDN, serta memilih mana lokasi server yang sesuai dengan mayoritas pengunjung web Anda. 

• Mengoptimalkan ukuran file

Pengoptimalan ukuran file di website bisa dilakukan dengan mengkompres file gambar, dan sejumlah format lain. 

• Mengurangi ukuran text

Selain sejumlah hal di atas, Anda dapat melakukan optimasi file dengan bentuk teks seperti CSS, HTML, serta JavaScript agar menggunakan kompresi lebih ringan seperti Brotli dan GZIP. 

 

2. FID: First Input Delay

Berikutnya adalah FID. FID merupakan indikator yang nantinya akan menilai interaksi dari kecepatan respons yang berada di website antara pengunjung dan sejumlah elemen di website Anda. 

 

Nantinya FID akan bekerja dengan memberi skor saat pengunjung mengakses sebuah halaman website. Contohnya seperti mengklik link. Membuka foto dan lainnya. FID akan menilai kecepatan respons di klik pertama pengunjung, sehingga bukan dari sisi zoom dan scrolling. 

 

Nilai ideal dari FID adalah kurang dari 100 milidetik. Agar bisa mempertahankan pengalaman pengunjung. Bila respon web lama, hal tersebut akan menurunkan kualitas pengalaman pengunjung. 

 

Pada umumnya, buruknya FID disebabkan karena browser memuat script besar, oleh sebab itu tidak bisa mengeksekusi perintah yang diberikan penggunaan saat itu juga. Saat website sedang membuat script, perintah lainnya akan masuk ke antrean yang dieksekusi. 

 

Oleh sebab itu, untuk meningkatkan FID dapat dilakukan dengan meningkatkan file JavaScript. Jika tidak terdapat file JavaScript yang tersusun efisien, skor FID tidak bisa menembus angka 100 milidetik. 

 

Agar bisa menemukan mana JavaScript yang harus dioptimalkan kinerjanya, Anda dapat mencari kolom eliminate render di halaman Page Speed Insight.

3. CLS: Cumulative Layout Shift

CLS nantinya akan menilai kestabilan dari sebuah konten website seperti gambar iklan, tata letak, sampai artikel. Nantinya CLS akan menilai apakah terdapat pergeseran yang tidak diduga pada website ketika proses loading. 

 

Indikator ini dipergunakan untuk mengukur adanya perubahan yang terjadi di website saat diakses. Pengukuran CLS untuk perpindahan layout adalah 0.1 detik sesudah input yang dilakukan oleh pengunjung. 

 

Bayangkan saja jika Anda mengakses sebuah website dan terdapat gambar bergerak atau ketika proses loading, terdapat gambar bergeser, pasti akan menurunkan kenyamanan bukan. Untuk meningkatkan CLS ini, berikut hal yang bisa dilakukan:

 

• Pengaturan dimensi gambar

Media dan gambar yang tidak ditentukan ukurannya bisa menyebabkan pergerakan elemen lain ketika waktu loading website berjalan. Oleh sebab itu pastikan Anda mengatur dimensi gambar dengan baik. 

 

• Tentukan ruang khusus untuk iklan

Bila tampilan iklan berubah-ubah, hal ini dapat menginterupsi sejumlah elemen lain. Bukan hanya itu, tampilan iklan yang kurang konsisten juga dapat menurunkan UX atau User Experience. 

 

• Mengatur ruang embeds

Bila Anda meng-embed file berukuran besar, terdapat kemungkinan elemen lain berada di dalam lebih dulu. Hal ini bisa menyebabkan kurang stabilnya visual halaman. 

 

• Mengaktifkan preload

Selain sejumlah langkah di atas, ANda juga dapat mempercepat waktu pengunduhan font dengan menggunakan font loading API, dan mengaktifkan fitur preload. Sehingga tampilan teks akan lebih konsisten. 

Alat Untuk Menganalisa Performa Core Web Vitals

Setelah memahami bagian dari core web vitals, hal menarik lain yang harus dibahas adalah cara mengecek performa core web vitals ini. Untuk menganalisa core web vitals, berikut sejumlah alat yang dapat digunakan, antara lain:

1. Google Search Console

Sebenarnya, agar website bisa dikenali Google serta pada akhirnya dapat muncul di halaman pencarian, Anda harus mendaftarkan web di Google Search Console terlebih dulu. Tools ini bisa digunakan untuk mengecek indikator core web vitals. 

 

Untuk mendaftarkan website di Google Search Console, berikut langkah yang dapat dilakukan, yaitu:

• Lakukan verifikasi dari cPanel

• Login melalui namadomain/cpanel

• Klik editor, kemudian klik manage di domain yang nantinya di setting

• Buat txt record

2. PageSpeed Insight

Cara lain yang dapat digunakan adalah melalui PageSpeed Insight. Nantinya tools ini akan digunakan untuk mengecek skor dari core web vitals. Tools ini dapat melaporkan core web vitals yang berada di perangkat seluler dan desktop. Berikut langkahnya:

• Akses PageSpeed Insights

• Masukkan nama domain di kolom tersebut

• Klik Analyze

• Nantinya akan tampil hasil analisa

Meskipun telah mengetahui langkah untuk menganalisa core web vitals, hingga sejumlah detail yang ada di dalamnya, tetapi menerapkan berbagai hal di atas tentu tidak mudah seperti yang dibayangkan.

Lebih-lebih jika belum pernah berpengalaman sebelumnya, pasti akan ada kesulitan-kesulitan tersendiri. Agar dapat mengatasi hal tersebut, Anda dapat menyerahkannya pada WEBARQ. Berpengalaman dalam dunia pengembangan, keamanan dan konten website selama 10 tahun lamanya, WEBARQ akan membantu Anda untuk mengelola website dengan baik. 

Bahkan, hingga sekarang WEBARQ sudah mengelola website sejumlah perusahaan besar. Jadi, tunggu apalagi? Ikuti kesuksesan web besar tersebut bersama dengan WEBARQ sekarang juga.