Core Web Vitals 2026: Panduan Lengkap untuk Website Bisnis
TL;DR: Core Web Vitals adalah tiga metrik Google (LCP, INP, CLS) yang mengukur kecepatan muat, responsivitas, dan stabilitas visual sebuah halaman. Target lolos: LCP di bawah 2,5 detik, INP di bawah 200 ms, dan CLS di bawah 0,1. Ketiganya menjadi faktor peringkat sekaligus penentu pengalaman pengguna yang nyata.
Banyak pemilik website bisnis menilai situsnya cepat hanya dari koneksi kantor yang kencang. Begitu dibuka pengunjung dengan jaringan seluler biasa, ceritanya berbeda: gambar lambat muncul, tombol telat merespons, dan tata letak bergeser saat iklan dimuat. Tiga gejala itu persis yang diukur Core Web Vitals.
Sejak Google menjadikannya sinyal peringkat pada 2021 dan terus menyempurnakannya sampai 2026, Core Web Vitals bukan lagi urusan teknis developer semata. Ia menyentuh konversi, bounce rate, dan kesan profesional sebuah brand.
Tiga Metrik yang Diukur
Core Web Vitals terdiri dari tiga angka, masing-masing menjawab satu pertanyaan pengguna.
| Metrik | Yang Diukur | Target Baik |
|---|---|---|
| LCP (Largest Contentful Paint) | Kapan konten utama tampil | Di bawah 2,5 detik |
| INP (Interaction to Next Paint) | Seberapa cepat halaman merespons interaksi | Di bawah 200 ms |
| CLS (Cumulative Layout Shift) | Seberapa stabil tata letak | Di bawah 0,1 |
LCP menjawab "kapan saya bisa melihat isinya", dan perbaikannya dibahas tuntas di optimasi LCP. INP menjawab "kapan saya bisa berinteraksi", sangat dipengaruhi oleh beban JavaScript dan hydration React. CLS menjawab "kenapa tata letaknya loncat", dengan akar masalah yang diuraikan di penyebab CLS.
Kenapa Fondasinya Ada di Server
Render tidak bisa dimulai sebelum byte pertama dari server tiba. Karena itu, Time to First Byte yang lambat akan menyeret seluruh metrik. Pilihan arsitektur rendering juga menentukan: situs yang memakai generasi statis dibanding render dinamis umumnya punya TTFB jauh lebih kecil karena halaman sudah jadi sebelum diminta.
Untuk situs konten yang stabil seperti profil bisnis dan portofolio, generasi statis adalah pilihan default yang paling aman untuk performa.
Studi Kasus: Membenahi Performa Situs Klien
Saat membangun situs untuk Yuanita Sekar yang fokus pada personal branding, tantangan awalnya adalah halaman terasa berat di perangkat menengah. Pendekatan yang dipakai berurutan: memindahkan halaman ke generasi statis, memasang prioritas pada gambar hero agar LCP turun, mengecilkan bundel JavaScript untuk menjaga INP, lalu menetapkan dimensi eksplisit pada gambar dan iklan agar CLS mendekati nol.
Pola serupa terlihat pada proyek Vetmo di sektor pet care: begitu gambar dikompres ke format modern dan komponen interaktif dikurangi, ketiga metrik bergerak dari status "perlu perbaikan" ke "baik". Hasil ini sejalan dengan temuan industri bahwa kecepatan berbanding lurus dengan retensi, sebagaimana dijelaskan di riset web.dev tentang dampak Web Vitals pada bisnis.
Cara Mengukur dengan Benar
Ada dua sumber data yang sering tertukar. Lab data berasal dari alat seperti Lighthouse yang menguji di kondisi simulasi. Field data berasal dari pengguna nyata lewat Chrome User Experience Report. Google memakai field data untuk peringkat, jadi perbaikan harus diverifikasi di sana, bukan hanya di skor lab.
Alat praktis yang bisa dipakai: PageSpeed Insights untuk gabungan lab dan field, Search Console untuk laporan Core Web Vitals seluruh situs, serta panel Performance di Chrome DevTools untuk diagnosis mendalam.
Pertanyaan Umum
Apakah Core Web Vitals memengaruhi peringkat secara langsung?
Ya, ketiganya termasuk sinyal pengalaman halaman. Namun relevansi konten tetap faktor utama. Core Web Vitals menjadi penentu di antara halaman yang relevansinya setara.
Berapa lama sampai perbaikan terlihat di Search Console?
Karena memakai field data 28 hari, perubahan biasanya mulai tampak dalam beberapa minggu setelah perbaikan diterapkan dan trafik baru terkumpul.
Apakah situs cepat otomatis lolos semua metrik?
Tidak. Situs bisa cepat dimuat (LCP baik) tetapi tetap gagal CLS karena tata letak bergeser, atau gagal INP karena JavaScript berat. Ketiganya perlu diperiksa terpisah.
Apakah perlu framework khusus untuk lolos?
Tidak wajib, tetapi framework modern seperti Next.js memudahkan dengan generasi statis dan optimasi gambar bawaan. Yang menentukan tetap penerapannya, bukan sekadar pilihan tool.
Mulai dari Satu Metrik
Memperbaiki Core Web Vitals tidak harus sekaligus. Mulai dari metrik yang paling merah di Search Console, perbaiki akarnya, ukur ulang di field data, lalu lanjut ke berikutnya. Untuk konteks bisnis, performa bukan tujuan akhir melainkan jalan menuju konversi yang lebih baik, seperti dibahas di cara mengukur ROI website dalam 90 hari pertama.
Artikel Terkait
Website Bisnis
Kenapa Website Lambat Diam-diam Merugikan Bisnis Anda
Website lambat tidak menampilkan tagihan, tapi terus memotong calon pelanggan sebelum mereka sempat membaca penawaran Anda. Ini cara kerjanya dan cara mengukurnya.
Website Bisnis
View Transitions API: Membuat Perpindahan Halaman Terasa Mulus
Perpindahan antarhalaman yang berkedip membuat website terasa kuno. View Transitions API menghadirkan animasi mulus tanpa library berat. Begini cara kerjanya dan kapan layak dipakai.
Website Bisnis
Keyword Cannibalization: Saat Halaman Anda Saling Berebut Peringkat
Dua halaman menyasar kata kunci yang sama bukan berarti peluang ganda. Sering kali keduanya justru saling melemahkan di hasil pencarian. Berikut cara mendeteksi dan membereskannya.
Butuh website yang benar-benar bekerja?
Hubungi Vito untuk konsultasi gratis 15 menit.
WhatsApp Sekarang