Blog

Core Web Vitals untuk UMKM: Cara Website Anda Lebih Cepat

ilustrasi-shr_Xn8S8QU.jpg

Buka website Anda dari ponsel dengan koneksi seluler. Hitung sampai halaman tampil penuh. Kalau lebih dari tiga detik, Anda sudah kehilangan sebagian calon pembeli sebelum mereka sempat membaca satu kalimat pun. Google mengukur pengalaman ini dengan tiga angka yang disebut Core Web Vitals.

Core Web Vitals adalah tiga metrik resmi Google untuk menilai kenyamanan sebuah halaman saat dibuka: LCP (seberapa cepat konten utama muncul), INP (seberapa responsif halaman saat disentuh atau diklik), dan CLS (seberapa stabil tata letaknya). Ketiganya bisa dicek gratis lewat PageSpeed Insights. Panduan ini menjelaskan arti masing-masing angka, ambang batas yang dipakai Google, dan perbaikan yang bisa Anda minta ke penyedia jasa website.

Apa Itu Core Web Vitals dan Kenapa Penting untuk UMKM

Pengunjung tidak peduli teknologi di balik website Anda. Mereka hanya merasakan hasilnya: cepat atau lambat, nyaman atau menjengkelkan. Core Web Vitals adalah cara menerjemahkan perasaan itu menjadi angka yang bisa diukur dan diperbaiki.

Dua alasan praktis kenapa ini penting:

  • Konversi. Setiap detik tambahan waktu muat menurunkan peluang pengunjung menyelesaikan pembelian atau mengisi formulir. Kalau website Anda dipakai untuk jualan, ini langsung terasa di omzet.
  • Visibilitas di Google. Halaman yang lambat dan sering bergeser tata letaknya berisiko lebih jarang muncul di hasil pencarian dibanding kompetitor yang halamannya lebih ringan.

Untuk UMKM di Klaten yang bersaing dengan toko besar di kata kunci lokal, kecepatan sering jadi keunggulan paling murah. Website sederhana yang dibangun rapi bisa mengalahkan website besar yang berat.

Cara Cek Skor Website Anda dalam 2 Menit

Anda tidak butuh akun atau alat berbayar untuk mulai. Buka PageSpeed Insights, tempel alamat website Anda, lalu tunggu sekitar satu menit. Halaman hasil menampilkan dua tab: Mobile dan Desktop.

Fokuskan perhatian ke tab Mobile. Itu yang dipakai Google sebagai acuan, dan di situ hampir semua website tampil paling buruk. Kalau skor mobile Anda 50-an sementara desktop 85, masalahnya hampir pasti bobot gambar dan script.

Yang perlu Anda lihat, berurutan: bagian Core Web Vitals di atas, lalu daftar rekomendasi di bawah. Rekomendasi diurutkan dari yang paling besar dampaknya. Anda tidak perlu mengerjakan semuanya sekaligus. Ambil satu, perbaiki, ukur ulang.

grafik performa website di layar laptop
Photo by Luke Chesser on Unsplash

Membaca Tiga Angka: LCP, INP, dan CLS

Setiap metrik mengukur hal berbeda. Menyamakan ketiganya adalah kesalahan umum, dan itu membuat perbaikan menjadi asal tebak.

1. LCP (Largest Contentful Paint) — kecepatan tampilnya konten utama

LCP mengukur kapan elemen terbesar di layar selesai muncul. Biasanya itu gambar hero, banner, atau judul besar di bagian atas halaman.

Ambang batas yang dipakai Google:

  • Baik: di bawah 2,5 detik
  • Perlu perbaikan: 2,5 sampai 4 detik
  • Buruk: di atas 4 detik

Penyebab paling sering LCP lambat di website UMKM: foto produk berukuran 3 sampai 5 MB yang diunggah langsung dari kamera ponsel tanpa dikompresi. Gambar seperti itu bisa memperlambat halaman lebih dari apa pun di website Anda. Cek ukuran file di hasil PageSpeed, biasanya muncul di rekomendasi “Properly size images” atau “Serve images in next-gen formats”.

Perbaikan yang paling cepat memberi hasil: kompresi gambar dengan Squoosh sebelum upload, ubah format ke WebP, dan tentukan lebar tampil gambar di CSS agar browser tidak mengunduh resolusi berlebih.

2. INP (Interaction to Next Paint) — responsivitas saat diklik

INP mengukur jeda antara saat pengunjung menekan tombol atau mengetuk menu dengan saat halaman memberi reaksi. Ambang batasnya: baik di bawah 200 milidetik, buruk di atas 500 milidetik.

INP buruk biasanya bukan soal server, melainkan terlalu banyak script yang dieksekusi di browser. Plugin berlebih, slider berat, dan widget chat yang memuat tiga library sekaligus adalah tersangka utama. Di website WordPress, jumlah plugin aktif sering berkorelasi langsung dengan INP yang memburuk.

Cara murah mengujinya: matikan satu per satu plugin yang tidak wajib dalam satu jam sepi, lalu ukur ulang. Kalau INP membaik, plugin itu penyebabnya. Tanyakan ke pengembang Anda plugin mana yang bisa dilepas.

pengunjung membuka website dari ponsel
Photo by Jonas Leupe on Unsplash

3. CLS (Cumulative Layout Shift) — kestabilan tata letak

CLS mengukur seberapa sering elemen bergeser posisi saat halaman sedang dimuat. Ambang batas baik: di bawah 0,1.

Ini metrik yang paling sering diabaikan padahal paling menjengkelkan. Contoh nyata yang dialami hampir semua orang: pengunjung akan menekan tombol “Beli”, lalu tiba-tiba banner iklan muncul di atas tombol itu dan menggeser posisi, sehingga yang tertekan justru tombol lain. Pengunjung seperti itu jarang kembali.

Penyebab CLS yang umum: gambar atau iframe tanpa atribut width dan height, font kustom yang baru dimuat setelah teks muncul, serta iklan atau banner yang disisipkan dinamis tanpa ruang yang dipesan lebih dulu.

Ringkasan Ambang Batas Core Web Vitals

Metrik   Baik        Perlu Perbaikan   Buruk
LCP      < 2,5 dtk   2,5 - 4 dtk       > 4 dtk
INP      < 200 ms    200 - 500 ms      > 500 ms
CLS      < 0,1       0,1 - 0,25        > 0,25

Catat angka Anda hari ini, termasuk tanggal pengecekan. Tanpa baseline, Anda tidak akan tahu apakah perubahan yang dikerjakan benar-benar membantu.

Priority Fix: Urutan Perbaikan yang Benar

Kesalahan paling umum adalah mengerjakan sesuatu yang terlihat keren di daftar rekomendasi padahal dampaknya kecil. Urutkan begini:

Langkah 1 — Kompresi dan resize semua gambar

Satu langkah ini biasanya menyelesaikan separuh masalah LCP. Pasang plugin kompresi gambar di WordPress, atau kompresi manual file-file terbesar dulu. Sisakan hanya gambar di atas lipatan yang dimuat segera; sisanya biarkan loading="lazy".

Langkah 2 — Buang plugin dan script yang tidak dipakai

Buka daftar plugin aktif. Untuk setiap plugin, tanyakan satu hal: kalau dimatikan hari ini, apakah ada yang benar-benar rusak? Plugin deactivated tapi masih terpasang juga sebaiknya dihapus, bukan dibiarkan.

Langkah 3 — Pakai caching dan pindahkan CSS yang menghalangi render

Aktifkan caching halaman dan minimalkan CSS serta JavaScript. Ini bagian teknis yang paling pas dikerjakan pengembang website Anda, bukan dicoba-coba sendiri lewat plugin acak.

Langkah 4 — Pesan ruang untuk elemen dinamis

Beri tinggi tetap pada slot banner, embed peta, dan iframe agar tidak ada elemen yang menggeser tata letak setelah halaman terbuka.

Langkah 5 — Ukur ulang setelah 24-48 jam

PageSpeed Insights memakai data lapangan dari pengunjung nyata yang butuh waktu untuk terkumpul. Jangan panik kalau angka belum berubah lima menit setelah deploy. Beri jeda, lalu bandingkan dengan baseline Anda.

Kapan Sebaiknya Serahkan ke Ahli

Empat langkah pertama masih mungkin dikerjakan sendiri kalau Anda cukup nyaman dengan dashboard WordPress. Tapi kalau hasil PageSpeed menunjukkan masalah di sisi server seperti TTFB yang tinggi, konfigurasi hosting yang salah, atau tema yang sudah tidak lagi dioptimalkan, memperbaikinya sendiri berisiko merusak tampilan website.

Di Digital Konsultan, pekerjaan kecepatan website kami mulai dari audit skor, pengecekan ukuran gambar dan plugin, sampai perbaikan sisi server. Klien biasanya melihat perubahan paling besar pada kunjungan pertama, karena biasanya masalah terbesar ada di bobot gambar yang tidak pernah dikompresi sejak awal.

Kalau website Anda sudah cukup lama dan sering diutak-atik tanpa rencana, ada kemungkinan masalahnya bukan sekadar optimasi gambar. Anda bisa mulai dari artikel blog kami atau konsultasi singkat lewat WhatsApp untuk menilai apakah website Anda perlu dioptimasi atau dirombak.

FAQ Core Web Vitals untuk UMKM

Apakah Core Web Vitals berpengaruh langsung ke peringkat Google?

Bukan satu-satunya faktor, dan dampaknya lebih kecil daripada relevansi konten serta kualitas backlink. Tapi kecepatan dan kestabilan halaman tetap menjadi faktor, terutama saat dua halaman bersaing di posisi yang berdekatan. Yang jelas bisa Anda ukur: kecepatan berpengaruh ke konversi, dan itu berpengaruh langsung ke pemasukan.

Ukuran gambar yang aman untuk website seberapa besar?

Targetkan di bawah 200 KB per gambar setelah kompresi. Foto hero lebar boleh sampai 300 KB bila memang tampil besar. Untuk foto produk, lebar 1200 piksel sudah lebih dari cukup karena tidak akan ditampilkan lebih besar dari itu di layar ponsel.

Apakah skor PageSpeed 100 itu wajib?

Tidak. Skor 100 hanya angka ringkasan dari Lighthouse, dan tool itu sering menyarankan hal yang tidak realistis untuk website jualan yang butuh plugin. Acuan yang lebih penting adalah ketiga metrik Core Web Vitals berada di zona “baik”, bukan skor totalnya.

Kalau sudah pakai plugin caching, apakah Core Web Vitals otomatis bagus?

Belum. Plugin caching terutama memperbaiki metrik server dan LCP, sementara INP dan CLS sering tetap bermasalah karena disebabkan script yang berat dan elemen yang tidak diberi ruang tetap. Perlu perbaikan terpisah pada dua hal tersebut.

Berapa lama hasil perbaikan terlihat di Google?

Data lapangan di PageSpeed Insights biasanya diperbarui dalam beberapa hari sampai beberapa minggu. Perubahan peringkat di pencarian bisa lebih lambat lagi. Fokus dulu pada hasil pengukuran ulang di tab Lighthouse, karena itu memberi respons paling cepat.

Langkah Mudah yang Bisa Dikerjakan Hari Ini

Buka PageSpeed Insights, catat tiga angka Core Web Vitals Anda di tab mobile, lalu simpan tanggalnya. Setelah itu cek folder gambar website Anda dan cari file di atas 500 KB. Mengompresi file-file itu hari ini adalah perbaikan dengan hasil terbesar untuk usaha paling kecil.

Kalau Anda ingin tahu posisi website Anda dan mendapatkan rencana perbaikan yang jelas, kirim pesan lewat WhatsApp 082225665053 atau kunjungi kantor kami di Jl. Bayat-Cawas, Tegalrejo, Bayat, Klaten. Kami bantu Anda melihat mana yang perlu dibereskan lebih dulu.

Chat dengan kami