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
Website Cepat, Konversi Lebih Tinggi: Bukti dan Caranya
Kecepatan halaman bukan sekadar angka teknis. Ia memengaruhi bounce, kepercayaan, dan konversi. Ini bukti dan langkah praktis mempercepatnya.
Website Bisnis
Biaya Maintenance Website Bisnis: Komponen, Kisaran, dan Cara Menghematnya
Website bukan biaya sekali bayar. Ini rincian komponen maintenance tahunan, kisaran harganya di Indonesia, dan bagian mana yang aman dihemat.
Website Bisnis
Checklist Pre-Launch Website Bisnis: 20 Hal yang Sering Terlewat
Website baru sering diluncurkan dengan lubang kecil yang mahal: meta duplikat, form tanpa notifikasi, analytics belum terpasang. Checklist ini menutupnya.
Butuh website yang benar-benar bekerja?
Hubungi Vito untuk konsultasi gratis 15 menit.
WhatsApp Sekarang