seokita.id

SEO teknis, riset keyword, on-page optimization untuk pasar Indonesia

Core Web Vitals 2025: Panduan Teknis untuk Situs Indonesia

by Bayu Wicaksono
Core Web Vitals 2025: Panduan Teknis untuk Situs Indonesia

Kesalahan yang Bikin Skor Core Web Vitals Anda Merah Terus

Banyak pemilik bisnis sudah pasang Google Search Console, lihat laporan Core Web Vitals, lalu... bingung mau ngapain. Skornya merah, tapi tidak tahu mana yang harus diperbaiki duluan. Bahkan ada yang sudah ganti tema WordPress tiga kali tapi skornya tetap buruk.

Masalah sebenarnya bukan tema — melainkan tidak adanya diagnosis yang benar sebelum eksekusi.

Sejak Google mengkonfirmasi Core Web Vitals sebagai faktor ranking melalui Page Experience Update, tiga metrik ini bukan lagi opsional: LCP (Largest Contentful Paint), INP (Interaction to Next Paint), dan CLS (Cumulative Layout Shift). Dan per Maret 2024, INP resmi menggantikan FID — banyak situs Indonesia yang belum menyesuaikan audit mereka.

Artikel ini memberikan checklist teknis yang bisa Anda jalankan minggu ini, bukan teori.

Kenapa Core Web Vitals Kritis untuk Bisnis di Indonesia

Data dari Google CrUX (Chrome User Experience Report) menunjukkan mayoritas pengguna internet Indonesia mengakses web lewat perangkat mobile dengan koneksi 4G yang tidak stabil — bukan fiber. Artinya, situs yang lambat di desktop bisa jauh lebih parah performanya di mobile.

Implikasi langsung ke bisnis:

  • Ranking organik: Google menggunakan data lapangan (field data) dari pengguna nyata, bukan hanya lab score dari PageSpeed Insights. Situs dengan Core Web Vitals "Poor" di semua tiga metrik berisiko kalah dari kompetitor yang skornya "Good", bahkan jika konten Anda lebih lengkap.
  • Konversi: Studi internal Google menunjukkan situs yang memenuhi threshold Core Web Vitals memiliki bounce rate 24% lebih rendah. Untuk toko online atau landing page jasa, ini langsung berdampak ke revenue.
  • Crawl budget: Situs lambat membuat Googlebot lebih sedikit merayapi halaman Anda per sesi — berbahaya untuk situs e-commerce dengan ribuan SKU.

Threshold yang harus Anda capai (per 2025):

Metrik Good Needs Improvement Poor
LCP ≤ 2.5 detik 2.5–4.0 detik > 4.0 detik
INP ≤ 200 ms 200–500 ms > 500 ms
CLS ≤ 0.1 0.1–0.25 > 0.25

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

Kesalahan umum: hanya mengandalkan skor PageSpeed Insights dan menganggap angka 90+ sudah aman.

PageSpeed Insights menampilkan dua jenis data:

  1. Lab data — simulasi di server Google, tidak mencerminkan kondisi pengguna nyata Anda.
  2. Field data — data nyata dari pengguna Chrome di situs Anda (butuh minimal 28 hari traffic).

Yang digunakan Google untuk ranking adalah field data. Jadi skor lab 95 tidak otomatis berarti ranking Anda aman.

Tools audit yang harus Anda gunakan:

  • Google Search Console → Core Web Vitals report: Lihat URL mana yang "Poor" dan "Needs Improvement" berdasarkan field data. Ini titik awal yang paling akurat.
  • PageSpeed Insights (pagespeed.web.dev): Untuk diagnosis per-URL dengan rekomendasi spesifik.
  • Chrome DevTools → Performance tab: Untuk debugging INP dan long tasks di JavaScript.
  • WebPageTest.org: Pilih lokasi server Jakarta dan device mobile untuk simulasi kondisi pengguna Indonesia yang realistis.
  • CrUX Dashboard (lookerstudio.google.com): Untuk memantau tren field data selama beberapa bulan.

Checklist 7 Langkah Perbaikan Core Web Vitals

Urutan ini berdasarkan dampak terbesar ke terkecil untuk mayoritas situs bisnis Indonesia.

✅ Langkah 1 — Identifikasi URL Prioritas di Search Console

  1. Buka Google Search Console → pilih properti Anda.
  2. Klik Core Web Vitals di sidebar kiri.
  3. Klik laporan Mobile (prioritas utama untuk pasar Indonesia).
  4. Export daftar URL dengan status "Poor" — fokus ke halaman dengan traffic tertinggi dulu (cek di laporan Performance).
  5. Buat spreadsheet dengan kolom: URL, LCP, INP, CLS, Traffic (klik organik).

Target: Daftar 10–20 URL prioritas yang akan Anda perbaiki.

✅ Langkah 2 — Perbaiki LCP: Prioritaskan Gambar Hero

LCP paling sering disebabkan oleh gambar hero atau banner besar yang loading lambat. Langkah spesifik:

  1. Identifikasi elemen LCP: Di PageSpeed Insights, scroll ke bagian "Diagnostics" → lihat "Largest Contentful Paint element". Biasanya berupa <img> atau <div> dengan background-image.
  2. Tambahkan fetchpriority="high" pada tag <img> elemen LCP: 
    <img src="hero.webp" fetchpriority="high" alt="...">
  3. Konversi gambar ke format WebP atau AVIF. Gunakan plugin Imagify atau ShortPixel (WordPress), atau konversi manual via Squoosh.app.
  4. Preload gambar LCP di <head>: 
    <link rel="preload" as="image" href="hero.webp">
  5. Gunakan CDN dengan server di Asia Tenggara. Cloudflare (gratis) atau BunnyCDN (berbayar, ada PoP di Jakarta) secara signifikan mengurangi TTFB untuk pengguna Indonesia.

Kesalahan umum: Memasang lazy loading (loading="lazy") pada gambar hero. Ini justru menunda LCP — lazy loading hanya untuk gambar di bawah fold.

✅ Langkah 3 — Perbaiki INP: Kurangi JavaScript Blocking

INP mengukur responsivitas situs terhadap interaksi pengguna (klik, tap, ketik). INP buruk hampir selalu disebabkan oleh JavaScript yang berat.

  1. Di Chrome DevTools, buka tab Performance → rekam sesi interaksi (klik tombol, isi form).
  2. Cari Long Tasks (bar merah di atas timeline) — task yang memakan waktu > 50ms.
  3. Identifikasi script penyebab: biasanya plugin chat (Tawk.to, Intercom), widget media sosial, atau Google Tag Manager yang memuat terlalu banyak tag.
  4. Tunda script non-kritis dengan atribut defer atau async: 
    <script src="analytics.js" defer></script>
  5. Di WordPress: gunakan plugin Asset CleanUp untuk menonaktifkan script yang tidak dibutuhkan di halaman tertentu.
  6. Audit tag di Google Tag Manager — hapus tag yang tidak aktif, tunda tag yang tidak perlu fire saat halaman pertama dimuat.

✅ Langkah 4 — Perbaiki CLS: Stabilkan Layout

CLS terjadi ketika elemen di halaman bergeser saat loading — misalnya gambar tanpa dimensi, atau iklan yang muncul tiba-tiba.

  1. Selalu tentukan dimensi width dan height pada semua <img>: 
    <img src="produk.webp" width="800" height="600" alt="...">
  2. Reservasi ruang untuk iklan dan embed: Jika Anda menampilkan Google AdSense atau embed YouTube, bungkus dengan container yang memiliki dimensi tetap.
  3. Hindari menyisipkan konten di atas konten yang sudah ada — misalnya banner notifikasi cookie yang muncul di atas artikel setelah halaman dimuat.
  4. Gunakan font-display: swap di CSS untuk web font agar teks tidak bergeser saat font kustom dimuat.

✅ Langkah 5 — Optimalkan Server Response Time (TTFB)

TTFB (Time to First Byte) bukan metrik Core Web Vitals secara langsung, tapi TTFB tinggi otomatis membuat LCP memburuk.

  1. Ukur TTFB di WebPageTest dengan lokasi Jakarta.
  2. Target TTFB: < 800ms untuk pengguna Indonesia.
  3. Jika TTFB > 1.5 detik, pertimbangkan pindah hosting ke server yang berlokasi di Indonesia atau Singapura (lebih dekat secara geografis).
  4. Aktifkan server-side caching: WP Rocket atau LiteSpeed Cache (WordPress), atau konfigurasi Redis/Memcached di level server.
  5. Aktifkan HTTP/2 atau HTTP/3 di hosting Anda — cek di WebPageTest bagian "Connection" atau gunakan tools.keycdn.com/http2-test.

✅ Langkah 6 — Validasi Perbaikan di Search Console

Setelah melakukan perbaikan, Google butuh waktu untuk mengumpulkan field data baru — biasanya 28–35 hari. Jangan panik jika skor tidak langsung berubah.

  1. Di Search Console → Core Web Vitals → klik "Validate Fix" pada URL yang sudah diperbaiki.
  2. Google akan memantau URL tersebut selama 28 hari dan mengubah statusnya ke "Passing" jika perbaikan berhasil.
  3. Pantau juga di PageSpeed Insights untuk perubahan lab data yang lebih cepat terlihat.

✅ Langkah 7 — Setup Monitoring Berkelanjutan

Core Web Vitals bisa memburuk kembali setelah update plugin, penambahan fitur baru, atau perubahan template.

  1. Pasang alerting di Search Console: Aktifkan notifikasi email untuk laporan Core Web Vitals.
  2. Gunakan SpeedVitals.com (ada versi gratis) untuk monitoring otomatis mingguan.
  3. Jadwalkan audit Core Web Vitals setiap kuartal — atau setiap kali ada perubahan besar di situs.

Contoh Nyata: Situs E-Commerce Lokal, LCP Turun dari 6.2 ke 2.1 Detik

Sebuah toko online produk perawatan kulit di Surabaya datang dengan masalah: halaman produk mereka konsisten "Poor" di Core Web Vitals, padahal konten dan backlink sudah cukup baik.

Diagnosis: Gambar produk berukuran rata-rata 1.2MB dalam format JPEG, tidak ada CDN, dan tema WooCommerce mereka memuat 14 script JavaScript di setiap halaman.

Yang dilakukan:

  • Konversi semua gambar produk ke WebP menggunakan ShortPixel (rata-rata ukuran turun 68%).
  • Pasang fetchpriority="high" dan preload pada gambar utama produk.
  • Aktifkan Cloudflare dengan cache agresif.
  • Nonaktifkan 6 plugin yang tidak digunakan di halaman produk via Asset CleanUp.
  • Pindah ke hosting dengan server Singapura (TTFB turun dari 2.1 detik ke 380ms).

Hasil setelah 35 hari (field data Search Console):

  • LCP: 6.2 detik → 2.1 detik ✅
  • INP: 380ms → 140ms ✅
  • CLS: 0.18 → 0.04 ✅
  • Ranking halaman produk naik rata-rata 4 posisi untuk keyword utama dalam 6 minggu.

Tidak ada perubahan konten — murni perbaikan teknis.

Prioritas Pertama yang Harus Anda Kerjakan Hari Ini

Jika Anda hanya punya waktu satu jam minggu ini, lakukan ini:

Buka Google Search Console → Core Web Vitals → Mobile → export daftar URL "Poor" → identifikasi elemen LCP di halaman dengan traffic tertinggi menggunakan PageSpeed Insights.

Satu URL yang diperbaiki dengan benar lebih berharga dari audit menyeluruh yang tidak pernah dieksekusi. Mulai dari halaman yang paling banyak dikunjungi, perbaiki LCP-nya, lalu lanjutkan ke halaman berikutnya.

Core Web Vitals bukan proyek sekali jalan — ini adalah infrastruktur teknis yang perlu dijaga. Tapi perbaikan pertama yang tepat bisa langsung terasa dampaknya dalam 4–6 minggu ke depan.