Core Web Vitals: Pengertian, Fungsi, Tools, & Cara Optimasi

Banyak faktor yang dapat memengaruhi sebuah website untuk mencapai halaman pertama Search Engine Result Page (SERP), salah satunya yaitu core web vitals.

Core web vitals adalah salah satu bagian dari teknikal SEO yang penting untuk diperhatikan agar website bisa bekerja secara optimal.

Nah, bagi Anda yang masih belum memahami apa itu core web vitals, artikel ini telah merangkum semua informasinya untuk Anda. Oleh karena itu, yuk simak penjelasannya sampai habis!

Apa itu Core Web Vitals?

Pada tahun 2021, Google meluncurkan page experience update yang menjadikan core web vitals sebagai salah satu sinyal dalam sistem peringkatnya.

Adapun pengertian Core web vitals (CWV) adalah kumpulan beberapa metrik yang menjadi bagian dari sinyal page experience Google untuk mengukur pengalaman pengguna saat memuat dan berinteraksi dengan halaman situs Anda.

Keefektifan yang dimaksud mencakup loading speed, respons tiap elemen, dan stabilitas layout pada halaman web Anda.

Hingga kini, core web vitals tetap menjadi bagian penting dari SEO teknis. Meski begitu, Google menegaskan bahwa relevansi dan kualitas konten tetap lebih menentukan peringkat.

Pentingnya Core Web Vitals dalam SEO

Jika ingin mendapatkan ranking di SERP, terdapat beberapa faktor yang harus Anda maksimalkan. Nah, dalam SEO sendiri, upaya ini dilakukan melalui strategi on-page, off-page, dan juga technical.

Ketiga strategi tersebut sama-sama penting dan memiliki porsi sendiri-sendiri, sehingga harus dioptimalkan secara beriringan.

Nah, core web vitals sendiri masuk dalam kategori strategi technical SEO yang membantu meningkatkan performa website melalui sisi teknikal.

Skor core web vitals yang baik mengindikasikan bahwa situs tersebut memberikan pengalaman yang nyaman bagi pengguna, dan hal ini menjadi salah satu pertimbangan Google saat menentukan peringkat.

Namun sebagai catatan, di samping mengoptimalkan core web vitals, Anda juga harus meningkatkan kualitas konten dan memaksimalkan strategi off-page SEO.

Fungsi Core Web Vitals

Apa pentingnya core web vitals? CWV penting bagi website karena memiliki fungsi yang sangat vital. Adapun fungsi core web vitals adalah sebagai berikut:

1. Meningkatkan dan Mengoptimalkan SEO

Salah satu cara untuk meningkatkan dan mengoptimalkan SEO adalah dengan memantau skor LCP, INP, dan CLS.

Jika semua metrik tersebut memiliki skor yang baik, peluang website Anda bersaing di SERP ikut terbantu, terutama ketika kualitas konten Anda setara dengan pesaing.

2. Memastikan Kestabilan Website

Core web vitals memungkinkan Anda memantau kualitas dan stabilitas website. Hal ini penting karena berkaitan dengan User Experience (UX) saat mengunjungi website Anda.

Jika website stabil, maka pengunjung akan nyaman ketika menjelajahi situs Anda, dan tentunya ini akan memberikan dampak baik bagi website.

Namun sebaliknya, jika website tidak stabil, maka hal ini akan mengganggu pengalaman pengguna dan memengaruhi kepercayaannya terhadap situs Anda.

3. Meningkatkan Jumlah Pengunjung

Seperti yang sudah disebutkan sebelumnya, core web vitals yang dioptimasi dengan baik dapat membantu ranking website di SERP dan membuat pengunjung betah.

Nah, secara tidak langsung, hal tersebut akan berpengaruh pada naiknya jumlah pengguna yang mengunjungi situs Anda.

Metrik Utama Core Web Vitals

Pada dasarnya, penilaian dari Google dapat diklasifikasikan menjadi tiga jenis, yaitu good (baik), needs improvement (perlu perbaikan), dan poor (buruk).

Nah, semua penilaian ini dilakukan menggunakan metrik core web vitals yang meliputi:

1. LCP (Largest Contentful Paint)

Largest Contentful Paint (LCP) adalah waktu interval antara mulainya proses loading halaman dengan elemen gambar atau teks terbesar yang dapat di-render secara menyeluruh.

Sederhananya, LCP merupakan waktu tunggu user setelah ia membuka sebuah halaman hingga elemen konten terbesar di area layar yang terlihat (viewport), misalnya gambar utama atau blok judul, selesai ditampilkan.

Adapun fungsi utama dari LCP adalah mengukur kecepatan loading situs untuk menilai tingkat pengalaman pengguna. Nah, untuk mengukur LCP ini, Anda bisa menggunakan PageSpeed Insights.

2. INP (Interaction to Next Paint)

Interaction to Next Paint (INP) adalah metrik dari core web vitals yang berfungsi untuk menilai kecepatan situs dalam merespons seluruh interaksi pengguna selama kunjungan. Sejak 12 Maret 2024, INP menggantikan First Input Delay (FID) sebagai metrik core web vitals. Adapun input tersebut dapat berupa:

• Klik tombol menu
• Klik navigasi website
• Klik submit
• Klik video, gambar, atau media lainnya dalam website
• Ketukan (tap) di layar sentuh
• Penekanan tombol keyboard, misalnya saat mengetik di kolom formulir

3. CLS (Cumulative Layout Shift)

Cumulative layout shift merupakan metrik dalam core web vitals yang berfungsi untuk menilai tingkat stabilitas situs.

Jika elemen pada halaman Anda bergerak atau berpindah tempat secara tak terduga, baik saat proses loading maupun ketika halaman sedang digunakan, maka nilai CLS akan meningkat.

Semakin tinggi nilai CLS, maka semakin buruk penilaian dari Google page experience. Situs yang baik adalah situs yang mempunyai tingkat kestabilan pada tampilan visual pada saat proses loading berjalan.

Tools untuk Memeriksa Core Web Vitals

Ilustrasi Google Search Console (Firmbee/Unsplash)

Melihat pentingnya core web vitals bagi website, mungkin kini Anda penasaran bagaimana cara memeriksa skornya. Soal ini, Anda bisa menggunakan beberapa tools, di antaranya yaitu:

1. Google Search Console (GSC)

Google Search Console (GSC) merupakan tools yang disediakan oleh Google untuk membantu proses maintenance dan manajemen traffic situs.

Selain itu, GSC juga bisa digunakan untuk memeriksa core web vital secara kontinu berdasarkan data dari Chrome User Experience Report (CrUX).

Di GSC, buka laporan Core Web Vitals untuk melihat URL yang tergolong baik, perlu perbaikan, atau buruk, baik untuk versi seluler maupun desktop.

Perlu dicatat, laporan Page Experience dan Mobile Usability sudah dihentikan dari GSC sejak akhir 2023. Yang masih tersedia adalah laporan Core Web Vitals dan HTTPS, sedangkan pengecekan tampilan seluler kini disarankan memakai Lighthouse atau PageSpeed Insights.

2. PageSpeed Insights

Tool kedua yang dapat Anda manfaatkan untuk memeriksa core web vitals adalah PageSpeed Insights.

PageSpeed Insights menyajikan beberapa data terkait elemen atau fitur apa saja yang perlu di-improve dan dilakukan perbaikan guna mempercepat loading speed dan UX.

Dilihat dari kegunaannya, PageSpeed Insights juga berfungsi untuk mengaudit kesehatan website Anda.

Sejak Lighthouse 10 (2023), skor performa di PageSpeed Insights dihitung dari lima metrik berikut. Time to Interactive (TTI) yang sebelumnya ikut dinilai sudah dihapus.

• First Contentful Paint
• Speed Index
• Largest Contentful Paint
• Total Blocking Time
• Cumulative Layout Shift

Cara Mengoptimalkan Core Web Vitals

Terdapat beberapa langkah untuk mengoptimalkan core web vitals secara maksimal. Adapun di antaranya, yaitu:

1. Optimasi LCP

Website Anda bisa dikatakan memiliki LCP yang baik apabila elemen konten terbesarnya tampil dalam 2,5 detik atau kurang. Nah, untuk mencapai waktu loading tersebut, Anda bisa melakukan strategi optimasi yang mencakup:

• Optimasi file dengan mengompres ukuran file gambar dan memakai format modern seperti WebP. Terapkan lazy load hanya untuk gambar di bawah layar pertama; jangan terapkan pada gambar utama (elemen LCP) karena justru memperlambatnya.
• Perbaiki render blocking pada CSS dan JavaScript.
• Gunakan Content Delivery Network (CDN) atau plugin seperti Autoptimize (untuk WordPress) untuk mempercepat page speed website Anda.
• Gunakan JavaScript seefisien mungkin untuk mempermudah proses rendering dari sisi browser.

2. Optimasi INP

Skor INP bisa dikatakan baik apabila respons interaksi pada website Anda terjadi dalam 200 ms (millisecond) atau kurang. Nilai 200–500 ms perlu perbaikan, sedangkan di atas 500 ms tergolong buruk.

Cara mengoptimalkannya antara lain mengurangi JavaScript yang tidak diperlukan, memecah long task (tugas JavaScript yang berjalan lebih dari 50 ms) menjadi bagian yang lebih kecil, menunda script pihak ketiga yang tidak penting, dan menjaga struktur DOM tetap ramping. Dengan begitu, browser bisa lebih cepat menampilkan respons setelah pengguna berinteraksi.

3. Optimasi CLS

Skor CLS dapat dikatakan baik apabila memiliki nilai cumulative layout shift 0,1 atau kurang. Untuk mencapainya, cantumkan atribut width dan height (atau aspect-ratio di CSS) pada gambar, video, dan iframe, sediakan ruang tetap untuk iklan atau banner, dan hindari menyisipkan konten baru di atas konten yang sudah tampil.

Demikian penjelasan mengenai core web vitals beserta fungsi, pentingnya bagi SEO, metrik yang digunakan, hingga cara mengoptimalkannya.

Kesimpulannya, core web vitals adalah sekumpulan metrik yang dipakai Google untuk menilai pengalaman pengguna di halaman website Anda.

Adapun metrik yang digunakan untuk mengukur core web vitals adalah LCP, INP, dan CLS. Ketiga metrik tersebut berkaitan erat dengan technical SEO.

Oleh karena itu, untuk mengoptimalkan core web vitals, Anda perlu mengimplementasikan strategi technical SEO.

Kalau Anda ingin strategi SEO Anda makin tajam dan terarah, Tim Sitespirit siap membantu! Mulai dari:

• Jasa pembuatan website
• Jasa desain website
• Jasa maintenance website
• Jasa SEO

Ingin berkonsultasi? Bisa langsung hubungi kami via WhatsApp atau isi form di halaman ini. Yuk, optimasi website Anda sekarang juga!