SEO Teknis·17 Maret 2026·9 menit baca

#core-web-vitals #technisches-seo #wordpress

Optimasi Core Web Vitals WordPress: Meningkatkan LCP, INP & CLS (2026)

Core Web Vitals adalah faktor peringkat langsung Google. Kami tunjukkan langkah demi langkah cara meningkatkan LCP, INP, dan CLS secara terukur di situs WordPress Anda.

Apa Itu Core Web Vitals dan Mengapa Menjadi Faktor Peringkat?

Sejak pembaruan Google Page Experience, Core Web Vitals menjadi faktor peringkat langsung — Google menggunakannya untuk mengevaluasi seberapa cepat dan stabil situs web Anda dimuat bagi pengguna nyata.

Tiga metrik secara ringkas:

LCP (Largest Contentful Paint): Seberapa cepat elemen terbesar yang terlihat dimuat? Target: di bawah 2,5 detik.
INP (Interaction to Next Paint): Seberapa cepat halaman merespons input pengguna? Target: di bawah 200 ms.
CLS (Cumulative Layout Shift): Seberapa stabil tata letak saat pemuatan? Target: di bawah 0,1.

Menurut data HTTP Archive, hanya 44% dari seluruh situs WordPress yang memenuhi ketiga metrik di perangkat seluler. Ini adalah peluang Anda untuk mengalahkan kompetitor.

Diagnosis: Di Mana Posisi Anda?

Sebelum mengoptimalkan, Anda perlu mengukur. Alat-alat ini menunjukkan performa Anda saat ini:

Google PageSpeed Insights menganalisis URL dalam mode lab dan mode data lapangan (data pengguna nyata dari Chrome User Experience Report). Masukkan halaman terpenting Anda — beranda, halaman kategori, halaman produk.

Google Search Console → Laporan Core Web Vitals menampilkan semua halaman di domain Anda yang dinilai "buruk" atau "perlu perbaikan". Ini adalah titik awal terpenting, karena Google menggunakan data ini secara persis untuk peringkat.

WebPageTest.org memungkinkan pengujian dengan berbagai perangkat dan kecepatan jaringan — ideal untuk mensimulasikan pengalaman pengguna seluler secara realistis.

Meningkatkan LCP: Memuat Elemen Terbesar Lebih Cepat

LCP pada sebagian besar situs WordPress ditentukan oleh gambar hero, judul H1, atau thumbnail video besar.

Optimalkan gambar hero:

Sajikan gambar dalam format WebP (30–50% lebih kecil dari JPEG/PNG)
Tandai gambar LCP dengan fetchpriority="high":
Nonaktifkan lazy loading secara eksplisit untuk gambar LCP: loading="eager"

Kurangi TTFB (Time to First Byte): Server yang lambat menunda segalanya. Periksa penyedia hosting Anda — untuk WordPress, penyedia dengan cache sisi server direkomendasikan. Target: TTFB di bawah 800 ms.

Inline CSS kritis: File CSS memblokir rendering. Alat seperti WP Rocket atau NitroPack dapat secara otomatis mengekstrak CSS kritis dan menyisipkannya inline di , sementara sisanya dimuat secara asinkron.

Plugin yang direkomendasikan untuk LCP:

WP Rocket — Solusi all-in-one dengan preloading, CSS kritis, dan optimasi TTFB
Imagify / ShortPixel — Konversi dan kompresi WebP otomatis
Cloudflare (gratis) — CDN mengurangi TTFB secara signifikan secara global

Meningkatkan INP: Membuat Halaman Merespons Input

INP menggantikan metrik FID lama pada tahun 2024 dan mengukur waktu respons untuk semua interaksi pengguna (klik, ketukan, input keyboard).

Kurangi kelebihan JavaScript: Setiap plugin yang tidak diperlukan memuat JavaScript. Nonaktifkan plugin yang tidak Anda butuhkan. Dengan tab Performance Chrome DevTools, Anda dapat melihat skrip mana yang paling lama memblokir.

Muat skrip sesuai kebutuhan: Plugin seperti Perfmatters memungkinkan Anda memuat skrip hanya di halaman tertentu atau hanya setelah interaksi pengguna (defer, async).

Hilangkan sumber daya yang memblokir rendering: Skrip di tanpa defer atau async memblokir rendering sepenuhnya. Sebagian besar plugin modern dimuat dengan benar, tetapi tema dan plugin lama sering tidak.

Menghilangkan CLS: Tidak Ada Lagi Pergeseran Tata Letak

Tidak ada yang lebih membuat frustrasi pengguna daripada halaman yang bergeser saat dimuat, menyebabkan mereka mengklik tombol yang salah.

Selalu sertakan dimensi gambar: Tanpa atribut width dan height, browser tidak tahu berapa banyak ruang yang dibutuhkan gambar sebelum dimuat:

<img src="image.webp" width="800" height="450" alt="..." />

Stabilkan font web: Font kustom menyebabkan Flash of Invisible Text (FOIT) atau Flash of Unstyled Text (FOUT). Solusi: font-display: swap dalam deklarasi CSS. Lebih baik lagi: host font secara lokal alih-alih memuatnya dari Google Fonts.

Cadangkan ruang untuk iklan dan embed: Ketika iklan, embed YouTube, atau banner cookie disisipkan ke halaman setelah pemuatan, tata letak bergeser. Selalu cadangkan tinggi tetap untuk elemen-elemen tersebut melalui CSS.

Pemantauan: Pantau Nilai Secara Berkelanjutan

Optimasi bukanlah tugas sekali jalan. Setiap plugin baru, setiap pembaruan tema dapat memperburuk Core Web Vitals.

Google Search Console secara otomatis memberi tahu Anda ketika halaman turun ke kategori "buruk".

AniSEO memantau situs WordPress Anda secara terus-menerus dan secara proaktif menyarankan optimasi — sebelum terjadi penurunan peringkat.

Pantau Core Web Vitals secara otomatis dengan AniSEO →

Artikel terkait: