Apa itu Google Page Experience dan Pengaruhnya Terhadap SEO

Page Experience adalah pengukuran tingkat kenyamanan pengguna saat mengakses suatu website. Pengukuran metriks ini didasarkan atas pengalaman pengguna, baik pengguna website yang bersumber dari desktop dan seluler.

Artinya, Google menilai Page Experience sebagai salah satu metrics perangkingan baru pada mesin pencari yang sejajar dengan metrics lainnya seperti backlink.

Pembaruan SEO Google di 2021

Menurut John Mueller, Google sendiri mengimplementasikan secara bertahap mulai bulan Mei sampai sepenuhnya pada bulan Juli 2021. Oleh karena itu Page Experience adalah faktor penting yang sangat perlu diperhatikan jika sobat ingin website yang dibangun menempati posisi page one di Google search.

Apakah Page Experience Penting?

Setiap hari, lebih dari 3,5 miliar pencarian dilakukan di Google. Jika dihitung artinya ada 40.000 pencarian per detiknya. Dan dari orang-orang yang melakukan miliaran penelusuran ini, 75 persen halaman tidak mencapai page one.

Pertanyaannya, apakah sobat masih tidak menganggap Page Experience ini sesuatu yang penting? Dengan mengabaikan faktor ini sangat bisa dipastikan bahwa halaman yang sobat bangun baik yang sudah ada maupun belum akan mengalami kesulitan mendapatkan trafik organik dari pencarian Google search.

Berikut ini video tentang implementasi Page Experience secara mendetail oleh Jeffrey Jose, Manajer Produk di Google Search

Page Experience atau Pengalaman Pengguna merupakan metrics yang dikumpulkan dari data web inti (core web vital) 28 hari pengunjung pada suatu halaman website yang kita buat.

Jadi ketika seseorang mengunjungi halaman website kita, metriks tadi akan terekam secara otomatis ke Google lewat perangkat yang digunakan oleh pengguna.

Page Experience meliputi 5 parameter pokok antara lain:

1. Core web vitals, terdiri atas tiga komponen:
   • largest contentful paint (LCP) — mengukur kecepatan pemuatan halaman.
   • first input delay (FID) — mengukur kecepatan interaktivitas pada halaman.
   • cumulative layout shift (CLS) — mengukur stabilitas visual pada halaman.
2. mobile-friendly — artinya ramah untuk pengguna seluler,
3. safe browsing — keamanan browsing.
4. HTTPS — halaman yang terenkripsi protokol SSL,
5. mobile popup algorithm/no intrusive interstitial — artinya halaman tanpa intrusi adanya pop-up yang mengganggu kenyamanan pengguna.

Pada topik ini kita akan membahas yang paling penting yaitu data web ini (core web vital).

Bagaimana cara mengetahui halaman telah memiliki Page Experience yang baik?

Cara termudah untuk mengetahui suatu halaman telah memenuhi kriteria Page Experience yang baik dengan menguji halaman tersebut di Pagespeed Insight

Pagespeed Insight dapat menampilkan hasil pengujian 3 metrics largest contentful paint (LCP), first input delay (FID), dan cumulative layout shift (CLS). Ini bisa dijadikan sebagai tolak ukur awal analisis performa halaman yang kita bangun.

Perlu diketahui bahwa hasil di Pagespeed Insight bisa berbeda dengan kenyataan di lapangan, semisal skor di pagespeed insight tidak begitu bagus, namun data pada core web vital hasilnya bagus, dan sebaliknya.

Perlu diingat, Pagespeed Insight bisa digunakan sebagai pengukuran saja, namun hasil core web vital tetaplah data langsung yang diambil dari pengalaman pengguna saat berkunjung.

Mengapa demikian?

Karena Pagespeed Insight mengukur performa website dari servernya di Amerika. Jika sumber pengunjung website yang sobat bangun menargetkan audience dari Indonesia, tentu hasilnya bisa sangat berbeda. Karena perbedaan lokasi tadi.

Data web inti (core web vital) menunjukkan pengalaman pengguna yang berbeda dengan hasil pengukuran Pagespeed Insight.

Melihat Page Experience via Google Search Console

Cara lainnya untuk melihat Page Experience melalui Google Search Console. Jika sobat telah memiliki website yang didaftarkan ke Google Search Console (GSC) maka hasilnya bisa dilihat langsung, namun jika sobat belum mendaftarkan sangat disarankan untuk mendaftarkan website sobat ke Google Search Console. Ini akan sangat membantu.

Dalam Core Web Vital, parameter pengukuran Page Experience yang pertama adalah Largest Contentful Paint (LCP). Ketika suatu halaman dimuat maka perangkat akan me-render DOM, layout, gambar, gaya, font dan lain-lain.

Largest Contentful Paint adalah waktu yang dibutuhkan halaman website untuk menyajikan konten utama di layar pengguna. Konten utama ini adalah, gambar, teks, dan video yang terletak pada viewport pertama pada layar perangkat.

Jadi nilai LCP bisa berbeda-beda tergantung perangkat yang digunakan. Sebagai contoh nilai LCP pada perangkat seluler bisa berbeda dengan perangkat desktop. Itulah sebabnya kita perlu melakukan optimasi LCP pada setiap tampilan perangkat yang digunakan.

Apa Yang Menyebabkan Nilai LCP buruk?

• Respons server lambat — ketika seseorang mengakses suatu halaman, maka komputer server akan memberikan hasil request yang diminta. Namun jika lokasi antara pengguna dan server terlampau jauh maka akan ada sedikit delay atau jeda saat akan mengakses file-file yang ada di web server.
  
• Tertundanya render halaman akibat adanya JavaScript dan CSS — ketika halaman diakses, browser akan melakukan perenderan halaman sebelum menampilkan isi kontennya. Perenderan ini biasanya berupa tata letak, gaya (styling) jenis font, dan beberapa menu serta navigasi penting di website. Jika halaman berisi terlalu banyak JavaScript dan CSS maka terjadi kelambatan sebelum konten inti bisa tertampil sepenuhnya.
  
• Waktu loading resource/ sumber daya yang lambat — Ini bisa terjadi akibat lambatnya akses storage pada web server, kecepatan prosesor dan pengaruh halaman yang belum terkompresi.

Bagaimana Cara Memperbaiki LCP?

• Memindahkan lokasi hosting ke lebih dekat dengan target audience — Misalnya kamu memiliki website yang di hosting di Amerika sementara target pengunjungnya ada di Indonesia, maka jarak antara Amerika - Indonesia dapat menyebabkan jeda yang cukup tinggi.
  
  Ada sekitar 500 milidetik atau 0.5 detik jeda antara Amerika - Indonesia.
  
  Menurut Google, pengunjung akan meninggalkan halaman jika halaman dimuat lebih dari 2.5 detik. Setengah detik jeda mungkin terdengar kecil, namun ini baru request pertama saja, belum dihitung perenderan DOM, dan elemen lainnya. Jika kamu memiliki banyak elemen dalam konten maka setengah detik tadi akan terasa signifikan untuk menampilkan LCP dibawah 2.5 detik.
  
  Jadi jika kamu menargetkan audience Indonesia, maka pilihlah web hosting yang berlokasi di Indonesia, dan jika menargetkan luar negeri seperti Amerika lebih baik memilih web hosting yang berlokasi di Amerika juga.
  
• Mengurangi penundaan render halaman oleh Javascript dan CSS — Ini bisa ditempuh dengan cara mengurangi script JavaScript dan meminifikasi CSS, membuang script dan styling yang tidak digunakan dan sebisa mungkin menempatkan script setelah konten utama termuat sepenuhnya.
  
  Menggunakan rel="preload" pada font untuk mempercepat tampilan font dan menggunakan fallback font jika font gagal termuat.
  
• Mempercepat waktu loading resource/ sumber daya — Dengan cara mengurangi ukuran gambar, melakukan konversi format gambar ke generasi selanjutnya (.webp), memindahkan gambar ke sumber daya yang lebih cepat seperti cloud CDN, atau memindahkan hosting ke media penyimpanan yang lebih mutakhir seperti media penyimpan jenis SSD.

First Input Delay (FID) merupakan metrics kedua dalam Core Web Vital yang mengukur seberapa cepat interaksi pengguna ketika halaman sedang dimuat.

Interaksi yang dimaksud adalah scrolling halaman, penginputan data pada kolom pencarian, menekan gambar, tombol-tombol dan link yang ada pada halaman dan lain-lain.

Parameter yang dihitung sebagai FID

• Field teks, checkbox, dan tombol radio
• Menu dropdown
• Link-link

Penjelasan mudahnya, coba kunjungi halaman suatu website lalu lihat seberapa cepat kamu bisa menggulir halaman tersebut kebawah atau keatas. Semakin cepat FID berarti semakin cepat pulalah pengguna dapat berinteraksi pada halaman. Page Experience menilai ini sebagai suatu parameter penting, karena dapat meningkatkan kenyamanan pengguna.

Pernahkah kamu membuka suatu website, gambar dan konten sudah termuat tetapi kamu tidak bisa menggulir ke atas atau ke bawah (stuck). Terasa menyebalkan bukan?

Cara Memaksimalkan FID

FID adalah metrik lapangan sedangkan Lighthouse adalah alat metrik lab, cara meningkatkan FID sama dengan panduan untuk meningkatkan Total Blocking Time (TBT), diantaranya

• Mengurangi dampak kode pihak ketiga.
• Mengurangi waktu eksekusi JavaScript.
• Meminimalkan main thread work.
• Mempertahankan jumlah permintaan tetap rendah dan ukuran transfer yang kecil.

Cumulative Layout Shift (CLS) merupakan metriks ketiga penilaian core web vital yang cukup signifikan.

Apa itu CLS?

Layout Shift (LS) adalah pergeseran tata letak ketika halaman sedang dimuat. Sebagai contoh ketika kita membuka suatu halaman dan sedang asyik membaca tiba-tiba tulisannya bergeser atau gambarnya bergeser ke bawah atau ke atas tanpa diminta. Cukup menjengkelkan bukan?

Dalam beberapa kasus Ini bisa sangat mengganggu, misalnya kita menjadi tidak sengaja mengklik iklan, atau tautan ke tempat yang tidak diinginkan.

Pergeseran tata letak ini bisa diakibatkan gambar, teks/font, video dan elemen web lain-lain yang belum termuat sepenuhnya. Google menganggap ini bisa merusak Page Experience.

Sedangkan CLS adalah hasil akumulasi dari LS, artinya setiap elemen yang menimbulkan pergeseran tata letak yang terjadi dihitung secara akumulatif dan direpresentasikan sebagai angka total keseluruhan. Google menilai pergeseran tata letak yang baik dibawah angka 0.1

Hal yang Bisa Meningkatkan Pergeseran Tata Letak (Layout Shift)

• Gambar tanpa dimensi
• Iklan, sematan, dan iframe tanpa dimensi
• Konten yang diinjeksi secara dinamis
• Font Web menyebabkan FOIT / FOUT
• Tindakan menunggu respons jaringan sebelum memperbarui DOM

Solusi Memperbaiki CLS

Bila hasil pengujian Pagespeed Insight menampilkan nilai CLS diatas 0.1 maka kamu perlu menganalisis di bagian mana saja terjadinya pergeseran tata letak tadi. Pengujian sederhana bisa dilakukan melalui fitur inspect element lalu pilih tab performance, kemudian pilih start profiling.

Nantinya akan terdeteksi dimana posisi pergeseran tata letak (Layout Shift) tadi. Jika sudah menemukannya, segera lakukan improvisasi di bagian yang bermasalah tersebut.

contoh Layout Shift yang terjadi pada beberapa font di website ini

Pada umumnya Layout Shift terjadi akibat pergeseran tata letak disebabkan gambar yang tidak dideklarasikan tinggi dan lebarnya. Saat perenderan halaman, browser akan menunggu sampai gambar termuat sepenuhnya barulah browser mengetahui dimensi gambar tersebut.

Solusinya dengan menerapkan tinggi dan lebar gambar sedari awal pemuatan halaman, ini akan mengeliminasi pergeseran tata letak konten dibawahnya.

Contoh mendeklarasikan tinggi dan lebar gambar seandainya gambar pada halaman berukuran 1200 pixel x 600 pixel:

Selalu sertakan atribut ukuran pada gambar dan elemen video, atau sediakan ruang yang diperlukan dengan kotak rasio aspek CSS. Ini bertujuan untuk memastikan bahwa browser dapat mengalokasikan jumlah ruang yang benar dalam halaman saat gambar sedang dimuat.

Hindari memasukkan elemen yang lebih lambat di atas konten yang sudah termuat sebelumnya, jika memang harus menampilkannya, usahakan dimuat atas interaksi pengguna, misalnya menekan tombol untuk menampilkan konten tersebut agar pergeseran tata letak tidak terjadi.

Sebagai contoh, kami telah menerapkan beberapa perbaikan pada website blog ini untuk mendapatkan Page Experience semaksimal mungkin dan hasilnya cukup memuaskan.

Beberapa artikel mendapat peringkat lebih baik dari sebelumnya, bahkan mendapatkan page one untuk beberapa kueri pencarian.

Sekali lagi, Page Experience merupakan metrics yang pengumpulan datanya didasarkan atas pengalaman pengguna.

Dengan adanya metode perangkingan baru ini mungkin akan berpengaruh terhadap rangking website yang sudah sebelumnya berada pada puncak singgasana page one google.

Google tidak menghilangkan metriks perangkingan dari backlink dan SEO lainnya, itu masih tetap ada, namun Google menambahkan algoritma baru dan tentunya sebagai webmaster atau blogger kita perlu memahami setiap perubahan yang dilakukan Google jika ingin terus berkompetisi di mesin pencari.

Semoga artikel ini membantu dan happy blogging! 😊