Core web vitals adalah metrik yang berasal langsung dari Google untuk menjadi panduan peningkatan performa website. Tujuan akhirnya yaitu membuat pengguna merasa nyaman karena dapat mengunjungi suatu website dengan stabil dan cepat.
Google menggunakan banyak indikator untuk menentukan peringkat sebuah website di hasil pencariannya, termasuk user experience. Oleh karena itu, pemilik website wajib memahami core web vitals sampai ke akarnya.
Lalu, sebenarnya apa itu core web vitals dan manfaatnya bagi pemilik website, baik perorangan maupun bisnis? Mari cari tahu jawabannya dalam penjelasan di bawah ini!
Apa itu Core Web Vitals?
Google menciptakan metrik core web vitals agar pemilik website lebih memerhatikan pengalaman pengguna saat mengunjungi sebuah website. Paling tidak, semua website yang bekerja sama dengan Google mempunyai kecepatan loading yang ideal, respons elemen yang baik, dan layout yang stabil.
Menurut Google, kemungkinan pengguna pergi dari website yang memenuhi kriteria tersebut akan turun hingga 24%. Selain itu, skor SEO-nya akan ikut meningkat sehingga mempunyai kesesmpatan yang lebih besar untuk tampil teratas di hasil pencarian.
Mengapa Core Web Vitals Penting?
Ada tiga alasan utama kenapa kamu dan semua pemilik website harus memerhatikan core web vitals, terutama jika ingin meningkatkan peringkat di hasil pencarian Google:
1. Memenuhi Keinginan Pengunjung
Pengunjung menyukai website yang cepat, menyenangkan, dan mudah digunakan di perangkat apa saja. Sebab, website yang seperti itu bisa diakses di mana saja dan kapan saja.
Ketika keinginan pengunjung tentang semua hal tersebut sudah terpenuhi, mereka akan betah diam berlama-lama di website kamu. Selain itu, pengunjung tidak akan segan membaca banyak konten sekaligus. Alhasil pendapatanmu dari iklan dan sebagainya pun berpotensi meningkat.
Salah Satu Metrik yang Berpengaruh pada SEO
Sejak pertama dikenalkan pada tahun 2020 lalu, core web vitals telah menjadi metrik penting yang memiliki pengaruh besar terhadap SEO. Jika kamu tidak mengoptimalkannya, kesempatan untuk memenangkan persaingan di hasil pencairan bisa hilang begitu saja.
Menjaga Pengunjung Tetap di Website
Menyediakan pengalaman penggunaan website yang baik akan mencegah pengunjung kembali ke SERP saat mencari informasi. Google sendiri berencana untuk menampilkan keterangan “Good Page Experience” di hasil pencariannya. Menurut JR Oakes, raksasa mesin pencari itu mungkin saja sudah membuat persiapan khusus untuk rencana ini.
JR Oakes menemukan kode dengan label “page_experience” di code front-end Google Search Console, seperti yang ditunjukkan oleh gambar berikut ini:
Metrik Core Web Vitals
Metrik core web vitals berasal dari Google langsung, sehingga pasti akan mengalami perubahan dari waktu ke waktu. Karena Google sendiri terbilang cepat beradaptasi dengan keinginan penggunanya. Tapi untuk sekarang, yang perlu diperhatikan ada tiga hal, yaitu: loading, interaktivitas, dan stabilitas visual. Dalam tiga hal itu, ada tiga metrik yang mewakilinya, yaitu:
Largest Contentful Paint (LCP)
Largest Contentful Paint atau (LCP) adalah metrik yang mengukur performa pemuatan elemen terbesar di sebuah halaman. Elemen ini bukan sekadar gambar atau video saja, tetapi bisa juga teks yang panjang.
Untuk memberikan pengalaman pengguna yang baik, usahakan agar LCP di website kamu muncul dalam 2,5 detik pertama saat pengguna membuka sebuah halaman. Perlu kamu ingat, bahwa elemen-elemen lain yang ada di bawah LCP tidak termasuk, walaupun ukurannya besar.
Metrik yang satu ini khusus untuk menggantikan metrik First Contentful Paint (FCP). FCP adalah elemen yang pertama kali dimuat dari sebuah halaman, tanpa memerhatikan ukurannya. Jadi walau ukurannya kecil seperti logo atau navigasi website, tetap dianggap sebagai FCP.
Google menganggap FCP tidak lagi menunjukkan kecepatan loading sebuah website, sehingga mereka menggantinya dengan LCP.
First Input Delay (FID)
First Input Delay (FID) merupakan waktu yang diperlukan oleh website untuk merespons interaksi pertama dari pengunjungnya, seperti input atau klik. Oleh karena itu, metrik ini berguna untuk mengukur interaktivitas.
Agar pengguna mendapatkan pengalaman yang baik, sebaiknya usahakan agar skor FID kurang dari 100 milidetik. Sejak bulan Maret 2024, FID tidak lagi menjadi metrik untuk interaktivitas, Google menggantinya dengan Interaction to Next Paint (INP).
Penggantian tersebut terjadi karena Indikator penilaian FID belum sempurna. Google memakai data lab dalam menentukan kriteria penilaian metrik ini, sehingga tidak dapat mewakili interaksi pertama pengunjung secara akurat.
Apalagi, interaksi pertama biasanya dari interaksi yang terjadi saat pemuatan sebagian besar elemen dalam suatu halaman. Padahal kenyataannya, interaksi pertama bisa terjadi kapan saja.
Cumulative Layout Shift (CLS)
Cumulative Layout Shifts (CLS) dikenal sebagai indikator yang mampu mengukur jumlah perubahan layout dari sebuah halaman website ketika dibuka oleh pengguna. Dengan kata lain, CLS merupakan metrik yang mengukur stabilitas visual. Agar pengguna merasakan pengalaman yang baik saat mengunjungi website-mu, pastikan skor CLS-nya tidak lebih dari 0,1.
Kamu mungkin pernah menemukan website yang memasang banyak banner iklan tanpa memerhatikan penempatannya. Ketika membaca artikel dalam website tersebut, paragraf yang sedang kamu baca mendadak bergeser ke bawah karena ada satu banner yang baru muncul setelah semua paragraf dimuat.
Website seperti ini bisa dikatakan memiliki CLS yang buruk karena layout halamannya terlalu sering berubah-ubah secara mendadak. Maka dari itu, pikirkan dengan matang konsep layout halaman website kamu, termasuk penempatan semua elemennya, sebelum ditampilkan ke pengunjung.
Manfaat Optimasi Core Web Vitals
Sebagai metrik yang ikut menentukan peringkat SEO, kamu harus mengoptimasi core web vitals website-mu semaksimal mungkin. Semakin baik skor metriknya, semakin besar dampak positif yang akan kamu rasakan.
Berikut adalah beberapa dampak optimasi core web vitals yang terlalu sayang untuk dilewatkan:
Meningkatkan Pengalaman Pengguna (UX)
Ketika semua metrik core web vitals website-mu optimal, kecepatan loading, responsivitas, dan stabilitas visualnya akan meningkat. Dengan begitu, pengguna akan merasakan pengalaman yang baik saat berinteraksi dengan website kamu.
Pada akhirnya, mereka betah menghabiskan waktu lama untuk “nongkrong” di website-mu. Nantinya, saat mereka ingin mendapatkan informasi baru, website kamu akan menjadi pilihan pertama yang mereka kunjungi.
Meningkatkan Konversi
Situs web yang lambat dan tidak responsif akan membuat pengguna mudah frustasi sehingga memilih pindah ke situs lain. Mereka bahkan tidak akan melakukan interaksi apapun yang kamu inginkan, seperti mengisi formulir atau melakukan pembelian.
Dengan mengoptimasi core web vitals, kamu bisa memberikan pengalaman pengguna yang lebih lancar dan baik sehingga mereka mau melakukan tindakan yang diinginkan. Alhasil, konversi di website-mu ikut meningkat.
Meningkatkan Peringkat Pencarian (SEO)
Semua mesin pencari semakin memprioritaskan website yang mampu memberikan pengalaman pengguna terbaik. Google sendiri mengatakan bahwa algoritma pencarian mereka sangat memerhatikan faktor ini untuk menentukan ranking website di hasil pencarian.
Maka dari itu, optimasi setiap metrik core web vitals website-mu secepat mungkin, agar kamu bisa mendapatkan ranking tinggi di hasil pencarian.
Mengurangi Bounce Rate
Bounce rate adalah persentase pengunjung yang meninggalkan website kamu setelah melihat satu halaman saja. Skor bounce rate yang tinggi menandakan bahwa website-mu gagal membuat pengunjung betah menjelajahi banyak halaman. Untuk mengatasinya, optimasi metrik LCP, FID, dan CLS agar pengguna betah berinteraksi dengan website kamu.
Meningkatkan Keuntungan bisnis
Dampak optimasi core web vitals yang selanjutnya adalah meningkatkan keuntungan bisnis. Caranya yaitu dengan meningkatkan konversi dan peringkat di hasil pencarian berkat pengalaman pengguna yang baik.
Menghemat Bandwidth
Dampak selanjutnya yang akan kamu rasakan adalah penggunaan bandwidth yang lebih hemat sehingga biaya hosting tidak membengkak. Pasalnya, saat kamu mengoptimasi core web vitals, ukuran file dan jumlah permintaan HTTP yang dibutuhkan untuk memuat halaman website kamu berkurang secara signifikan.
Mempermudah Pemeliharaan Situs Web
Salah satu kewajiban pemilik website adalah melakukan pemeliharaan secara rutin. Sebagian besar orang merasa malas menyelesaikan kewajiban ini karena prosesnya yang seringkali menyulitkan.
Untuk mengatasinya, lakukan optimasi core web vitals agar kode di website kamu menjadi bersih dan teroptimasi sehingga kamu akan lebih mudah dalam mengelola dan melakukan update dalam jangka panjang.
Menyesuaikan dengan Perangkat Berbeda
Core web vitals yang teroptimasi dengan baik dapat memastikan website kamu berfungsi optimal di berbagai perangkat, mulai dari desktop, mobile, hingga tablet. Hal ini sangat penting karena jumlah pengguna yang mengakses internet lewat perangkat mobile semakin bertambah dari waktu ke waktu.
Jika website kamu hanya berfungsi optimal saat dibuka lewat desktop, kamu akan kehilangan pengguna yang memakai perangkat mobile. Begitupun sebaliknya.
Mencegah Masalah di Masa Depan
Jika kamu mengoptimalkan core web vitals sejak awal, kamu bisa menghindari masalah performa yang mungkin saja muncul di seiring dengan pertumbuhan website-mu.
Memberikan Keunggulan Kompetitif
Di tengah kompetisi ketat dalam dunia digital, website yang mampu memberikan pengalaman pengguna terbaik akan mempunyai keunggulan tersendiri. Oleh sebab itu, optimasi core web vitals website kamu semaksimal mungkin sehingga dapat memenangkan persaingan dengan kompetitor.
Baca Juga: Cara Melihat Iklan Kompetitor dengan Google Ads Transparency
Tools Mengukur Core Web Vitals
Untuk mengetahui skor setiap metrik core web vitals, kamu bisa menggunakan tiga tools khusus, yaitu Google PageSpeed Insight, GTmetrix, dan Lighthouse.
Google PageSpeed Insights
Google PageSpeed Insights (PSI) adalah tools yang dapat mengukur performa dari sebuah website saat tampil di perangkat mobile dan desktop. PSI memberikan gambaran umum tentang pengalaman pengguna saat mengunjungi sebuah website.
Selain itu, PSI juga menyarankan hal-hal yang perlu dilakukan agar pemilik website bisa meningkatkan pengalaman pengguna. Kabar baiknya, PSI juga dapat mengukur skor metrik core web vitals yang menunjukkan apakah website kamu dapat memberikan pengalaman pengguna yang baik atau tidak.
GTmetrix
GTMetrix merupakan tools mengukur core web vitals lain yang cukup mudah digunakan. Dengan GTMetrix, kamu bisa mengetahui seberapa cepat penilaian website kamu dari beberapa metrik seperti performa, struktur, LCP, Total Blocking Time, dan CLS.
Jika website-mu termasuk lambat, tools ini akan memberitahu apa saja yang menjadi kekurangannya. Selain itu, kamu juga akan mendapatkan rekomendasi tindakan untuk menutupi kekurangan tersebut sehingga kecepatan website meningkat.
Lighthouse
Tools mengukur core web vitals yang selanjutnya adalah Lighthouse. Tools ini mampu mengidentifikasi masalah dan peluang untuk meningkatkan pengalaman pengguna dari sebuah website.
Pengukuran terbilang lengkap karena mencakup beberapa metrik seperti performa, aksesibilitas, LCP, CLS, hingga Total Blocking Time. Kamu bisa mengikuti rekomendasi dari Lighthouse untuk mengoptimalkan skor metrik core web vitals, sehingga pengguna mendapatkan pengalaman terbaik saat mengunjungi website-mu.
Tips untuk Mengoptimalkan Core Web Vitals
Setelah mengetahui pentingnya core web vitals untuk website yang kamu miliki, saatnya kamu mengoptimalkan ketiga metriknya, yaitu LCP, FID, dan CLS. Agar tidak kebingungan, berikut ada beberapa tips yang bisa kamu terapkan.
Prioritaskan Largest Contentful Paint
Pertama, identifikasi dulu konten terbesar yang akan dilihat oleh pengguna pertama kali lalu optimalkan pemuatannya. Biasanya konten terbesar dalam website berupa gambar atau teks, jadi kamu bisa mulai dengan mengurangi ukurannya, memakai format gambar yang efisien (seperti WebP), atau menunda pemuatan konten yang kurang penting.
Minimalkan Cumulative Layout Shift
Seperti dalam penjelasan sebelumnya, CLS merupakan metrik yang mengukur seberapa banyak layout halaman website kamu berubah ketika dimuat. Minimalkan jumlah perubahan yang terjadi saat pengguna membuka website-mu.
Caranya bisa dengan menunda pemuatan elemen non-kritis, kemudian menghindari penggunaan elemen yang bergeser tiba-tiba dengan menentukan dimensi gambar dan video sejak awal. Selain itu, gunakan CSS ketika kamu ingin mengatur ruang di website.
Tingkatkan Kecepatan First Input Delay
FID mengukur waktu yang diperlukan oleh website untuk merespons interaksi dari pengguna awal. Tingkatkan FID di website kamu dengan cara mengurangi JavaScript yang tidak diperlukan, meningkatkan waktu respons server, serta minify dan gabungkan beberapa file.
Manfaatkan Browser Caching
Browser caching adalah proses penyimpanan salinan file dari sebuah website di perangkat pengguna agar mereka tidak perlu mengunduh kontennya saat berkunjung lagi. Aktifkan caching browser di website kamu untuk elemen dan sumber daya yang statis seperti CSS, gambar, serta JavaScript.
Optimalkan Gambar
Gambar termasuk salah satu penyebab utama pemuatan halaman berjalan lambat. Karena itu, kompres gambar yang akan kamu unggah, gunakan format yang tepat (contohnya WebP untuk grafik dan JPEG untuk foto), kemudian manfaatkan lazy loading untuk memuat gambar di luar viewport.
Gunakan Content Delivery Network (CDN)
CDN adalah tools yang dapat menyimpan konten website di server di seluruh dunia agar lebih cepat diakses oleh pengguna. Pertimbangkan untuk menggunakan CDN agar kecepatan pemuatan website meningkat, khususnya jika ada pengguna yang jauh dari lokasi server kamu.
Minify dan Gabungkan File
Minifying adalah proses menghilangkan karakter yang tidak diperlukan dari kode website-mu, baik HTML, CSS, maupun JavaScript. Sementara itu, penggabungan file adalah proses mengurangi jumlah permintaan HTTP untuk memuat suatu halaman. Gunakan kedua teknik ini untuk meningkatkan kecepatan pemuatan halaman website kamu.
Kurangi Permintaan HTTP
Semakin banyak jumlah file yang harus diunduh oleh browser untuk menampilkan halaman, artinya akan semakin lambat kecepatan pemuatannya. Maka, kurangi permintaan HTTP dengan cara menggabungkan file, gunakan sprites untuk gambar-gambar yang kecil, dan memuat font secara efisien.
Pantau menggunakan Google Pagespeed
Manfaatkan tools gratis seperti Google PageSpeed insight atau Lighthouse untuk mengecek, mengukur, serta memantau skor core web vitals website kamu. Tenang saja, meskipun gratis, tools tersebut mampu memberikan rekomendasi yang spesifik untuk meningkatkan performa website.
Penutup
Sekarang kamu telah mengetahui bahwa core web vitals memiliki peran penting dalam banyak hal, terutama pengalaman pengguna dan SEO. Ingat, kamu tidak boleh menganggap remeh pengalaman pengguna karena dapat berpengaruh pada konversi di website kamu.
Itulah sebabnya, cek dan pantau secara rutin skor metrik core web vitals website kamu menggunakan tools gratis seperti Google PageSpeed Insight atau Lighthouse. Ikuti saran dari kedua tools ini agar website kamu lebih unggul dari kompetitor. Selamat mencoba!
Referensi:
- https://web.dev/articles/vitals-tools-2020
- https://support.google.com/merchants/answer/14295874?hl=id#:~:text=Core%20Web%20Vitals%20adalah%20inisiatif,mengidentifikasi%20area%20yang%20perlu%20ditingkatkan.
- https://developers-id.googleblog.com/2020/05/pengenalan-web-vitals-metrik-penting.html
- https://www.conductor.com/academy/core-web-vitals/#why-care
