Data Web Inti 101 & Panduan Pengembangan

Apa yang Terjadi & Berubah?

Pada Mei 2021, Google memulai peluncuran pembaruan algoritme inti yang menambahkan faktor tambahan ke dalam sinyal untuk peringkat halaman, karena terkait dengan kecepatan halaman dan pengalaman pengguna. Peluncuran pembaruan inti diperpanjang hingga Juni 2021 juga menjadikan ini salah satu perubahan inti terbesar dalam sejarah. Core Web Vitals akan bergabung dengan sinyal peringkat lama seperti situs aman HTTPS, ramah seluler, dan interstisial non-intrusif sebagai sinyal penelusuran dalam faktor peringkat pengalaman halaman secara keseluruhan.

Tiga komponen Data Web Inti mencakup hal berikut:

• Largest Contentful Paint (LCP) : mengukur kecepatan pemuatan yang dirasakan dan menandai titik waktu pemuatan halaman saat konten utama halaman kemungkinan telah dimuat. Untuk memberikan pengalaman pengguna yang baik, situs harus berusaha agar LCP muncul dalam 2,5 detik pertama sejak halaman mulai dimuat.
• Penundaan Input Pertama (FID) : mengukur daya tanggap dan mengukur pengalaman yang dirasakan pengguna saat pertama kali mencoba berinteraksi dengan halaman. Untuk memberikan pengalaman pengguna yang baik, situs harus berusaha untuk memiliki FID kurang dari 100 milidetik .
• Pergeseran Tata Letak Kumulatif (CLS) : mengukur stabilitas visual dan menghitung jumlah pergeseran tata letak yang tidak terduga dari konten halaman yang terlihat. Untuk memberikan pengalaman pengguna yang baik, situs harus berusaha untuk memiliki skor CLS kurang dari 0,1 .

Pernyataan rilis resmi Google tentang pembaruan algoritme ini: https://developers.google.com/search/blog/2020/11/timing-for-page-experience

Selain itu, Google merilis lebih banyak informasi tentang perubahan CLS karena mereka terus memantau performa selama peluncuran. Akibatnya, banyak situs menerima skor yang lebih menguntungkan karena perubahan terbaru dan menghindari banyak pekerjaan pengembang untuk menyesuaikan tata letak situs mereka. Seperti biasa, perubahan ini dapat berubah, jadi sebaiknya pantau CWV sebagai bagian dari daftar periksa mingguan atau bulanan.

Apa yang Kami Ketahui Tentang Pembaruan Peringkat?

Seperti kebanyakan pembaruan algoritme Google, ada banyak hal yang tidak diketahui dalam hal pengaruhnya terhadap lanskap pencarian saat ini. Kami tahu ini akan menjadi faktor dalam peringkat halaman. Namun, kami tidak tahu berapa persentase faktor atau seberapa besar dampaknya dalam algoritme. Faktor lain yang tidak diketahui adalah jika pesaing langsung beradaptasi atau mengambil tindakan dalam memperbarui situs mereka untuk mengikuti faktor baru. Berdasarkan perilaku pesaing, hal ini pada gilirannya dapat berdampak positif atau negatif pada peringkat situs Anda, dibandingkan dengan pembanding tersebut. Yang kami tahu adalah, Google akan terus memprioritaskan konten peringkat yang dianggapnya berharga atau relevan bagi pengguna daripada situs web yang lebih cepat dengan konten yang lemah.

Faktanya, karena Google menawarkan lebih banyak informasi tentang pembaruan, mereka memastikan bahwa konten yang relevan tetap menjadi salah satu elemen terpenting dalam peringkat pencarian.

“Sistem kami akan terus memprioritaskan halaman dengan informasi terbaik secara keseluruhan, meskipun beberapa aspek pengalaman halaman di bawah standar. Pengalaman halaman yang baik tidak mengesampingkan konten yang bagus dan relevan.”

Bagaimana Mempersiapkan Pembaruan Peringkat Pengalaman Halaman Google?

Karena faktor yang tidak diketahui terkait dengan pembaruan ini dan jendela pemberitahuan 6 bulan Google, perubahan tersebut tampaknya menandakan bahwa ini akan menjadi faktor peringkat. Oleh karena itu, sangat disarankan agar tim SEO dan pengembangan meninjau kinerja Core Web Vitals situs Anda saat ini dan mengambil tindakan cepat dalam meninjau dan memperbarui masalah yang terkait dengan pembaruan sinyal peringkat. Memastikan Anda bersikap proaktif daripada reaktif itu penting, karena setiap penurunan peringkat membutuhkan waktu cukup lama untuk pulih. Kita semua tahu bahwa SEO adalah permainan yang panjang!

Bagaimana Mengidentifikasi Masalah Situs, Langkah Selanjutnya Berdasarkan Masalah & Tips Tambahan?

Data Web Inti diuraikan di akun Google Search Console situs Anda di bagian “Penyempurnaan”. Selain itu, ada tampilan menyeluruh dalam bagian "Ikhtisar" akun, yang akan terlihat serupa dengan contoh di bawah (Beberapa variasi kemungkinan akan terjadi karena akun Anda bergantung pada potensi masalah yang spesifik pada situs Anda). Ada juga bagian yang diuraikan untuk Desktop dan Seluler. Dalam contoh ini, kami melihat masalah terkait Seluler.

Karena semua situs diindeks dengan mengutamakan seluler mulai September 2020 , sebaiknya waktu pengembangan dihabiskan untuk masalah Seluler terlebih dahulu. Dengan demikian, jika situs Anda responsif, kemungkinan besar pembaruan yang Anda lakukan di Seluler, juga akan berdampak positif pada Desktop. Selain itu, bergantung pada ukuran situs, mungkin ada sejumlah masalah yang “buruk” dan “perlu perbaikan”. Kami sangat menyarankan untuk berfokus pada URL yang "buruk", karena item "perlu peningkatan" mungkin tidak sebanding dengan usaha vs. dampak, atau aturan 80/20, yang akan kita bahas nanti!

Saat meninjau URL yang diuraikan di Google Search Console yang menunjukkan kinerja yang kurang optimal, penting untuk diingat apa yang diungkapkan John Mueller dari Google tentang bagaimana Google dalam beberapa kasus dapat menghitung skor data vital web inti sebagai rata-rata dari beberapa halaman:

Ini pertanyaannya:

“Saat ini menjadi sinyal peringkat… apakah ini akan menjadi level halaman atau level domain?”

Muller menjawab:

“…Apa yang terjadi dengan data lapangan adalah kami tidak memiliki poin data untuk setiap halaman.

Jadi kami, untuk sebagian besar, kami perlu memiliki semacam pengelompokan halaman individual.

Dan tergantung dari jumlah data yang kita miliki, itu bisa berupa pengelompokan dari keseluruhan website (jenis domain).

… Saya pikir dalam Laporan Pengalaman Pengguna Chrome mereka menggunakan asal yang akan menjadi subdomain dan protokol di sana.

Jadi itu akan menjadi jenis pengelompokan yang menyeluruh.

Dan jika kami memiliki lebih banyak data untuk masing-masing bagian situs web, kami akan mencoba menggunakannya.

Dan saya yakin itu adalah sesuatu yang juga Anda lihat di konsol pencarian tempat kami akan menampilkan seperti satu URL dan berkata… ada begitu banyak halaman lain yang terkait dengan itu. Dan itu semacam pengelompokan yang akan kami gunakan di sana.”

Anda mungkin bertanya pada diri sendiri, mengapa kami membahas ini di awal percakapan seputar Data Web Inti? Mueller menjelaskan bahwa laporan Google Search Console yang menguraikan masalah URL mencoba mengkategorikan dan melaporkan halaman dengan masalah yang sama ke dalam pengelompokan. Sayangnya, dalam praktiknya, pengelompokan URL ini kurang bermanfaat untuk beberapa situs web dari pengalaman kami.

Kadang-kadang, kami akan meninjau URL yang diindikasikan memiliki kinerja "buruk" dalam laporan Google Search Console, hanya untuk menemukan bahwa halaman yang sama tampaknya memiliki tagihan kesehatan yang bersih saat diuji dengan Lighthouse dan Page Speed ​​Insights.

Singkatnya, saat meninjau masalah URL yang diuraikan dalam laporan Google Search Console, kami menyarankan untuk “mengambilnya dengan hati-hati”. Dugaan terbaik kami adalah bahwa Google bermaksud untuk memberi peringkat skor "web vitals" untuk halaman berdasarkan riwayat 28 hari dari data penjelajahan dunia nyata yang sebenarnya ("data lapangan" dalam bahasa Google). Namun, data dunia nyata tersebut kemungkinan akan dikumpulkan dari seluruh domain (atau "asal" dalam bahasa Google) jika halaman tersebut tidak banyak diperdagangkan. Meskipun Search Console akan berguna dalam mengidentifikasi fakta bahwa web vitals Anda memerlukan TLC, jangan mengandalkannya untuk audit Anda. Selain itu, berhati-hatilah dalam meninjau data lab (hasil individual dari halaman yang diuji secara waktu nyata) dibandingkan dengan data lapangan (yang bisa untuk beberapa halaman dan selalu melalui jendela lihat balik 28 hari) saat melakukan dan mengaudit atau memvalidasi perbaikan.

Setelah Anda mengetahui bahwa Anda memiliki masalah, jika Anda tidak dapat menentukan halaman sumber, mulailah dengan halaman contoh pengujian lab untuk setiap template inti Anda. Misalnya, halaman beranda, halaman produk, halaman kategori, artikel blog, dll. Seringkali, masalah struktural dapat ditemukan di setiap contoh jenis halaman tertentu dan diperbaiki sekali oleh pengembang web melalui pembaruan ke template yang mendasarinya kode. Jika ini tidak berhasil, pertimbangkan analisis serupa dari subkumpulan laman individual yang dimulai dengan laman yang paling banyak dikunjungi. Alat yang menurut kami berguna dalam proses ini adalah mengaudit Data Web Inti melalui Screaming Frog .

Panduan Peningkatan Pergeseran Tata Letak Kumulatif (CLS).

Pergeseran Tata Letak Kumulatif (CLS) mengukur jumlah total dari semua skor pergeseran tata letak individu untuk setiap pergeseran tata letak tak terduga yang terjadi selama seluruh umur halaman. Pergeseran tata letak terjadi setiap kali elemen yang terlihat mengubah posisinya dari satu bingkai yang dirender ke bingkai berikutnya.

Google merekomendasikan panduan berikut tentang cara meningkatkan CLS untuk sebagian besar situs web dengan tetap berpegang pada beberapa prinsip panduan:

• Selalu sertakan atribut ukuran pada gambar dan elemen video Anda atau sisakan ruang yang diperlukan dengan sesuatu seperti kotak rasio aspek CSS . Pendekatan ini memastikan bahwa browser dapat mengalokasikan jumlah ruang yang benar dalam dokumen saat gambar sedang dimuat. Perhatikan bahwa Anda juga dapat menggunakan kebijakan fitur unsized-media untuk memaksa perilaku ini di browser yang mendukung kebijakan fitur.
• Jangan pernah menyisipkan konten di atas konten yang sudah ada, kecuali sebagai respons terhadap interaksi pengguna. Ini memastikan setiap perubahan tata letak yang terjadi diharapkan.
• Lebih suka mengubah animasi daripada animasi properti yang memicu perubahan tata letak. Menganimasikan transisi dengan cara yang menyediakan konteks dan kontinuitas dari status ke status.

Google merekomendasikan untuk menggunakan tindakan berikut untuk menganalisis, menguji, dan menerapkan pembaruan di seluruh situs:

• Setelah Anda mengidentifikasi halaman yang perlu diperbaiki (diuraikan di atas), gunakan PageSpeed ​​Insights untuk mendiagnosis masalah lab dan lapangan di halaman.
• Siap mengoptimalkan situs Anda secara lokal di lab? Gunakan Lighthouse dan Chrome DevTools untuk mengukur Core Web Vitals dan dapatkan panduan yang dapat ditindaklanjuti tentang apa yang harus diperbaiki. Ekstensi Chrome Web Vitals dapat memberi Anda tampilan metrik secara real-time di desktop.
• Mencari bimbingan? web.dev/measure dapat mengukur halaman Anda dan menampilkan serangkaian panduan dan codelab yang diprioritaskan untuk pengoptimalan, menggunakan data PSI.
• Terakhir, gunakan Lighthouse CI pada pull request untuk memastikan tidak ada regresi di Core Web Vitals sebelum Anda menerapkan perubahan pada produksi.

Untuk penjelasan mendalam tentang cara meningkatkan CLS, lihat Optimalkan CLS .

Pedoman Peningkatan Contentful Paint (LCP) Terbesar

Metrik Largest Contentful Paint (LCP) melaporkan waktu render dari blok teks atau gambar terbesar yang terlihat dalam viewport.

Seperti yang saat ini ditentukan dalam Largest Contentful Paint API , jenis elemen yang dipertimbangkan untuk Largest Contentful Paint adalah:

• <img> elemen
• elemen <image> di dalam elemen <svg>
• elemen <video> (gambar poster digunakan)
• Elemen dengan gambar latar dimuat melalui fungsi url() (berlawanan dengan CSS gradient )
• Elemen tingkat blok yang berisi simpul teks atau turunan elemen teks tingkat sebaris lainnya

Google merekomendasikan panduan berikut tentang cara meningkatkan LCP, yang terutama dipengaruhi oleh empat faktor:

• Waktu respons server lambat
• JavaScript dan CSS yang memblokir render
• Waktu pemuatan sumber daya
• Render sisi klien

Untuk pemahaman mendalam tentang cara meningkatkan LCP, lihat Optimalkan LCP . Untuk panduan tambahan tentang teknik performa individu yang juga dapat meningkatkan LCP, lihat:

• Terapkan pemuatan instan dengan pola PRPL
• Mengoptimalkan Jalur Rendering Kritis
• Optimalkan CSS Anda
• Optimalkan Gambar Anda
• Optimalkan Font web

Optimalkan JavaScript Anda (untuk situs yang dirender klien)

Temuan Vital Inti Pengembangan Web Hingga Saat Ini

Tim pengembangan kami telah melihat bahwa sebagian besar pembaruan peringkat Core Web Vitals akan memerlukan pengujian ekstensif di sisi pengembangan untuk memastikan pembaruan yang dibuat memenuhi standar yang ditetapkan oleh Google.

Dalam banyak kasus untuk situs yang lebih kecil, banyak dari item ini berada di luar kendali pengembang web. Misalnya, kecepatan server sebagian besar dikendalikan oleh penyedia hosting, dan untuk hosting bersama (seperti WP Engine atau Shopify), pengembang tidak akan memiliki kendali. Demikian pula, tema situs out-of-the-box sering memiliki Javascript dan CSS pemblokiran render "dipanggang". Dalam kasus ini, mungkin tidak praktis untuk mengatasi banyak masalah yang dilaporkan. Untuk alasan ini, analisis kritis diperlukan untuk menentukan persimpangan (1) masalah mana yang paling berdampak dan (2) masalah mana yang disebabkan oleh kode yang dapat dan harus diubah oleh tim pengembangan.

Setelah memulai proses peninjauan masalah Data Web Inti di beberapa klien kami, kami mendapati bahwa sebagian besar alat terkait yang disediakan oleh Google masih belum sempurna, sejauh alat tersebut dapat mengidentifikasi masalah (seperti pergeseran pemuatan konten), tetapi tidak selalu membantu dalam menentukan penyebab spesifik. Meskipun kami berharap ini akan matang dalam iterasi yang akan datang dari alat ini (khususnya, di Chrome Dev Tools), kami menemukan bahwa proses diagnostik alternatif mungkin diperlukan untuk mengidentifikasi masalah tertentu.

Kami juga menemukan bahwa upaya untuk meningkatkan metrik ini serupa dengan peningkatan kinerja kecepatan halaman secara keseluruhan. Dalam setiap kasus, kami menyarankan untuk tidak mengejar "skor sempurna". Sebaliknya, aturan 80/20 berlaku. Jika Anda mengatasi buah yang menggantung rendah, Anda mungkin akan melihat peningkatan yang signifikan dalam metrik Anda. Setelah itu, perbaikan menjadi lebih memakan waktu, lebih mahal, dan kurang berdampak.

Panduan dasar seperti saran Google untuk menyertakan markup atau CSS yang mempertahankan ruang pada semua elemen gambar, video, dan penampung umumnya merupakan saran bagus yang mudah diterapkan. Masalah lain lebih sulit untuk dilacak, dan kecuali jika memiliki dampak yang berlebihan pada metrik Anda (seperti yang dilaporkan oleh beberapa alat yang disarankan), mungkin lebih baik mengesampingkan masalah tersebut.

Arsitektur situs juga akan memainkan peran penting dalam relatif mudahnya item-item ini dapat ditangani. Platform situs populer seperti Shopify dan WordPress, bersama dengan pembuat halaman grafis seperti WP Bakery dan Shogun, menangani sebagian dari proses pembuatan HTML “di belakang layar”. Masalah yang dikaburkan oleh komponen pembuat halaman (mis., pemuatan lambat gambar tertentu) mungkin tidak dapat segera diatasi tanpa perubahan mendasar pada situs atau dukungan platform, tema, atau vendor plugin/aplikasi.

Konsep di atas meluas ke pihak ketiga yang menggunakan javascript untuk memuat widget dengan malas ke halaman Anda (misalnya, formulir pendaftaran tersemat dari platform email seperti Klaviyo). Dalam beberapa kasus, menempatkan elemen penampung dengan ukuran yang tepat dan eksplisit di sekitar kode embed komponen yang menyinggung adalah solusi yang bisa diterapkan. Dalam kasus lain, vendor itu sendiri mungkin perlu melakukan perubahan.

Sebaiknya mulai setiap proses perbaikan dengan masalah berdampak yang dapat diatasi dengan perubahan pada templat situs inti yang mudah diakses (mis., halaman produk, halaman koleksi produk, dll.). Ini sering kali memungkinkan satu perubahan kode untuk meningkatkan hasil di puluhan atau ratusan halaman situs. Selanjutnya, alamat beranda, karena ini hampir selalu menjadi laman yang paling banyak dikunjungi di situs. Terakhir, prioritaskan halaman individu lain yang memerlukan perbaikan berdasarkan tingkat keparahan masalah dan visibilitas halaman.

Seperti halnya dengan peningkatan kecepatan halaman, mengelola Data Web Inti adalah penting, tetapi itu hanya satu variabel di antara banyak variabel dalam algoritme peringkat Google, dan SEO juga harus diseimbangkan dengan situs lain dan prioritas bisnis yang bersaing untuk mendapatkan waktu dan anggaran.