undercover.co.id – Google Core Web Vitals adalah inovasi terbaru dari Google yang di-design untuk meningkatkan user experience pada website. Core Web Vitals juga dijadikan faktor utama baru yang mempengaruhi penilaian rangking website di halaman pencarian.

Update Google Core Web Vitals :

Metrik Core Web Vitals Google yang Baru: Cara Meningkatkan Interaction To Next Paint (INP)
Pelajari bagaimana Core Web Vitals berubah dan apa yang dapat Anda lakukan untuk mendapatkan nilai yang baik pada Interaction to Next Paint, metrik pengalaman halaman baru Google.

Selama beberapa tahun terakhir, Google telah merombak sinyal pengalaman halaman mana yang dikumpulkan dan digunakan sebagai faktor peringkat.

Setelah memperkenalkan Core Web Metrics, Google secara bertahap mengubah cara pengukurannya agar lebih mencerminkan pengalaman pengguna yang sebenarnya.

Namun, dengan diperkenalkannya metrik Interaction to Next Paint (INP), Google kini telah mengumumkan pembaruan Core Web Vitals terbesar sejak peluncuran aslinya.

Apa yang perlu Anda lakukan sebelum INP menjadi sinyal peringkat?

Apa itu Interaction to Next Paint?
Metrik Interaction to Next Paint (INP) memberi tahu Anda interaksi apa yang menunda pengalaman pengunjung saat menggunakan situs web Anda.

INP mengukur berapa lama waktu yang berlalu antara interaksi pengguna (seperti klik atau input sentuhan) dan “cat berikutnya” yang secara visual memperbarui situs web.

Misalnya, jika pengguna mengklik sebuah tombol dan kemudian halaman hang selama setengah detik sebelum diperbarui, nilai INP akan menjadi 500 milidetik.

Browser menghabiskan waktu tersebut untuk menjalankan kode situs web dan merender halaman yang diperbarui.

Untuk memberikan pengalaman yang baik dan memenuhi kriteria Core Web Vitals Google, INP Anda harus berada di bawah 200 milidetik.

Sebagian besar situs merasa cukup mudah untuk memenuhi ambang batas Penundaan Input Pertama, dengan 93% situs seluler memberikan pengalaman yang baik.

Sebaliknya, hanya 64% situs yang saat ini memiliki kinerja yang baik dalam metrik Interaction to Next Paint.

Anda bisa menggunakan alat gratis seperti PageSpeed Insights untuk melihat seberapa baik kinerja situs Anda.

Apa yang Menyebabkan Lambatnya Interaksi Ke Skor Paint (INP) Berikutnya?
Pemrosesan CPU yang sedang berlangsung pada halaman yang mencegah browser menampilkan konten halaman yang diperbarui adalah yang menyebabkan skor INP lambat.

Untuk mengurangi skor INP dengan mudah:

Gunakan RUM untuk secara otomatis mengungkap elemen halaman yang lambat.
Lihat dengan cepat elemen halaman yang paling sering mengakibatkan interaksi yang lambat.
Lakukan perubahan.
Tangkapan layar dari produk DebugBear RUM ini menunjukkan bagaimana pengguna yang berbeda berinteraksi dengan elemen halaman yang berbeda, dan bagaimana mereka mengalami jumlah penundaan input yang berbeda sebagai hasilnya.

Google Core Web Vitals

Ada tiga komponen Core Web Vitals yang ditetapkan Google, diantaranya:

• Largest Contentful Paint (LCP): Berapa waktu yang dibutuhkan untuk me-loading konten paling penting dalam website anda.
• Cumulative Layout Shift (CLS): Seberapa banyak konten website anda “berubah” saat proses loading (yang berarti user experience yang buruk). Misalnya jika anda memiliki iklan dengan waktu loading lambat yang “mendorong” konten anda ke bawah setelah ter-loading, ini termasuk dalam perubahan layout yang dimaksud.
• First Input Delay (FID): Waktu yang dibutuhkan saat pengunjung meng-klik sesuatu di website anda sampai akhirnya proses klik tersebut mulai memproses fungsinya.

Cara paling mudah untuk mengecek kemampuan website anda berdasarkan Core Web Vitals adalah melalui Google PageSpeed Insights yang menyediakan data untuk ketiga parameter di atas. Anda harus mengecek performa website anda dalam mobile dan desktop, karena keduanya akan menghasilkan hasil yang berbeda.

Sekarang mari kita masuk ke pembahasan yang lebih dalam seputar ketiga komponen Core Web Vitals ini.

Largest Contentful Paint (LCP)

Largest Contentful Paint (LCP) mengukur seberapa lama waktu yang dibutuhkan untuk konten utama sebuah website ter-loading.

LCP terdengar mirip dengan parameter lain, yaitu First Contentful Paint (FCP). Bedanya, LCP fokus pada waktu loading konten”utama”, sementara FCP fokus pada waktu loading konten “pertama”.

“Elemen” LCP bisa berbeda untuk setiap website, dan itu juga tergantung versi desktop dan mobile dari masing-masing website. Terkadang elemen LCP bisa berupa gambar, atau bisa juga berupa teks.

Anda bisa melihat jenis elemen website anda pada bagian “Diagnostics” pada PageSpeed Insights. Lalu klik di tab “Largest Contentful Paint element”

Singkatnya, LCP mengukur seberapa lama elemen-elemen ini muncul dan bisa dilihat oleh pengunjung. Berikut adalah standar tingkat LCP menurut Google:

• Baik:
• Butuh perbaikan: 2,5 – 4 detik
• Buruk: > 4 detik

Cumulative Layout Shift (CLS)

Cumulative Layout Shift (CLS) berfokus pada bagaimana website anda ter-loading dan apakah konten anda”berubah” saat ada elemen baru yang ter-loading. Contohnya adalah jika artikel dalam suatu website terus bergerak-gerak saat website dalam proses me-loading iklan atau saat tombol perintah suatu website berpindah dan membuat pengunjung meng-klik tombol yang salah.

Anda bisa mengukur skor CLS anda menggunakan “Lab Data” dan “Field Data” pada PageSpeed Insights. Berikut adalah standar tingkat CLS menurut Google:

• Baik:
• Butuh perbaikan: 0,1 – 0,25
• Buruk: > 2,5

Jika anda meng-klik “Avoid large layout shifts” di bagian “Diagnostics” pada PageSpeed Insights, anda bisa menemukan elemen-elemen pada website anda yang “berubah” dan mempengaruhi skor CLSnya.

First Input Delay (FID)

First Input Delay (FID) mungkin adalah parameter yang paling sulit untuk dimengerti dan juga untuk di-optimalkan. Singkatnya, FID adalah waktu yang dibutuhkan website anda untuk menjadi interaktif setelah pengunjung meng-klik tombol/link atau saat pengunjung berinteraksi dengan JavaScript pada website.

FID sangat dipengaruhi oleh JavaScript. Misalnya, jika pengunjung yang mengakses website anda dari handphone sedang memproses file JavaScript berukuran besar dari website anda, maka pada saat itu website anda mungkin menjadi tidak interaktif saat pengguna mencoba meng-klik sesuatu.

Berikut adalah standar tingkat FID menurut Google:

• Baik:
• Butuh perbaikan: 100 – 300 ms
• Buruk: > 300 ms

Anda hanya bisa melihat waktu FID website anda di bagian “Field Data” pada PageSpeed Insights. Sayangnya, jika website anda tidak memiliki cukup data untuk mengisi bagian “Field Data”, tidak ada cara yang mudah untuk mengukur waktu FID website anda.

baca juga

• Google Core Web Vitals
• Cara Memilih Nama Domain Terbaik
• Standarisasi W3C
• Robots.txt : Sebuah Tindakan Preventif dari Pengindeksan
• Tag Noindex dan Nofollow-Dofollow

Mengenal Lebih Dalam Tentang Google Core Web Vitals

Google baru saja mengeluarkan daftar Frequently Asked Question (FAQ) atau pertanyaan yang sering ditanyakan seputar cara kerja Core Web Vitals (CWV), apa saja yang tidak diukur, dan porsinya untuk penentuan ranking.

Tujuan perumusan CWV

Tujuan utama dicetuskannya Core Web Vitals adalah untuk memiliki parameter yang sama untuk semua situs dengan tujuan meningkatkan user experience. Google merekomendasikan semua website menggunakan tiga parameter CWV sebagai panduan untuk mengoptimalkan user experience pada website mereka.

Pengukuran parameter CWV dilakukan per halaman, sehingga anda mungkin menemukan beberapa halaman performanya lebih baik dibandingkan yang lain. Keuntungan dari menerapkan CWV yang baik tentunya adalah meningkatkan kepuasan pengunjung website, dan Google juga memiliki tujuan jangka panjang untuk membuat standar parameter user experience pada semua website.

Mengenal AMP

AMP adalah singkatan dari Accelerated Mobile Pages. AMP ini adalah framework HTML yang digunakan untuk memberikan tampilan halaman website yang ringan, memiliki loading cepat, dan menarik melalui handphone.

AMP awalnya dikembangkan oleh Google dengan sistem open source. AMP bisa mengakomodasi situs ecommerce dan situs internasional.

Google akan memperhatikan versi AMP dari website dalam proses penghitungan skor Core Web Vitals. Jadi, jika ada website yang kesulitan mengoptimalkan CWV, menggunakan AMP adalah cara yang mudah dan cepat untuk meningkatkan skor Core Web Vitals.

Tapi Google juga memperingatkan adanya faktor lain yang bisa berdampak negatif pada skor CWV, seperti server yang lambat atau gambar yang tidak teroptimisasi.

Yang tidak dihitung dalam FID

First Input Delay (FID) adalah salah satu parameter dalam Core Web Vitals yang mengukur waktu sebuah situs menjadi interaktif dan merespon tindakan pengunjung (seperti meng-klik sesuatu). Lalu ada istilah bounce yang terjadi saat pengunjung meninggalkan halaman website setelah hanya melihat satu halaman itu saja.

Terkadang, walaupun tidak melihat lebih jauh, pengunjung tetap men-scroll halaman website tersebut. Jadi pertanyaannya adalah apakah proses scrolling ini akan terhitung ke dalam skor FID?

Google menjawab bahwa bounce bukanlah bagian dari parameter FID, karena tidak ada interaksi di dalamnya. Jadi FID tidak menghitung proses scrolling pengguna sebagai interaksi.

Core Web Vitals mempengaruhi ranking

Mulai bulan Mei 2021, Core Web Vitals akan dimasukan ke dalam sinyal atau parameter untuk mengukur page experience, digabungkan dengan parameter lain yang sudah ada sebelumnya seperti mobile friendly, safe-browsing, keamanan https, dan panduan fitur yang mengganggu.

Setiap parameter yang mengukur ranking memiliki bobotnya masing-masing. Sehingga akan ada beberapa parameter yang lebih penting dibanding parameter yang lain.

Google menyatakan bahwa sinyal dari Core Web Vitals bobotnya lebih sedikit dibandingkan dengan parameter lain yang secara langsung berkaitan dengan memuaskan pencarian pengguna. Google juga menekankan bahwa pemilik website harus tetap membuat konten yang baik dan relevan dengan informasi yang dicari pengguna supaya mendapatkan skor ranking yang tinggi.

Perbedaan data report Core Web Vitals

Banyak pengguna yang mengatakan bahwa halaman website-nya tergolong cepat, tapi tetap mendapat peringatan dari Core Web Vitals report. Google menjawab bahwa kecepatan loading halaman tersebut yang dirasakan oleh pengguna bisa berbeda-beda.

Ada beberapa faktor yang mempengaruhinya seperti gadget yang digunakan, jaringan internet, hingga wilayah geografis. Core Web Vitals mengambil data dari keseluruhan kunjungan pengguna, sehingga perbedaan ini mungkin saja terjadi.

Tips Meningkatkan Performa Core Web Vitals Website Anda

Bagi anda para pemilik website, apakah sudah mengetahui dan mengenal tentang Core Web Vitals. Ya, Core Web Vitals adalah inovasi tiga parameter baru dari Google yang digunakan untuk menentukan skor dan peringkat website di halaman hasil pencarian.

Ketiga parameter tersebut adalah:

• Largest Contentful Paint (LCP): waktu loading konten utama website
• Cumulative Layout Shift (CLS): tingkat perubahan layout website saat proses loading
• First Input Delay (FID): waktu untuk proses interaktif setiap fitur pada website

Setiap masing-masing dari ketiga parameter tersebut memiliki strategi tersendiri untuk memaksimalkannya. Berikut adalah tips yang bisa anda terapkan untuk meningkatkan performa Core Web Vitals website anda:

 

Meningkatkan performa Largest Contentful Paint (LCP)

Mengoptimalkan performa Largest Contentful Paint (LCP) adalah yang paling mudah dibandingkan dua parameter lainnya. Di bawah ini adalah beberapa cara yang bisa dilakukan:

• Memilih hosting yang cepat

Pemilihan hosting akan mempengaruhi respons server dan memiliki peran besar dalam performa LCP website anda. Hosting yang cepat tentunya dapat membantu website anda untuk bisa ter-loading dengan lebih cepat.

• Menggunakan page caching

Page caching juga bisa mempercepat respon server anda. Penelitian juga menunjukkan bahwa page caching dapat mempercepat waktu loading website hingga 33,3%.

• Optimalkan gambar

Sebagian besar elemen LCP adalah berupa gambar, jadi mengoptimalkan gambar yang anda upload bisa meningkatkan performa LCP. Anda bisa memilih gambar dengan ukuran kecil tapi tetap memiliki resolusi dan kualitas yang baik.

• Optimalkan code

Jika website anda harus me-loading CSS atau JavaScript yang tidak penting sebelum me-loading konten utama, ini akan sangat memperburuk performa LCP website anda. Anda bisa memperbaikinya dengan mengurangi fitur-fitur yang tidak perlu.

• Gunakan CDN untuk pengunjung global

Jika website anda memiliki pengunjung skala global, atau dengan kata lain lokal dan internasional, CDN (Content Delivery Network) bisa mempercepat performa LCP website anda.

Meningkatkan performa Cumulative Layout Shift (CLS)

Mengoptimalkan Cumulative Layout Shift (CLS) pada website akan lebih banyak berfokus pada masalah teknis dan pengkodean dari website anda. Di bawah ini adalah beberapa masalah yang sering muncul:

• Gambar tanpa dimensi

Ada berbagai cara memasukkan gambar, dan jika jalur yang anda pilih tidak secara otomatis menambahkan dimensi, pastikan untuk menambahkan dimensi secara manual.

• Iklan, embed, dan iframe tanpa dimensi

Sama seperti gambar, me-loading embed tanpa dimensi juga bisa menjadi masalah. Pastikan untuk selalu menspesifikasikan ukuran saat menggunakan ember. Jika menempatkan iklan, pastikan untuk menentukan tempat atau ruang untuk setiap iklannya.

• Font dalam web

Jika anda menggunakan font custom, font yang ter-loading lama dapat menyebabkan masalah seperti Flash of Invisible Text (FOIT) atau Flash of Unstyled Text (FOUT). Solusinya adalah dengan menggunakan font web preloading.

• Konten terinjeksi

Jangan secara dinamis meng-inject konten apapun di atas konten yang sudah ada. Kecuali itu merupakan respons dari tindakan pengunjung.

baca juga

Meningkatkan performa First Input Delay (FID)

Yang terakhir adalah meningkatkan performa First Input Delay (FID). Ini adalah yang paling rumit karena sepenuhnya bergantung pada code.

Singkatnya, anda mungkin sebaiknya membatasi eksekusi JavaScript yang berat sehingga browser masih bisa merespon interaksi pengunjung dengan cepat. Anda bisa mulai dengan membuang JavaScript yang tidak penting, atau jika anda masih memiliku task yang berat, anda bisa membaginya menjadi beberapa task yang lebih kecil atau menggunakan semacam web worker.

Sekali lagi, proses ini akan sulit jika anda bukan ahlinya. Sehingga anda mungkin perlu untuk mencari ahli dalam memperbaiki website untuk membantu anda.