Dalam beberapa tahun terakhir, selalu ada pembicaraan tentang pentingnya kecepatan situs dan juga pengalaman pengguna. Sementara itu, ada ribuan materi di luar sana yang mencakup tentang bagaimana cara untuk mengoptimalkan situs yang anda miliki, tetapi hanya dengan materi tersebut nampaknya sangat sulit untuk di praktikkan.
Beberapa bulan kebelakang, Google sekali lagi mengutamakan kecepatan dengan pembaruan pengalaman halaman yang akan terjadi tahun depan. Untuk membantu Anda supaya lebih siap dalam hal ini, ada beberapa bahan serta materi yang akan di berikan kepada Anda untuk dibaca.
Dari banyaknya masalah, masukan yang datang justru tidak berpengaruh banyak. Semua itu bermuara untuk memberikan konten utama kepada pengguna Anda secepat mungkin. Lakukan pengujian untuk melihat bagaimana performa dari situs Anda, prioritaskan perbaikan dan mulailah!
5 Cara Meningkatkan Core Web Vital Website Anda
Di bawah ini Anda akan menemukan campuran cara lama dan baru untuk menigkatkan Core Web Vital website Anda.
OPTIMALKAN GAMBAR ATAU LOGO ANDA
Saya akan memulai dari daftar pertama ini dengan sesuatu yang sangat penting: pengoptimalan gambar atau logo.
Satu hal terpenting yang harus di lakukan untuk situs Anda adalah pengoptimalan gambar atau logo anda dengan benar.
Tentu, kami telah mengatakan hal itu untuk jutaan kali, tetapi kami akan mengatakannya lagi: lakukanlah.
Satu gambar atau logo besar yang tidak optimal dan berada pada beranda atau halaman arahan akan menyakiti anda.
Bagi beberapa situs, gambar atau logo besar sering kali menjadi konten utama dalam berinteraksi dengan pengguna. Pastikan anda memberikan sambutan yang layak dan proses yang cepat bagi pengunjung anda.
Kami memiliki sebuah artikel image SEO yang akan menjelaskan tentang apa yang dapat anda lakukan untuk memuat gambar itu dengan cepat.
Singkatnya, pastikan anda menyajikannya dalam ukuran yang dibutuhkan dan mengompressnya dengan baik.
Ada banyak alat yang dapat membantu anda dalam melakukannya.
Secara pribadi, saya sangat menyukai hasil yang saya dapatkan dari squoosh.app.
Jangan berpikir untuk mempertahankan resolusi yang besar untuk ketajaman gambar, tetapi lebih ke sesuatu yang memang sudah pas untuk di tampilkan.
Dan juga, anda dapat mencoba format modern seperti WebP.
Format tersebut dapat memberikan hasil gambar dengan resolusi tinggi dan ukuran yang cukup kecil.
WebP sangat mendukung untuk hal seperti ini, bahkan Apple telah ikut serta!
Dengan rilisnya safari 14 yang akan datang – baik MacOS maupun iOS- akan mendukung WebP. Tentu, browser Microsoft Edge yang baru yang di dukung oleh Chromium juga akan mendukung WebP.
CMS (sistem pengelolaan konten) anda juga merupakan alat yang akan membantu anda untuk meningkatkan pemuatan gambar.
Ada kabar gembira tentang versi terbaru dari WordPress yang mendukung pemuatan lambat gambar secara otomatis (dan iframes).
Ini berarti, hal itu hanya akan dapat memuat gambar-gambar yang muncul di layar dan membiarkan sisanya dimuat ketika pengguna berinteraksi pada layar tersebut.
Hal ini akan memberitahukan kepada browser bahwa gambar yang besar akan dimuat hanya saat dibutuhkan.
Bagian lain dari masukan untuk meningkatkan kecepatan situs adalah penggunaan dari CDN, tetapi tahukah anda bahwa CDN dapat digunakan secara khusus untuk gambar?
Sebuah gambar dari CDN akan memberikan anda control lebih tentang bagaimana anda ingin menyajikan ataupun menampilkannya.
Sebuah gambar yang di dorong oleh CDN mendapat serangkaian property di URL-nya untuk memberi tahu browser bagaimana tentang gambar itu sendiri.
STABILKAN PEMUATAN DENGAN MENENTUKAN RUANG UNTUK GAMBAR DAN SEJENISNYA
Salah satu metrik baru adalah pergeseran tata letak kumulatif atau yang biasa disingkat dengan CLS.
Salah satu contohnya adalah ketika halaman seluler terlihat siap dan anda hanya ingin menekan suatu tombol, konten nya bergeser dan kemudian muncul sebuah iklan dengan lambat di tempat tersebut.
Hal ini sering terjadi dan menjadi salah satu hal yang membuat pengguna merasa frustasi. Sekarang, dengan pengoptimalisasian CLS tidak akan membuat halaman terlihat lebih cepat tetapi akan terasa lebih cepat.
CLS ini dapat di sebabkan oleh gambar tanpa dimensi di CSS. Dan itu juga dapat disebabkan oleh iklan ataupun sematan tanpa dimensi, atau bahkan konten yang di suntikkan secara dinamis. Ketika tidak diberikan dimensi yang benar, maka elemen-elemen tersebut cenderung sedikit muncul dengan tiba-tiba selama proses pemuatan, sehingga membuat nya terlihat aneh dan tidak stabil.
Hal ini juga bisa di akibatkan oleh konten baru yang di sisipkan di atas konten yang ada. Jangan lakukan hal tersebut, kecuali hal itu mungkin karena interaksi yang di berikan oleh pengguna.
Salah satu cara untuk meningkatkan Core Web Vitals dan mencegah CLS adalah dengan menambah lebar dan tinggi pada gambar di CSS.
Dengan cara ini akan membuat browser memberikan ruang kepada gambar yang muncul lebih lambat daripada teks. Sekarang, keanehan akan hilang karena browser tahu bahwa sesuatu akan ditambahkan pada waktunya.
Anda juga dapat mempertimbangkan tentang penambahan semacam placehorder beresolusi rendah jika anda ingin suatu saat hal tersebut muncul dengan cepat.
Jadi, pastikan bahwa gambar anda mememiliki lebar dan tinggi yang tepat. Tentu saja, anda juga dapat melakukan ini dengan gambar responsif biasa. . pastikan anda menggunakan rasio aspek yang sama untuk semua ukuran.
Untuk mengatasi iklan yang muncul secara tiba-tiba atau konten yang disisipkan, harap sediakan ruang untuk ini juga.
Pada akhirnya, CLS Anda mungkin akan turun sedikit.
PERCEPAT SERVER ANDA UNTUK MENGURANGI WAKTU PEMUATAN
Semakin cepat server anda menanggapi permintaan, maka akan semakin baik. Membuat server dapat merespon lebih cepat secara langsung dapat meningkatkan metrik kecepatan situs.
Di situs yang kompleks, server akan tetap sibuk menangani permintaan dan menyajikan file dan skrip, jadi yang terbaik adalah mengoptimalkan proses tersebut.
Mengoptimalkan server anda terdiri dari beberapa bagian.
Pertama, tingkatkan paket hosting anda. Jangan berhemat pada hosting. Pilih salah satu hosting yang memiliki kinerja bagus dan penawaran yang wajar. Selanjutnya juga ada bisnis tentang bagaimana server disiapkan – gunakan php versi terbaru! – and perangkat keras apa yang anda pilih.
Lalu, anda juga dapat memperbarui perangkat keras apabila anda merasa kurang. Selain itu pula, anda perlu untuk mencari tau bagaimana database anda bekerja dan melihat apakah anda harus melakukan perbaikan.
Gunakan alat seperti plugin Query Monitor WordPress untuk terus menganalisis kueri di situs anda.
Anda juga dapat melihat bagaimana server anda memberikan files kepada client.
Ada beberapa cara untuk meningkatkan proses tersebut, seperti link rel=preload misalnya.
Ini adalah beberapa solusi yang lebih canggih yang memungkinkan anda untuk menyesuaikan bagaimana cara server anda merespons permintaan. Di sini, sekali lagi, CDN dapat melakukan keajaiban untuk meningkatkan Data Web Inti Anda.
MEMERIKSA CSS PENTING UNTUK MEMUAT KONTEN LEBIH CEPAT
Ketika browser sedang memuat halaman, browser harus mendapatkan HTML, kemudian merendernya, mendapatkan CSS, kemudian merendernya, mendapatkan JavaScript, lalu merendernya lagi, dan lain-lain.
Semakin banyak files yang perlu untuk di muat pada situs anda maka semakin besar pula mereka, dan akan membuat situs anda menjadi agak lambat. Biasanya ketika browser sedang sibuk melakukan banyak hal, browser tidak dapat memuat sesuatu di latar belakang. Ada beberapa elemen yang menghalangi nya untuk memproses sesuatu tersebut. Apa yang disebut JavaScript dan CSS lah yang dapat memblokir render dan hal itu dapat memengaruhi segalanya.
Karena CSS sudah terlambat dimuat, seringkali butuh beberapa saat agar sesuatu muncul di layar. Dengan mengambil bagian penting dari desain anda – bagian yang muncul pada konten anda – dari file CSS utama dan dapat dimasukkan ke dalam kode milik anda, anda juga bisa mendapatkan sesuatu di layar lebih cepat. Memastikan sekali lagi, bahwa hal ini tidak membuat situs anda lebih cepat, tetapi membuatnya tampak lebih cepat. Semua itu untuk pengguna yang sudah mahir.
Untuk mendapatkan satu set CSS penting, anda dapat memilih dari sejumlah alat atau anda juga dapat melakukannya dengan tangan. Selain itu, anda dapat menggunakan plugin caching WordPress seperti WP Rocket.
WP Rocket memiliki tombol sederhana yang disebut pengoptimalan pengiriman CSS. Mengaktifkan ini dapat membantu menghilangkan CSS yang memblokir render dan meningkatkan pemuatan situs anda. Tentu saja, WP Rocket juga melakukan hal-hal keren lainnya seperti mengecilkan CSS dan JavaScript dan juga dapat menunda pemuatan JavaScript.
MENINGKATKAN PEMUATAN DATA SKRIP PADA PIHAK KETIGA
Untuk beberapa situs, kelambatan juga datang dari luar. Apabila situs anda bergantung pada skrip iklan, semisal, Anda pada dasarnya berada di tangan penyedia iklan. anda hanya dapat berharap bahwa iklan yang mereka kerjakan berjalan dengan baik. Apabila iklan mereka dimuat sangat lambat, mungkin sudah waktunya untuk mencari penyedia iklan yang lain.
Apabila anda menemukan bahwa skrip pihak ketiga memperlambat situs anda, anda harus segera memeriksanya. Kemudian tanyakan pada diri anda, apakah saya benar-benar membutuhkan iklan tersebut? Apa nilai dari skrip ini sebenarnya? Mungkin saja ada opsi berbeda di luar sana yang sedikit lebih optimal dan tidak terlalu membebani server anda. Mungkin saja kan? Kenapa tidak di coba?
Apabila memungkinkan, anda juga dapat mencoba untuk membuat skrip anda sendiri dengan hosting. Dengan cara ini, mungkin akan sedikit mengontrol proses pemuatan data. Dan apabila anda tidak dapat melakukannya, anda dapat melihat apakah di muat ulang dapat membuatnya lebih cepat.
Setidaknya, pastikan untuk memuat skrip yang tidak sinkron atau tunda hingga saat terakhir.
Dengan cara ini, mungkin browser dapat membuat halaman terlebih dahulu sebelum mendapat ataupun menjalankan skrip eksternal.
Gunakan sesuatu yang tidak sinkron jika skrip yang anda muat penting, seperti skrip analitik. Atau anda dapat menggunakan penangguhan untuk sumber daya yang kurang penting. Ada banyak cara untuk pengoptimalan skrip pihak ketiga.
MENINGKATKAN CORE WEB VITAL: SEMUA PENINGKATAN KECIL DAPAT DIPERHITUNGKAN
Dengan pembaruan halaman yang akan dilakukan pada Mei 2021 mendatang, Google sekali lagi mengutamakan kecepatan dengan pembaruan pengalaman halaman.
Kami selalu melihat SEO secara holistik – ada banyak bagian yang berpindah dan anda harus mengerjakan semuanya untuk membangun situs terbaik di luar sana.
Meskipun tips yang disebutkan di atas dapat membantu Anda meningkatkan skor Core Web Vitals, anda benar-benar harus melakukan ini untuk menawarkan pengalaman yang lebih baik kepada pengunjung anda.
Mengawali karir sebagai Content Writer dan saat ini dipercaya sebagai SEO Specialist merangkap SEO Content Editor di KIRIM.EMAIL.
Selain SEO Saya juga punya keahlian di bidang lain seperti bisnis & manajemen, email marketing, pembuatan website dan landing page hingga copywriting.
Untuk berkomunikasi dengan Saya silakan kirimkan email ke sholeh@krm.email.
