Core Web Vitals 2025: Audit & Perbaikan untuk Situs Indonesia

by Bayu Wicaksono
Core Web Vitals 2025: Audit & Perbaikan untuk Situs Indonesia

Banyak Situs Indonesia Lolos Keyword, Gagal di Core Web Vitals

Anda sudah riset keyword dengan benar, on-page sudah rapi, backlink mulai masuk — tapi ranking stagnan di halaman dua atau tiga. Salah satu penyebab yang paling sering terlewat: Core Web Vitals yang merah di Google Search Console.

Berdasarkan data CrUX (Chrome User Experience Report) per Q1 2025, kurang dari 40% situs berbahasa Indonesia melewati threshold "Good" untuk semua tiga metrik Core Web Vitals sekaligus. Artinya, mayoritas situs lokal sedang bersaing dengan handicap teknis yang nyata.

Core Web Vitals bukan sekadar metrik kecepatan biasa. Google menggunakannya sebagai page experience signal yang memengaruhi ranking, terutama ketika dua halaman bersaing dengan kualitas konten yang setara. Di niche kompetitif seperti keuangan, properti, atau otomotif — selisih tipis di sini bisa berarti perbedaan posisi 4 vs posisi 1.

Artikel ini fokus pada tiga metrik aktif 2025: LCP (Largest Contentful Paint), INP (Interaction to Next Paint) — yang menggantikan FID sejak Maret 2024 — dan CLS (Cumulative Layout Shift). Kita akan bahas cara audit, penyebab paling umum di situs Indonesia, dan langkah perbaikan konkret.


Kenapa Core Web Vitals Lebih Kritis untuk Pasar Indonesia

Pengguna internet Indonesia mayoritas mengakses web lewat smartphone dengan koneksi 4G yang tidak selalu stabil, terutama di luar Jabodetabek. Kondisi ini membuat metrik seperti LCP jauh lebih sensitif dibanding pengguna di negara dengan infrastruktur fiber yang merata.

Selain itu, banyak situs bisnis Indonesia masih menggunakan shared hosting lokal dengan server response time (TTFB) di atas 800ms — jauh di atas threshold ideal 200ms. Ini langsung menghantam LCP sebelum satu baris JavaScript pun dieksekusi.

Faktor lain: tema WordPress premium yang "berat" (Avada, Divi, BeTheme) sangat populer di kalangan bisnis lokal. Tema ini sering membawa 15–30 file CSS/JS yang tidak digunakan, yang memperlambat INP secara signifikan.

Dampak bisnis yang konkret: Sebuah klien toko online di niche fashion yang kami tangani mengalami kenaikan organic click-through rate sebesar 18% dalam 6 minggu setelah skor Core Web Vitals berubah dari "Needs Improvement" ke "Good" — tanpa perubahan konten atau backlink baru.


Cara Audit Core Web Vitals yang Benar (Bukan Sekadar PageSpeed)

Kesalahan umum pertama: menggunakan PageSpeed Insights saja sebagai acuan. Skor PageSpeed mengukur kondisi lab (simulasi), bukan data pengguna nyata. Yang dilihat Google untuk ranking adalah field data dari CrUX.

Checklist Audit Core Web Vitals

Langkah 1 — Cek Field Data di Google Search Console

  • Buka Search Console → pilih menu "Core Web Vitals" di sidebar kiri.
  • Lihat laporan terpisah untuk Mobile dan Desktop.
  • Identifikasi URL mana yang masuk kategori "Poor" (merah) vs "Needs Improvement" (kuning).
  • Prioritaskan halaman dengan traffic organik tertinggi — bukan halaman beranda saja.

Langkah 2 — Gunakan PageSpeed Insights untuk Diagnosis

  • Buka pagespeed.web.dev dan masukkan URL spesifik (bukan domain).
  • Scroll ke bagian "Diagnose performance issues" — di sini ada breakdown per metrik.
  • Perhatikan bagian "Opportunities" dan "Diagnostics" — ini daftar item yang bisa langsung diperbaiki.

Langkah 3 — Audit dengan CrUX Dashboard (untuk data historis)

  • Gunakan CrUX Dashboard di Looker Studio.
  • Masukkan domain Anda untuk melihat tren 6 bulan terakhir.
  • Berguna untuk membuktikan ke klien atau atasan bahwa perbaikan yang dilakukan berdampak nyata.

Langkah 4 — Test dengan WebPageTest untuk Detail Teknis

  • Buka webpagetest.org, pilih lokasi server Singapore (terdekat dengan Indonesia) dan device Motorola G4 (representatif pengguna mid-range Indonesia).
  • Lihat waterfall chart untuk menemukan resource mana yang memblokir render.

Langkah 5 — Verifikasi dengan Chrome DevTools

  • Buka halaman di Chrome → klik kanan → Inspect → tab "Performance".
  • Klik record, reload halaman, stop record.
  • Cari blok merah di timeline (long tasks) — ini penyebab INP tinggi.

Perbaikan LCP: Target di Bawah 2.5 Detik

LCP mengukur seberapa cepat elemen terbesar di viewport (biasanya hero image atau heading H1) muncul di layar.

Penyebab LCP lambat yang paling umum di situs Indonesia:

  1. TTFB tinggi dari hosting lokal — Server response time di atas 600ms langsung menambah LCP. Solusi: pindah ke hosting dengan server Singapore (Niagahoster Cloud, Dewaweb, atau VPS Vultr/DigitalOcean region Singapore). Target TTFB: di bawah 200ms.

  2. Hero image tidak dioptimasi — Gambar banner berukuran 2MB+ dalam format JPEG adalah biang kerok terbesar. Konversi ke WebP dan kompres hingga di bawah 150KB. Gunakan plugin Imagify atau ShortPixel untuk WordPress.

  3. LCP image tidak di-preload — Tambahkan tag <link rel="preload" as="image"> untuk hero image di <head>. Untuk WordPress, gunakan plugin Perfmatters atau tambahkan manual di functions.php.

  4. Render-blocking CSS/JS — Gunakan plugin FlyingPress atau WP Rocket untuk defer JavaScript non-kritis dan inline critical CSS.

Target: LCP di bawah 2.5 detik di field data mobile.


Perbaikan INP: Metrik Baru yang Sering Diabaikan

INP (Interaction to Next Paint) menggantikan FID sejak Maret 2024. INP mengukur responsivitas halaman terhadap semua interaksi pengguna (klik, tap, ketik) — bukan hanya interaksi pertama.

Threshold: Di bawah 200ms = Good. Di atas 500ms = Poor.

INP yang buruk biasanya disebabkan oleh JavaScript yang berlebihan — terutama dari:

  • Plugin chat widget (Tawk.to, Crisp) yang memuat banyak script
  • Tag manager yang memuat puluhan tag sekaligus
  • Tema page builder yang mengeksekusi JS berat saat scroll

Langkah perbaikan INP:

  1. Audit JavaScript dengan Coverage tool — Di Chrome DevTools, buka tab "Coverage" (Ctrl+Shift+P → ketik "Coverage"). Muat halaman, lihat persentase JS yang tidak digunakan. Jika di atas 60%, ada masalah serius.

  2. Lazy-load third-party scripts — Jangan muat script chat, analytics, atau pixel langsung di <head>. Gunakan atribut defer atau async, atau muat setelah event DOMContentLoaded.

  3. Batasi plugin WordPress — Setiap plugin aktif berpotensi menambah JS. Audit dengan plugin Query Monitor untuk melihat script mana yang dimuat di halaman mana.

  4. Gunakan facade untuk embed berat — Jika ada embed YouTube atau Google Maps, gunakan facade (thumbnail statis yang baru memuat iframe saat diklik). Plugin Embed Optimizer dari WordPress.org bisa otomatisasi ini.


Perbaikan CLS: Halaman yang Tidak "Loncat"

CLS mengukur seberapa banyak elemen halaman bergeser secara tak terduga saat loading. Nilai CLS yang baik: di bawah 0.1.

Penyebab CLS paling umum:

  1. Gambar tanpa dimensi — Selalu tambahkan atribut width dan height pada tag <img>. Browser butuh informasi ini untuk mereservasi ruang sebelum gambar dimuat.

  2. Iklan atau banner yang muncul tiba-tiba — Jika menggunakan Google AdSense, selalu definisikan ukuran slot iklan. Jangan biarkan iklan "mendorong" konten ke bawah.

  3. Web font yang swap terlambat — Gunakan font-display: optional atau font-display: swap dengan preload font. Hindari FOUT (Flash of Unstyled Text) yang menyebabkan reflow.

  4. Elemen yang diinjeksi dinamis — Banner cookie consent, popup, atau notification bar yang muncul di atas konten harus didesain agar tidak menggeser layout.

Quick fix untuk WordPress: Plugin Autoptimize + pengaturan "Add missing image dimensions" bisa memperbaiki sebagian besar masalah CLS dari gambar secara otomatis.


Tools Lengkap untuk Monitoring Core Web Vitals

Tool Fungsi Biaya
Google Search Console Field data resmi, laporan per URL Gratis
PageSpeed Insights Lab data + rekomendasi Gratis
WebPageTest Waterfall detail, multi-lokasi Gratis
CrUX Dashboard (Looker Studio) Tren historis field data Gratis
Ahrefs Site Audit Crawl + Core Web Vitals overview Berbayar
Screaming Frog + PSI API Audit massal semua URL Berbayar

Untuk monitoring berkelanjutan, set up alert di Google Search Console — Google akan mengirim notifikasi email otomatis jika ada URL yang masuk kategori "Poor".


Kesalahan Umum yang Harus Dihindari

⚠️ Kesalahan #1: Mengoptimasi berdasarkan skor lab PageSpeed (angka 0–100) bukan field data. Skor 90 di lab bisa tetap "Poor" di field data jika pengguna nyata mengalami kondisi berbeda.

⚠️ Kesalahan #2: Mengaktifkan caching plugin tapi lupa mengecualikan halaman cart dan checkout (untuk e-commerce). Ini bisa menyebabkan bug transaksi.

⚠️ Kesalahan #3: Menggunakan CDN internasional (Cloudflare dengan server US) tanpa mengaktifkan Argo atau memilih edge server terdekat. Untuk traffic Indonesia, pastikan CDN punya PoP di Singapore atau Jakarta.

⚠️ Kesalahan #4: Mengoptimasi hanya halaman beranda. Google menilai Core Web Vitals per URL — halaman artikel, halaman produk, dan halaman kategori perlu diaudit terpisah.


Prioritas Pertama: Mulai dari LCP Mobile

Jika Anda harus memilih satu hal untuk dikerjakan minggu ini, fokus ke LCP di perangkat mobile. Ini metrik dengan dampak ranking paling langsung dan paling sering menjadi bottleneck di situs Indonesia.

Langkah konkretnya:

  1. Buka Search Console → Core Web Vitals → Mobile.
  2. Klik URL dengan status "Poor" yang punya traffic tertinggi.
  3. Buka URL tersebut di PageSpeed Insights.
  4. Ikuti tiga rekomendasi teratas di bagian "Opportunities".

Perbaikan LCP dari "Poor" ke "Good" di halaman-halaman utama biasanya sudah cukup untuk melihat pergerakan ranking dalam 4–8 minggu — sesuai siklus crawl dan update CrUX Google.

Core Web Vitals bukan taktik sekali jalan. Jadikan audit bulanan sebagai bagian dari rutinitas SEO teknis Anda, dan Anda akan punya keunggulan kompetitif yang konsisten atas situs-situs yang masih mengabaikannya.