Tidak diragukan lagi, WordPress adalah CMS yang paling mudah untuk digunakan. Di sisi lain, ada beberapa error WordPress yang sering terjadi. Hal ini kadang membuat pengguna panik karena tak tahu pasti bagaimana cara mengatasinya.
Jangan khawatir, error yang sering terjadi pada WordPress ini umumnya banyak dialami pengguna WordPress lain karena hal tertentu. Yang paling sering biasanya adalah miskonfigurasi atau ada kesalahan dalam konfigurasi.
Galat Error pada WordPress dan Cara Memperbaikinya
Di artikel kali ini, Panda akan secara lengkap mengulas apa saja error yang sering terjadi pada situs WordPress dan bagaimana cara cepat untuk mengatasinya. Jika ada tutorial error WordPress yang belum tersedia di artikel ini, silahkan tinggalkan komentar agar kami bisa menambahkan segera ya.
Error 500 (Internal Server Error)
Error yang terjadi pada WordPress dengan angka 500-599 biasanya terjadi karena kendala di sisi server. Pemicunya biasanya karena server tidak bisa memproses permintaan dari browser karena beberapa hal.
1. 500 Internal Server Error
500 Internal Server Error biasanya terjadi karena masalah pada file di website. Entah itu karena file PHP, .htaccess, file permission, atau file lainnya. Warning yang sering muncul dari error ini antara lain :
Error 502 Bad Gateway terjadi karena proxy menerima respon yang tidak valid dari server. Jadi saat user sedang browser dan mengunjungi sebuah website, browser akan mengirimkan request kepada web server hosting, memproses, dan mengirimkan kembali kepada user. Jika proses ini gagal, muncul lah peringatan error 502 Bad Gateway. Ada beberapa cara yang bisa dilakukan untuk mengatasi Error 502 Bad Gateway. Mulai dari menghapus cache browser, mengatasi problem DNS, masalah pada plugin dan tema, atau pengecekan error log di wp-config. Untuk lebih jelasnya, Panda telah mengulasnya juga di artikel Cara Mudah dan Cepat Mengatasi Error 502 Bad Gateway.
3. 503 Service Unavailable
503 Service Unavailable menandakan bahwa server tidak bisa diakses karena suatu hal. Ini bisa terjadi karena sedang terjadi pemeliharaan rutin, trafik yang terlalu tinggi, atau masalah lain yang lebih serius.
Error 503 juga bisa muncul saat web server tidak mendapatkan respon dari skrip PHP. Web server tidak bisa terhubung dengan skrip PHP bisa dipicu dari penggunaan sumber daya yang terlalu tinggi.
Penggunaan ini mungkin saja berkaitan dengan plugin yang tidak sesuai, tema yang cukup berat, atau terdapat masalah dalam kode/ script.
Jika masalah HTTP Error 503 atau 503 Service Unavailable terjadi karena masalah sumber daya yang terlalu tinggi, atau adanya serangan DDoS, masalah ini bisa hilang dengan sendirinya saat penggunaan kembali melandai.
Namun jika terjadi kesalahan karena komponen lain, maka membutuhkan penanganan dari pemilik website. Hal yang bisa dilakukan untuk memperbaiki 503 Service Unavailable, antara lain :
Menonaktifkan semua plugin WordPress untuk mengidentifikasi apakah problem berasal dari plugin. Jika benar, cari plugin yang bermasalah dengan mengaktifkan satu per satu dan refresh setiap kali aktivasi plugin.
Kembali ke pengaturan tema default WordPress.
4. 504 Gateway Timeout
504 Gateway Timeout atau Error 504 terjadi saat server proxy mengalami time out karena terlalu lama menunggu jawaban dari server asal.
Problemnya bisa berasal dari gangguan koneksi internet, dan kesalahan jaringan. Atau bisa juga pembagian serta penggunaan data akses yang tidak seimbang, atau masalah serius lainnya pada website.
Untuk mengatasi error 504 Gateway Timeout ada beberapa cara yang bisa kita lakukan. Mulai dari membersihkan cache, menonaktifkan VPN, menonaktifkan default, dan solusi lainnya. Panduan lengkap mengatasi masalah ini bisa Anda baca di artikel Panda : Cara Cepat Mengatasi 504 Gateway Time-out di WordPress.
Error 400
Error di WordPress dengang angka peringatan 400an adalah error HTTP client. Artinya, error ini bisa muncul karena ada yang tidak beres saat terjadi pertukaran data antara browser pengunjung dengan server website.
Error WordPress di angka 400 sampai 499 adalah error HTTP client. Dengan kata lain, error ini muncul karena ada yang tidak beres saat pertukaran data antara browser pengunjung dengan server website Anda.
5. 400 Bad Request
Error 400 Bad Request bisa terjadi saat server tidak dengan jelas memahami permintaan dari pengunjung website. Penyebabnya antara lain karena URL yang tidak tepat, cache dan cookies yang rusak, hingga file terlalu besar.
Karena penyebabnya cukup beragam, maka cara mengatasi Error 400 Bad Request bisa dilakukan dengan beberapa cara berbeda, sesuai penyebabnya. Untuk solusi lengkap cara mengatasi error ini, Anda bisa membacanya di artikel Cara Tercepat Mengatasi Error 400 Bad Request di Website.
6. 401 Unauthorized
Jika Anda menemukan error 401, ini artinya Anda tidak mempunyai kewenangan yang sah dalam mengakses sebuah website. Misalnya saja karena salah memasukkan username dan password atau karena akses untuk website tersebut dibatasi. Tentu saja akan menyebalkan jika Anda merasa mempunyai akses dan memasukkan informasi yang benar, namun error terus terjadi. Nah, trik untuk mengatasi masalah error 401 ini sendiri terdiri dari dua, yaitu solusi untuk pengunjung dan solusi untuk pemilik website. Anda dapat membaca triknya di artikel : Tutorial Lengkap Mengatasi Error 401 Unauthorized di Website.
7. 403 Forbidden
Sesuai dengan namanya, error 403 Forbidden ini berkaitan dengan keterbatasan akses. Ini biasa terjadi karena kebijakan privasi (permission/ izin), atau hal teknis yang berkaitan dengan kesalahan setting permission.
Error ini termasuk yang cukup populer dan sering terjadi di browser. Error ini menandakan bahwa halaman tidak ditemukan atau ada file yang gagal diakses. Ini bisa terjadi karena file menghilang, ada perubahan URL, atau mengalami kerusakan. Error ini sebenarnya tidak berbahaya. Namun dari sisi pengunjung, ini sangat mengganggu dan membuat frustasi. Dan memperbaikinya, simak tutorial Panda : Cara Mudah Mengatasi Error 404 Not Found di Website WordPress.
9. 405 Not Allowed
Peringatan error 405 muncul saat browser akan mengirimkan request/ permintaan HTTP ke web server, dan server sudah menerimanya, namun menolak permintaan tersebut. Error ini sebagian besar dipicu karena masalah dari sisi klien. Misalnya saja browser, sistem operasi atau perangkat yang sudah tidak compatible. Namun, error ini juga bisa disebabkan kesalahan konfigurasi dari sisi server. Sehingga untuk mengatasinya, kita juga perlu mengidentifikasi masalah yang ada di server. Dibandingkan dengan Error 404, error 405 ini bisa lebih rumit penanganannya. Untuk memperbaiki error ini, simak tutorial Panda : 6 Cara Mengatasi Error 405 Method Not Allowed di WordPress.
10. 413 Request Entity Too Large
Error 413 request entity too large terjadi saat web server tidak bisa memproses permintaan dari browser client karena ukurannya yang terlalu besar. Secara ringkas, pemicunya adalah unggahan file yang melebihi batas yang sudah ditentukan. Untuk memperbaiki masalah ini, client perlu mengecek konfigurasi server dan melihat pengaturan batasan upload di server masing- masing. Untuk memperbaikinya, Panda mengulas tuntas solusi memperbaiki error 413 di WordPress dan VPS di artikel berikut : Cara Cepat Mengatasi Error 413 Request Entity Too Large di Website.
11. 429 Too Many Request
Too many request artinya terlalu banyak permintaan. Galat error WordPress yang satu ini mengindikasikan adanya masalah pada server yang mendapatkan terlalu banyak permintaan.
Pemicu utama 429 too many request ini biasanya adalah masalah keamanan. Namun, bisa juga karena tema dan plugin yang bermasalah, serta masalah pada SSL.
Untuk memperbaikinya, pengguna bisa mengubah URL login, memperbaiki masalah pada SSL, serta mengecek masalah kompatibilitas pada tema dan plugin. Jika ini adalah masalah yang terjadi pada situs web Anda, cobalah mengatasinya dengan artikel ulasan Panda : 5 Cara Mudah Mengatasi Error 429 Too Many Request.
Kesimpulan
Ada banyak error WordPress dan potensi gangguan teknis yang kerap terjadi di WordPress karena faktor tertentu. Meskipun kepanikan adalah hal yang sulit untukkita hindari, cobalah untuk fokus mencari solusi agar permasalahan bisa segera terselesaikan.
Dengan deretan tips yang dikupas Panda di artikel ini, mudah- mudah semua jenis error yang Anda hadapi di WordPress, mulai dari internal server error, error 404, dan berbagai error lainnya dapat Anda atasi sampai tuntas.
Website yang lambat atau lemot sudah pasti akan mengganggu kinerja bisnis kita. Tapi mungkin bagian paling menyebalkannya, kita tidak tahu betul faktor apa yang menyebabkan website berjalan lambat ini.
Jika tidak mengetahui penyebabnya, tentu akan terasa sulit mengatasinya. Padahal, kecepatan adalah hal yang signifikan bagi banyak orang. Semakin cepat loading website, pengalaman pengguna akan semakin baik.
Sebaliknya, website yang lambat akan membuat pengguna meninggalkan laman situs, bahkan sebelum situs Anda benar- benar utuh terbuka. Akibatnya, usaha Anda untuk mendatangkan orang- orang ke website Anda menjadi sia- sia.
Apa itu Kecepatan Website?
Kecepatan website adalah rentang waktu yang dibutuhkan sebuah halaman website agar untuk selesai dimuat di web browser. Kecepatan ini akan berpengaruh pada impresi pertama pengunjung saat masuk ke sebuah website.
Dalam proses loading website, setidaknya ada tiga proses yang terjadi, yaitu :
Proses mengirimkan file- file halaman website yang diakses dari server ke web browser.
Proses web browser merespon pengiriman file.
Terakhir, proses mengolah dan memuat laman website di web browser.
Dari ketiga proses ini, yang menjadi acuan kecepatan website adalah saat laman situs dimuat di browser. Nah, ini lah yang penting untuk kita perhatikan.
Lantas, seberapa cepatkah website seharusnya? Seorang ahli SEO, Geoff Kenyon, mengungkap :
Waktu muat dalam 5 detik, artinya website Anda lebih cepat daripada 25 persen website lainnya.
Waktu muat dalam 2.9 detik, artinya website Anda lebih cepat dari 50 persen website lainnya.
Jika berhasil dimuat dalam 1.7 detik, artinya website Anda lebih cepat dari 75 persen website lainnya.
Jika berhasil dimuat dalam 0.8 detik, artinya website Anda lebih cepat dari 94 persen website lainnya.
Secara umum, 5 detik sudah menandakan kalau website Anda termasuk cepat. Namun, jika ada hal lain yang bisa Anda optimalkan untuk menambah kecepatan website, tentu saja itu akan membuat website Anda semakin unggul.
Mengapa Website yang Cepat Penting untuk Bisnis?
Kecepatan website mempunyai pengaruh yang penting dalam bisnis. Menurut studi Google, 53 persen pengunjung akan meninggalkan laman web Anda jika waktu loadingnya lebih dari tiga detik.
Bukan itu saja, studi lainnya menyebut bahwa setiap keterlambatan satu detik pada loading website akan membuat Anda kehilangan tujuh persen konversi.
Sebagai contoh, saat website Anda menghasilkan omset senilai Rp 500.000.000 per hari. Dengan keterlambatan satu detik saja pada loading website, Anda berpotensi kehilangan Rp 35.000.000 per hari.
Bukan hanya di hitungan kasar penghasilan saja, tapi ada kerugian lain yang bisa terjadi. Kerugian tersebut antara lain :
79 persen konsumen tidak puas dengan pengalaman mereka saat mengakses website. Mereka tidak ingin kembali ke website lagi.
49 persen konsumen akan kehilangan kepercayaan pada bisnis Anda. Akibatnya, tingkat retensi akan rendah.
44 persen konsumen akan memberitahukan kekecewaan mereka ke orang lain dan menciptakan word of mouth yang buruk untuk bisnis Anda.
Artinya, akan ada rentetan kerugian lain yang tak terlihat jelas, namun berimbas pada kualitas bisnis jangka panjang.
Imbas dari kecepatan website ini sudah dibuktikan oleh beberapa website besar. Saat berhasil mempercepat loading website nya dari tujuh ke dua detik, Shopzilla berhasil memperoleh pageview 25 persen lebih banyak.
Mozilla juga mempunyai pengalaman yang sama. Setelah mempercepat loading websitenya hingga 2.2 detik, browser ini diunduh 60 juta kali lebih banyak setiap tahunnya.
Dari sini terlihat dengan jelas bagaimana kecepatan sebuah website berdampak pada peningkatan jumlah kunjungan, unduhan, dan juga penjualan, bukan?
10+ Penyebab Website Lambat/ Lemot
Jadi, apa saja sih yang menyebabkan website menjadi lambat alias lemot? Yuk sama- sama kita simak ulasan Panda kali ini :
1. Performa Server yang Kurang Optimal
Performa server adalah kunci penting dari kecepatan website. Server berperan menyimpan semua data dari website, sekaligus melayani permintaan data dari pengunjung website.
Kualitas server yang tidak optimal bisa berdampak pada website yang lambat. Nah, dari sisi server ini sendiri, ada dua faktor utama yang menjadi penyebabnya. Yaitu jenis server yang digunakan dan lokasi server.
Apache adalah server yang paling populer saat ini. Meski begitu, LiteSpeed mempunyai performa yang lebih baik, yaitu 84% lebih cepat dari Apache, dari beberapa kali uji coba.
Selain jenis server, lokasi server juga berpengaruh pada kecepatan website. Semakin jauh lokasi server dari pengunjung, maka prosesnya akan semakin lama dalam hal pengiriman data.
Jika pengunjung Anda berasal dari mayoritas Indonesia, memilih server berlokasi di Indonesia adalah yang terbaik. Jika pengunjung berasal dari beberapa negara berbeda, menggunakan CDN (Content Delivery Network) adalah solusi terbaik.
2. Kesalahan Konfigurasi
Saat pertama kali menggunakan website, biasanya kita akan terpaku menggunakan pengaturan default. Kemudian kita akan melakukan beberapa konfigurasi sesuai kebutuhan untuk meningkatkan performa website.
Beberapa pengaturan yang dimodifikasi antara lain adalah pengelolaan database, manajemen posting, pengaturan update, permalink SEO friendly, dan lain sebagainya.
Nah tidak jarang, dalam proses ini, terjadi kesalahan konfigurasi yang berdampak pada website lemot. Kesalahan konfigurasi juga kerap membuat website bermasalah dengan munculnya pesan error.
Untuk itu, berhati- hatilah saat akan melakukan konfigurasi pada website.
3. Penggunaan WordPress versi Lawas
WordPress memang CMS yang selalu bisa diandalkan. Selain mudah dalam proses konfigurasi, WordPress juga mempunyai banyak plugin dukungan untuk mengoptimalkan website Anda.
Yang perlu Anda perhatikan, pastikan WordPress Anda adalah versi terupdate. Menggunakan versi lawas yang sudah tidak kompatibel dapat berakibat buruk pada website. Selain lemot, website juga bisa mengalami kerentanan keamanan.
4. Penggunaan Database yang Terlalu Besar
Menyimpan data terlalu banyak di server juga bisa menjadi penyebab website lambat. Salah satu contohnya saat Anda mempunyai terlalu banyak postingan dengan banyak file gambar berukuran besar.
Tidak jarang juga, file gambar yang sudah tidak digunakan lagi juga masih menumpuk di database. Artinya ada banyak file sampah yang membebani database.
Penggunaan database yang terlalu besar juga bisa terjadi saat website Anda mengumpulkan data dari pengunjung. Ini lah salah satu alasan mengapa website dengan membership rentan dengan masalah loading website yang lambat.
5. Gambar yang Tidak Dioptimasi
Gambar mempunyai peranan yang penting untuk memastikan pesan kita sampai ke pengunjung. Tidak heran, banyak website berupaya menampilkan kualitas gambar terbaik di setiap postingan mereka.
Sayangnya, hal ini juga bisa berdampak buruk. Yaitu saat gambar- gambar tersebut belum dioptimasi dan berukuran besar. Gambar- gambar berukuran besar ini akan memakan banyak bandwidth dan membebani server.
Saat pengunjung mengakses konten berisi gambar berukuran besar ini, proses loading menjadi lama dan website terasa sangat lemot.
Untuk mengantisipasi ini, kurangilah penggunaan format gambar yang cenderung berukuran besar seperti GIF dan PNG. Selain itu, pastikan optimasi gambar lebih dulu sebelum mengunggahnya ke website.
6. Tidak Menggunakan CDN
CDN (Content Delivery Network), seperti yang Panda singgung di poin #1, punya peranan yang sangat penting untuk website dengan target audiens dari berbagai negara. Menggunakan CDN juga terbukti ampuh untuk mempercepat loading website.
CDN ini sendiri merupakan jaringan server global global yang saling terhubung dengan tujuan mendistribusikan konten dari server terdekat. Karena request visitor dilayani oleh server terdekat, maka akses pun menjadi lebih cepat.
Jika saat ini situs web Anda belum menggunakan CDN, cobalah untuk menggunakan layanan ini dan coba bandingkan performa sebelum dan sesudahnya.
7. Konten Flash yang Berlebihan
Konten flash dalam sebuah website memang menarik karena menampilkan animasi, konten audio, dan video, hingga game dengan lebih baik. Meski begitu, konten flash berdampak negatif pada kecepatan website.
Terutama, ukuran dari file flash cenderung besar sehingga memakan banyak resource server. Selain itu, proses download file saat tampil di browser juga lebih lama. Konten flash juga seringkali kurang aman dan berpotensi mengganggu kestabilan website.
8. Adanya Render Blocking Javascript
Javascript adalah bahasa pemrograman yang banyak digunakan dalam pengembangan web untuk membuatnya lebih dinamis dan interaktif. Di sisi lain, javascript juga berpotensi menimbulkan render block yang menyebabkan loading website lebih lama.
Render block ini sendiri adalah kondisi delay dimana semua file, termasuk Javascript akan tampil setelah loading secara sempurna. Tujuannya adalah agar laman website sudah tertata rapi saat diakses.
Meski begitu, pengunjung diharuskan menunggu selama proses berlangsung dan melihat laman kosong saja.
9. Konfigurasi Caching yang Kurang Optimal
Cache atau caching adalah proses penyimpanan data sementara, dimana browser, laman web atau aplikasi tidak perlu mengunduh data secara berulang- ulang atau terus- menerus untuk permintaan yang sama. Dengan pengaturan caching, penggunaan bandwidth dapat kita minimalkan dan proses loading menjadi lebih cepat.
Proses caching yang dimaksud disini adalah server-side caching, atau proses caching dari sisi server. Artinya, dalam hal ini, kinerja server-side caching sangat berpengaruh.
Selain itu, saat pemilik website tidak melakukan optimasi website dengan memasang plugin caching WordPress juga akan berpengaruh terhadap kecepatan website.
10. Penggunaan Tema yang “Berat”
Tema bukan hanya berkontribusi terhadap tampilan dan fitur menarik dalam website saja. Namun juga bisa mempengaruhi kecepatan website.
Ada beberapa tema yang memuat atribusi visual dan animasi menarik yang cenderung “berat”. Alasannya, mereka menampilkan banyak elemen tambahan seperti slider, pop up, dan sebagainya.
Tambahan fitur itu tentunya akan berpengaruh terhadap loading website. Terlebih saat pengunjung mengaksesnya melalui jaringan seluler, dan ternyata tema belum mendukung responsif dan AMP (Accelerate Mobile Page).
11. Plugin Terlalu Banyak
Sering tidak kita sadari, kita memasang terlalu banyak plugin di website WordPress kita. Kita memang membutuhkan plugin untuk mendukung kinerja website kita.
Meski begitu, kita perlu selektif juga dalam memilihnya agar tidak menjadi bumerang untuk website itu sendiri. Karena semakin banyak plugin, artinya semakin banyak resource yang dibutuhkan. Ini dia yang menjadi penyebab website lambat.
Iklan memang penting untuk membuat website tetap bernafas. Meski begitu, terlalu banyak iklan di website akan mengurangi kualitas pengalaman pengguna dan menjadi penyebab website lambat.
Banyaknya iklan pada website akan mempengaruhi jumlah HTTP request atau permintaan data ke server. Saat jumlah request terlalu banyak, server berpotensi kewalahan dan sangat berdampak pada performa website.
13. Banyak Komentar Spam
Hal lain yang juga menjadi penyebab website lambat adalah banyaknya komentar spam di website. Banyaknya spam akan berpengaruh buruk pada kinerja website. Selain kecepatan website menurun, SEO juga bisa terdampak.
Tidak lupa juga, banjir komentar spam juga dapat menurunkan kredibilitas website dan membuat pengunjung website merasa tidak nyaman.
Cara Mengatasi Website Lambat
Setelah mengetahui penyebab website lambat, langkah selanjutnya adalah mencoba mengatasinya. Berikut ini adalah beberapa langkah yang dapat Anda terapkan :
1. Lakukan Audit Website
Sebelum mulai melakukan optimasi website yang lambat, penting untuk melakukan audit website lebih dulu. Audit website memungkinkan Anda mengetahui masalah yang ada di website, sehingga Anda bisa melakukan perbaikan yang sesuai.
Dalam audit ini, ada beberapa tool yang bisa membantu Anda untuk cek kecepatan website. Antara lain adalah :
Pingdom
GTMetrix
Web Page Analyzer
Google Mobile Website Speed
Untuk mendapatkan gambaran yang baik, cobalah membandingkan hasil testing antara satu tool dan yang lainnya. Anda juga bisa membandingkan hasil tes web Anda dengan hasil tes web lain.
2. Pilih Server dengan Performa yang Baik
Apakah server benar- benar menjadi kendala kecepatan website Anda?
Server seringkali menjadi sumber masalah utama dari website. Tak peduli berapa banyak optimasi yang Anda lakukan, website akan masih lambat jika memang sumbernya berasal dari server.
Untuk itu, pastikan Anda memilih server yang memang kualitasnya baik agar performa optimal. Pastikan juga lokasi server berdekatan dengan geolocation target pengunjung Anda. Jika target pengunjung berasal dari Indonesia, Anda bisa memilih hosting Indonesia terbaik yang mempunyai server di Indonesia.
3. Optimasi Gambar
Ada beberapa cara yang bisa Anda lakukan untuk mengoptimasi gambar, yaitu dengan melakukan kompres untuk mengecilkan ukuran gambar, resize, dan memilih format gambar yang tepat. Proses ini tidak selalu membuat kualitas gambarnya menurun secara drastis.
Pasalnya, ada banyak tool yang memungkinkan Anda untuk melakukan kompresi gambar tanpa menurunkan kualitasnya secara signifikan. Panda sendiri menggunakan tool Compressor.io untuk urusan kompresi.
Anda juga bisa menggunakan kompresi otomatis menggunakan plugin WordPress, seperti WP Smush.
Dan tidak kalah pentingnya adalah memilih format gambar yang tepat. Saat ini ada empat jenis file gambar paling populer untuk website, yaitu PNG, JPG, GIF dan SVG. Keempat jenis format ini mempunyai karakteristik yang berbeda- beda sesuai tabel berikut :
4. Menggunakan CDN
Menggunakan CDN untuk website dengan banyak konten dan targeting audiens dari berbagai lokasi adalah keputusan terbaik. Karena faktanya, banyak studi case yang menunjukkan kalau penggunaan CDN bisa meningkatkan kecepatan website hingga 362%!
Dalam penggunaan CDN, file statis seperti gambar, flash, file CSS< Javascript dan lainnya akan tersimpan di cache server CDN. Selanjutnya, file tersebut akan didistribusikan ke berbagai lokasi server di seluruh dunia.
Saat ada pengunjung masuk ke website, CDN akan mengirimkan permintaan mereka dari lokasi terdekat. Dengan begitu, setiap permintaan tidak selalu berasal dari server utama. Selain lebih cepat, CDN juga meringankan kerja dari server itu sendiri.
Kalau Anda berbisnis secara digital atau mempunyai website untuk menunjang bisnis Anda, milikilah website yang cepat. Hal ini tidak bisa ditawar lagi. Titik.
Website yang lambat atau lemot akan menimbulkan kerugian yang besar untuk bisnis Anda. Mulai dari pengunjung yang ogah- ogahan untuk tinggal lama di laman web Anda, penurunan tingkat konversi, hingga menurunnya kepuasan pelanggan.
Jika tidak mengatasi masalah website lemot ini segera, kerugian ini akan semakin membesar dan berdampak lebih jauh. Jadi, tak ada tawar menawar lagi. Kenali penyebab website Anda lambat dan atasi segera!
Mengenali penyebab website lemot akan membantu Anda mengetahui pemicu loading lambat ini. Dengan begitu, Anda bisa mengambil keputusan yang tepat untuk mengatasinya.
Banyak blogger yang menonaktifkan AMP di website mereka dengan berbagai alasan. Kendati AMP memang mempercepat loading website di mobile, kenyataannya ada beberapa isu yang membuat para blogger tidak senang.
Di awal kemunculannya, AMP (Accelerated Mobile Pages) mengklaim bahwa mereka bisa meningkatkan performa website dan meningkatkan user experience. Namun versi webmaster, AMP sering dirasa menurunkan fungsionalitas website dan tidak terlalu berkontribusi pada SEO.
Artikel Panda kali ini akan mengulas secara lengkap tentang AMP, masalah yang sering webmaster keluhkan seputar AMP dan cara menghapus AMP dari website WordPress.
Apa itu Google AMP?
AMP (Accelerated Mobile Pages) merupakan sebuah teknologi yang Google kembangkan untuk meningkatkan kecepatan akses sebuah website di browser mobile.
Google AMP bekerja untuk menayangkan halaman dengan HTML dan javascript seminimal mungkin agar bisa disimpan ke dalam Google AMP Cache. Dengan begitu, Google bisa menggunakan cache tersebut untuk pengguna yang mengakses link melalui hasil pencarian.
Karena menggunakan HTML dan javascript seminimal mungkin, artinya ada sebagian elemen website yang hilang agar aksesnya lebih cepat. Itulah mengapa tampilan AMP terlihat lebih ‘minimalis’ dari website biasa dan minim fitur.
Di artikel sebelumnya, Panda juga pernah mengulas tentang apa itu Google AMP dan cara menggunakannya. Jika Anda ingin mengetahui AMP lebih lengkap, artikel tersebut bisa menjadi rujukan Anda.
Alasan Webmaster Memilih Menghapus AMP
Implementasi AMP sendiri cenderung tidak mudah. Ada beberapa potensi masalah yang kerap muncul saat menggunakan AMP. Mulai dari sisi interface dan fungsionalitas website, hingga penurunan performa dari sebagian besar metrik.
Salah satu blogger kenamaan dan penulis di Hacker Noon, Alex Kras, pernah menulis alasan mengapa ia menonaktifkan AMP dari website miliknya.
Menurut Kras, karena AMP meminimalkan javascript, ini membuat fitur website nya tidak berjalan maksimal. Selain itu, saat mengklik sebuah gambar atau tautan, AMP akan melanjutkan pencarian ke Google, bukan mengarah ke website yang sama.
Ia juga mencatat apa saja yang terjadi selama satu bulan usai menonaktifkan AMP.
Tingkat lalu lintas tampaknya tetap kira-kira sama dan semua metrik tampak membaik. Agar adil, saya menerbitkan empat artikel baru karena saya menonaktifkan AMP, jadi angka saya bisa menjadi benjolan bagus dari konten baru.
Alex Kras
Selain itu, berikut adalah beberapa masalah yang kerap muncul saat webmaster menggunakan AMP :
1. Tingkat Konversi Menurun
Karena penggunaan HTML dan javascript yang terbatas, webmaster akan kesulitan untuk memaksimalkan fitur dalam website nya. Terutama dalam hal mendorong pengunjung untuk melakukan subscribe, mengisi form kontak, dan membeli produk.
Akibatnya, tingkat konversi pada web AMP cenderung lebih rendah daripada website biasa yang bisa memaksimalkan fitur button, kolom, dan CTA (Call to Action) di situsnya.
2. Fitur Seluler yang Sangat Terbatas
AMP tidak bisa menampilkan menu navigasi website seperti yang webmaster harapkan. Termasuk sidebar atau konten lain. Hal ini mengakibatkan turunnya pageviews dari pengunjung mobile.
Selain itu, pakar user experience juga sangat menentang tombol ‘close yang terletak di atas tampilan AMP. Tombol ini memberi dorongan psikologis pada pengunjung untuk kembali ke mesin pencarian Google dan tidak membaca topik lain yang webmaster tawarkan di situsnya.
3. Interaksi User yang Rendah
Keterbatasan fitur di website tentunya akan berdampak pada menurunnya interaksi pengguna. Pengguna akan kesulitan untuk membagikan konten ke akun media sosial, berkomentar, memberi rating, dan interaksi dengan konten lain.
4. Sudah Menggunakan Theme WordPress Responsive
Salah satu tujuan dari penggunaan theme WordPress responsif adalah untuk menyajikan tampilan dengan UX yang baik untuk pengguna mobile. Banyak webmaster merasa kalau penggunaan theme responsive sudah cukup untuk melayani pengguna mobile mereka.
4. Pendapatan Google Adsense Menurun
Banyak webmaster yang merasa kalau pendapatan mereka dari Google Adsense menurun dengan penggunaan AMP. Hal ini terjadi karena tidak semua jenis iklan tampil di AMP.
Selain itu, iklan di AMP muncul lebih lambat dan pendapatan per 1000 tampilan AMP lebih kecil dari halaman biasa.
Cara Menonaktifkan AMP di Website Tanpa Kehilangan Trafik
Ada beberapa langkah untuk menghapus AMP dari website tanpa mempengaruhi SEO dan tanpa kehilangan trafik. Ya, menonaktifkan AMP di website memang bukan sekedar menghapus plugin dan selesai begitu saja.
Karena jika Anda hanya melakukan ini, Google akan memberi peringatan bahwa ada banyak halaman error 404 di website Anda. Untuk menghindarinya, setidaknya ada 3 step yang bisa Anda ikuti :
Setting ‘no-follow’ untuk laman AMP
Setting Redirection
Menghapus Plugin AMP
Mari mulai kita lakukan satu per satu :
A. Setting ‘no-follow’ di laman AMP
Jika sebelumnya Anda menggunakan plugin AMP by AMP Project Contributor, Anda perlu beralih lebih dulu ke plugin AMP for WP. Ini karena plugin ini memungkinkan Anda untuk memberi tag no-index ke AMP.
Setelah menginstal dan mengaktifkan plugin AMP for WP, masuk ke bagian AMP > Setting > SEO. Selanjutnya, tambahkan meta tag no follow berikut ini :
<meta name=”robots” content=”noindex,follow”/>
Tag nofollow ini nanti berfungsi agar robot Google berhenti merayapi halaman AMP situs web kita.
B. Menghapus Plugin AMP
Meskipun sudah setting no-follow untuk laman AMP, Google Search umumnya membutuhkan waktu beberapa hari untuk menghapus laman AMP hingga menjadi 0.
Untuk itu, Anda perlu menunggu sedikit waktu beberapa hari sampai halaman AMP berkurang di hasil pencarian. Atau, lakukan pengamatan secara berkala di Search Console > AMP.
Setelah itu, silahkan deactivate dan hapus plugin AMP dari website Anda. Setelah itu, lanjutkan proses ini ke tahap terakhir.
C. Membuat Redirection Halaman AMP
Langkah terakhir, buat pengalihan untuk halaman- halaman cache yang masih tersisa di Google agar terhindar dari error 404.
Pengalihan ini bisa Anda lakukan dengan dua metode, yaitu :
Menggunakan Plugin Redirection
Menambahkan Redirect secara Manual via .htaccess
1. Redirect via Plugin Redirection
Pertama, Anda perlu menginstal dan mengaktifkan plugin Redirection. Setelah itu, masuk ke menu Perkakas (Tool) >> Pengalihan (Redirection), dan Add New.
Di field source URL, tambahkan kode :
/(.* )/amp
Di field target URL, tambahkan kode :
https://situsAnda.com/$1
Jangan lupa mengganti url di field target dengan alamat situs web Anda.
Di kolom URL option, jangan lupa pilih Regex dan pilih Redirection di pilihan Group. Setelah semua opsi sudah, tap ‘Add Redirect’ untuk menyimpan semua perubahan.
Setelah beberapa menit, cobalah untuk mengunjungi laman AMP Anda dan lakukan pengecekan apakah redirect sudah bekerja dengan baik.
2. Redirect Manual via .htaccess
Selain plugin Redirection, cara lain yang bisa Anda gunakan adalah setting redirect manual di .htaccess.
Pertama- tama, Anda perlu masuk ke cPanel atau direktori website Anda. Pilih public_html atau folder root domain Anda, dan pilih .htaccess. Buka file .htaccess dan tambahkan beberapa baris kode berikut di bagian bawah .htaccess :
// Redirect AMP to non-AMP
RewriteEngine On
RewriteCond %{REQUEST_URI} (.+)/amp(.*)$
RewriteRule ^ %1/ [R=301,L]
Setelah selesai, jangan lupa klik Save untuk menyimpan perubahan.
Kesimpulan
Google AMP pada dasarnya memang berdampak pada peningkatan performa website dari sisi kecepatan. Namun dalam prakteknya, AMP juga menurunkan fungsionalitas website secara keseluruhan. Selain itu, dalam penerapannya juga kerap ada masalah error yang sering muncul.
Saran Panda, cobalah lakukan testing dulu performa sebelum vs setelah menggunakan dan meninggalkan AMP. Testing ini setidaknya berlangsung masing- masing 1 bulan. Buat beberapa indikator yang menurut Anda perlu masuk penilaian. Misalnya saja sisi UX, peningkatan trafik dan performa metrik- metrik lain (pageview, CTR, dsb).
Setelah itu, jika memutuskan untuk menghapus AMP, Anda bisa mengikuti tutorial Panda ini untuk menonaktifkan AMP di website WordPress tanpa kehilangan banyak trafik.
Bicara soal optimasi WordPress, mempercepat loading website adalah poin penting yang tidak boleh kita lewatkan. Dengan website yang cepat dan bisa diandalkan, visitor akan betah berlama- lama bereksplorasi di website kita. Selain itu, kecepatan website juga menjadi salah satu pertimbangan Google dalam menilai kualitas sebuah website. Website yang cepat akan mempunyai skor baik dalam analisis Google, dan secara tidak langsung akan berkontribusi pada performa web di mesin pencari.
Mengapa Penting untuk Punya Website yang Loadingnya Cepat?
Pernahkah Anda berkunjung ke sebuah website, dan halaman yang Anda akses terasa berat sekali sehingga lama terbuka? Apa yang Anda lakukan setelah itu? Anda cenderung tidak sabar dan segera menutup halaman web tersebut. Tidak cukup di situ, Anda kemudian akan mengklik website lain dari hasil penelusuran, dan kemudian menjelajah dengan lebih lama dan leluasa karena website lebih cepat. Familiar dengan situasi ini? Ya, website yang lambat memang menjadi salah satu alasan utama mengapa pengunjung pergi. Bahkan menurut data Kissmetrics, 40% pengunjung akan meninggalkan website dengan loading melebihi 3 detik. Sedangkan di perangkat seluler, jumlah ini meningkat menjadi 53%. Artinya, separuh dari seluruh audiens Anda akan batal masuk ke website saat loadingnya lambat. Kerugian lain yang bisa Anda peroleh antara lain :
Trafik website menurun.
Pengalaman pengguna yang buruk.
Tingkat konversi rendah, karena customer pergi, bahkan sebelum melihat produk Anda.
Menurunnya performa di hasil penelusuran mesin pencari karena Google tidak akan memprioritaskan website yang lambat.
Cara Cek Kecepatan Website
Sebelum mempercepat loading website, tentu kita perlu mengetahui di posisi mana website kita saat ini. Untuk cek kecepatan website, berikut ini adalah beberapa tool yang bisa Anda gunakan :
Pingdom (Berbayar untuk mendapatkan insight lebih lengkap)
Untuk menilai apakah kecepatan website ini termasuk cepat, rata- rata atau jelek, sebenarnya sedikit abu- abu. Namun, beberapa pakar SEO menggunakan angka ini sebagai pedoman menilai kecepatan website :
Dibawah 1 detik = Sempurna
1-3 detik = Diatas rata-rata
3-7 detik = Rata-rata
7 detik ke atas = Termasuk jelek
Cara Mempercepat Loading Website WordPress
Terlepas dari data diatas, MachMetrics (layanan monitoring kecepatan website) setuju jika waktu loading ideal website adalah tiga detik atau kurang. Jika sudah 7 detik ke atas, artinya website harus segera dioptimalkan. Berikut ini adalah beberapa cara ampuh untuk mempercepat loading website WordPress Anda :
1. Aktifkan Caching WordPress
Caching adalah salah satu trik terbaik untuk mempercepat loading website WordPress. Ada beberapa plugin caching terbaik yang bisa Anda gunakan. Misalnya saja WP Super Cache, W3 Total Cache atau LiteSpeed Cache.
Plugin caching ini nantinya akan bekerja membuat file html statis. File ini lah yang akan pengguna akses kembali dengan lebih cepat karena menyajikan data tersimpan. Dengan begitu, kinerja server akan lebih ringan dan halaman diakses dengan lebih cepat.
Selain itu, plugin caching juga mempunyai berbagai fungsi tambahan, seperti minify file HTML, CSS dan juga caching browser.
2. Menggunakan WordPress Versi Terbaru
WordPress adalah open source yang terus berkembang dan disempurnakan. Dalam setiap pembaruannya, ada perbaikan bug dari versi sebelumnya dan juga memperbarui fitur. Dari sisi kecepatan, WordPress versi terbaru tentu lebih optimal dan masalah kerentanan lebih teratasi. Sebaliknya, WordPress versi lawas cenderung lebih lamban dan rentan dengan ancaman keamanan.
3. Melakukan Kompresi Gambar di Website
Gambar sering menjadi masalah untuk kecepatan website. Gambar berukuran besar di website sudah pasti akan meningkatkan loading website. Maka dari itu, penting untuk memastikan gambar sudah terkompresi dengan optimal.
Cara mengkompres gambar yang baik adalah dengan meminimalkan ukuran gambar, tapi tetap terlihat dengan resolusi yang baik. Untuk mengatasi ini, Anda bisa menggunakan plugin kompresi seperti WP Smush.
Wp-Smush akan membantu optimasi gambar di seluruh website dengan tetap menjaga resolusinya. Jika Anda tidak ingin menggunakan plugin, bisa juga menggunakan website layanan kompresi gambar, seperti compressor.io.
Tentu saja, semakin banyak plugin akan menambah beban loading website. Bukan berarti Anda harus menghapus banyak plugin sekaligus. Karena faktanya, plugin adalah bagian penting dalam membangun website WordPress. Namun disini, Anda perlu mempertimbangkan mana saja plugin tidak perlu atau yang mempunyai fungsi saling melengkapi dan mirip. Hapus plugin tidak perlu dan pertahankan plugin yang mendukung fungsionalitas dan optimasi website.
5. Optimalkan dengan CDN (Content Delivery Network)
CDN atau Content Delivery Network adalah jaringan server data yang tersebar secara geografis. Penggunaan CDN akan mengurangi latensi dan meningkatkan kecepatan server dalam penyajian konten. CDN bekerja dengan cara menyajikan konten statis ke setiap server data di jaringan. Permintaan ini kemudian diterima oleh web server untuk diteruskan ke server terdekat dengan lokasi klien. Untuk kamu yang bingung dalam memilih CDN apa yang tepat, cobalah untuk mengintip rekomendasi Panda dalam artikel CDN terbaik dan terfavorit WordPress.
6. Menggunakan Tema WordPress yang Ringan dan Original
Dalam memilih tema WordPress, tampilan sebaiknya bukan satu- satunya pertimbangan Anda. Anda perlu mendalami fitur- fitur yang provider tawarkan dan memastikan jika tema tersebut punya load yang ringan. Selain itu, Panda juga menyarankan penggunaan tema WordPress premium dan original untuk mengoptimalkan SEO dan alasan keamanan website. Dengan begitu, selain mendukung loading yang cepat, tema juga mendukung situs Anda lebih optimal di mesin pencari.
7. Update PHP ke Versi Terbaru
Cara selanjutnya untuk mempercepat loading website adalah dengan memastikan versi PHP yang website unakan adalah yang terbaru. Misalnya saat Anda masih menggunakan versi PHP 5, dimana versi terbaru adalah 7.4. Artinya, versi PHP Anda sudah usang dan perlu upgrade. Bermigrasi dari PHP 5 ke PHP 7 akan berdampak positif pada situs karena versi terbaru membantu pengoptimalan memori yang lebih baik. Untuk memperbarui versi PHP, Anda bisa mengaksesnya melalui cPanel. Sebelum melakukan pembaruan PHP, pastikan plugin dan tema yang Anda gunakan sudah mendukung versi PHP terbaru.
8. Optimasi Database
Ada banyak aktivitas di website WordPress yang menambah beban kerja server dan membuat database semakin berat. Selain postingan secara umum, selalu saja ada komentar spam, tags yang sudah tak terpakai, dan juga revisi konten yang menumpuk di database.
Untuk meringankan WordPress Anda, cobalah menggunakan plugin WP-Optimize. Dengan menginstal dan mengaktifkan plugin ini, Anda bisa melakukan pembersihan database secara berkala dengan mudah.
9. Mengaktifkan Gzip Compression
Mengaktifkan Gzip compression atau kompresi file juga menjadi salah satu cara untuk mempercepat loading website WordPress. Dengan mengaktifkan fitur ini, kita bisa mengkompres file berukuran 100MB ke ukuran 25MB ke dalam file berformat Zip.
Aktivasi Gzip Compression ini bisa dilakukan melalui plugin optimasi, atau secara manual dengan menambah baris kode di .htaccess. Untuk tutorial lengkap enable GZip Compression di website, Anda bisa membaca artikel Panda : Cara Mengaktifkan GZip Compression untuk Optimasi Kecepatan Website.
Untuk mengecek apakah website sudah mengaktifkan Gzip compression, Anda bisa mengetesnya dengan CleverStats.
10. Minify CSS, Javascript dan HTML
Langkah selanjutnya untuk mempercepat loading website adalah memastikan file- file yang ada di web tidak berat. Untuk memastikan ini, Anda perlu melakukan Minify, yaitu proses menghilangkan karkater yang tidak terpakai dalam struktur kode.
Proses minify ini bisa dilakukan terhadap file CSS, javascript dan HTML. Melalui Minify, file kode menjadi lebih ringan sehingga loading website bisa lebih cepat.
Plugin cache biasanya sudah menyertakan fitur minify di dalamnya. Jadi, Anda tidak perlu menggunakan plugin yang berbeda jika sudah mengoptimalkan fitur dari plugin cache yang ada.
11. Membatasi Jumlah Konten per Halaman
Tampilan konten yang terlalu banyak bisa menjadi beban untuk loading website. Cobalah untuk menghemat jumlah konten dan elemen yang Anda tampilkan di halaman utama atau bermain dengan pagination.
Pagination bisa Anda terapkan di bagian kolom komentar, postingan, serta halaman utama dengan banyak konten. Di sisi lain, pagination ini juga menghindarkan website dari pemborosan bandwidth, sekaligus meningkatkan pengalaman pengguna karena penyajian konten lebih efisien.
11.1. Pagination Komentar di Website WordPress
Berikut cara mengatur pagination di kolom komentar WordPress :
Masuk ke dashboard WordPress, buka Pengaturan > Diskusi.
Di halaman Diskusi, atur jumlah maksimal komentar per halaman dan urutan tampilannya.
Scroll ke bawah dan klik Simpan Perubahan
11.2 Pagination Konten pada Postingan WordPress di Gutenberg Block Editor
Ada dua cara yang bisa kita lakukan dalam membuat pagination dalam postingan, yaitu secara manual atau otomatis. Untuk membagi konten dengan secara manual dengan Gutenberg :
Arahkan kursor ke area yang ingin dibagi, lalu klik ikon plus.
Cari “Page Break”, lalu klik opsi tersebut.
Jika ingin menerapkan pagination secara otomatis di semua halaman, Anda dapat menggunakan plugin pagination yang tersedia di WordPress. Misalnya saja WP-Paginate atau WP-PageNavi. Dengan begitu, Anda dapat membagi halaman secara otomatis sesuai dengan batas kata minimal yang Anda tentukan.
12. Disable Fungsi Pingback dan Trackback
Trackback dan Pingback memang membantu website menjadi lebih cepat terindeks di mesin pencari. Di sisi lain, fitur ini juga kerap dimanfaatkan para spammer untuk mendapatkan backlink otomatis.
Nah, aktifitas ini mempunyai kecenderungan untuk menciptakan sampah di database WordPress. Akibatnya, loading website menjadi lebih lambat. Untuk menonaktifkan, cobalah menggunakan plugin Disable XML-RPC Pingback.
Anda juga bisa menonaktifkan secara manual dengan masuk ke Dashboard WordPress > Pengaturan > Diskusi, lalu menghilangkan centang di opsi Allow Link Notification.
13. Membatasi Jumlah Revisi Setiap Postingan
Revisi yang kerap webmaster lakukan seringkali meninggalkan sampah di database WordPress. Untuk meminimalisir hal ini, membatasi revisi postingan akan membuat database WordPress menjadi lebih ringan.
Untuk melakukannya, Anda perlu membuka file wp-config di CPanel atau via FTP dan menambahkan kode berikut ini :
define( 'WP_POST_REVISIONS', 5 );
Isi angka tersebut sesuai dengan jumlah revisi yang Anda inginkan.
14. Hindari Langsung Upload Video, Gunakan Embed URL
Jika Anda berniat menambahkan video di dalam konten website, hindari untuk menguploadnya secara langsung. Sebaliknya, manfaatkan lah fitur embed video dari platform penyedia Video dan menaruhnya di konten Anda.
Dengan fitur embed ini, video akan tampil secara otomatis saat publish, tanpa harus membebani kinerja website dan menghabiskan bandwidth. Dengan begitu, meski ada cukup banyak konten video di website, Anda tetap bisa mempercepat loading website Anda.
15. Disable Hotlink di Website
Hotlink mungkin tidak berimbas langsung pada kecepatan website. Namun menonaktifkannya akan menjadi salah satu optimasi untuk menjaga kecepatan situs web Anda.
Pasalnya, fitur hotlink ini memungkinkan pengguna dari website lain yang mengakses gambar situs Anda, akan mencuri bandwith server. Bandwidth menjadi boros dan terbebani.
Untuk menonaktifkannya, Anda hanya perlu mengupload file berikut ini ke .htaccess :
Jumlah request database ke server tentu berpengaruh terhadap kecepatan loading. Untuk mempercepat website, cobalah untuk mengurangi penggunaan tabel database dengan query tinggi.
Jika Anda ragu atau tidak tahu pasti tabel database mana yang bisa memberatkan server, Anda bisa menggunakan bantuan plugin. Anda bisa menggunakan plugin Query Monitor atau WP-Optimize.
Plugin Query Monitor akan membantu melakukan pengecekan database, sehingga Anda bisa melakukan optimasi performa server dengan mudah. Atau dengan WP-Optimize yang juga mempunyai opsi optimasi tabel database.
17. Meminimalkan Redirect
Kadang redirect memang dilakukan untuk tujuan tertentu. Namun yang perlu kita garis bawahi, redirect juga membuat permintaan load HTTP berlebih dan memperlambat kecepatan website.
Untuk itu, Anda perlu mengontrol alur konten di website Anda agar tidak menghasilkan terlalu banyak redirect. Anda juga perlu mengurangi link ke halaman lain di luar website, jika memang tidak begitu memerlukannya.
18. Mengaktifkan HTTP Keep-Alive
Trik selanjutnya untuk mempercepat loading website adalah dengan mengaktifkan HTTP Keep-Alive. Dengan metode Keep Live, website akan memberi perintah agar request file ke server tidak berulang.
Untuk mengaktifkannya, Anda bisa menambahkan baris kode berikut ke .htaccess :
<IfModule mod_headers.c>
Header set Connection keep-alive
</IfModule>
19. Menghilangkan Query String dari Sumber Statis
Optimasi selanjutnya adalah menghilangkan query string dari sumber statis, seperti Javascript dan style-sheet. Perlu Anda ketahui, menghapus cache tidak bisa dilakukan pada link yang berisi tanda baca “?” dan “&”.
Query string mencegah server menyimpan situs web dalam cache. Akibatnya kecepatan halaman akan melambat. Dengan menghapus query string, Anda bisa mengoptimalkan cache dan mengurangi loading halaman.
Anda bisa menghapus query string dengan dua cara berbeda. Yang pertama adalah dengan menggunakan plugin optimasi seperti W3 Total Cache atau plugin WP Remove Query Strings From Static Resources.
Sedangkan untuk cara manual, Anda bisa menambahkan beberapa kode berikut di function.php :
20. Meletakkan CSS di Header dan Javascript di Footer
Mengatur penempatan CSS dan javascript juga bisa mempercepat loading website WordPress. Javascript adalah client side programming yang dijalankan dari sisi web browser klien, bukan dari sisi web server.
Maka dari itu, meletakkan file- file JS di bagian footer akan membuat web server memuat halaman lebih dulu sampai selesai, baru dari sisi klien merender file JS. Dengan trik ini, loading website akan bisa lebih cepat.
21. Layanan Hosting yang Berkualitas
Tips terakhir untuk mempercepat loading website adalah dengan menggunakan layanan hosting yang tepat. Selain itu, Anda perlu mengidentifikasi kebutuhan hosting website Anda.
Jika Anda hanya membutuhkan kebutuhan server biasa, shared hosting mungkin sudah cukup. Namun jika tingkat kunjungan sudah tinggi dan membutuhkan resource lebih, mungkin sudah saatnya untuk menggunakan VPS.
Selain itu, pastikan Anda menggunakan layanan hosting yang berkualitas, baik dari sisi kualitas server, fitur, dan juga layanan. Untuk melihat referensi layanan hosting, Anda bisa membaca artikel Panda 5+ Rekomendasi Web Hosting Terbaik Indonesia.
Kesimpulan
Website adalah perangkat penting di era digital. Kita membutuhkan website bukan sekedar untuk “ada” saja. Namun benar- benar untuk mengoptimakan bisnis kita.
Mengoptimalkan website bukan tentang isi konten saja, namun juga menghadirkan website yang cepat sehingga memberi pengalaman pengguna yang baik. Jika saat ini website lemot menjadi kendala Anda, mudah- mudahan deretan tips dari Panda ini bisa membantu.
Largest Contentful Paint adalah istilah yang kerap muncul saat kita mengecek kecepatan website. LCP ini sendiri adalah metrik pengalaman pengguna Google yang mulai menjadi salah satu penentu faktor peringkat di tahun 2021.
Itulah mengapa LCP menjadi salah satu pembahasan menarik yang akan Panda ulas kali ini.
Apa itu Largest Contentful Paint?
Definisi dari Largest Contentful Paint atau LCP adalah ukuran berapa lama sebuah situs dalam mengunduh konten utama dan siap untuk berinteraksi. Dalam hal ini, apa yang diukur adalah gambar atau blok konteks terbesar dalam viewport pengguna. Apapun yang melampaui layar tidak akan masuk hitungan. Tipe elemen yang diukur adalah gambar, gambar poster video, gambar latar belakang, dan elemen teks tingkat blok seperti tag paragraf.
Apa saja yang perlu kita ketahui dari Largest Contentful Paint?
Tentu ada alasan mengapa LCP terpilih sebagai metrik kunci untuk skor web vitals. Salah satunya, LCP bisa secara akurat mengukur seberapa cepat halaman website digunakan. Selain itu, metrik ini juga disebut akan relatif mudah dioptimalkan.
Selain hal ini, ada beberapa hal yang webmaster perlu ketahui terkait LCP ini :
Elemen Blok Tingkat (Block Level Element) untuk Menghitung Skor LCP
Elemen tingkat blok yang digunakan untuk mengukur skor LCP adalah <main> dan <section>, serta elemen heading, div, form. Pada dasarnya, elemen HTML tingkat blok apapun yang berisi elemen teks bisa menjadi tolak ukur, asalkan merupakan elemen besar dalam website.
Tapi yang menjadi catatan, kita tidak menggunakan semua elemen ini. Misalnya saja, elemen SVG dan video saat ini tidak menjadi bagian dalam menghitung LCP.
LCP adalah Metrik yang Mudah Dipahami
LCP disebut sebagai metrik yang mudah dipahami. Yang webmaster harus lakukan adalah melihat halaman website dan menentukan apa blok teks atau gambar terbesar itu, lalu mengoptimalkannya dengan membuatnya lebih kecil.
Bisa juga dengan menghapus apapun yang bisa mencegah atau memperlambat proses pengunduhan konten utama dengan cepat.
Karena Google kini memprioritaskan pengindeksan mobile, maka optimasi untuk viewport mobile harus kita utamakan, baru selanjutnya desktop.
Menunda Load Elemen Besar Mungkin Tak Berpengaruh
Mungkin saja Anda berpikir bahwa elemen besar itu terlalu penting untuk ukurannya kita kecilkan atau bahkan kita hilangkan. Sehingga memilih untuk menunda load mereka dengan plugin atau tool.
Sayangnya, hal ini tidak berdampak banyak. Misalnya saja, gambar berfitur besar mungkin membutuhkan waktu lebih lama untuk diunduh daripada elemen level blok teks terbesar.
Elemen Gambar Sangat Berpenaruh dalam LCP
Publisher biasanya mengunggah gambar dalam ukuran asli lalu menggunakan HTML atau CSS untuk mengubah ukuran gambar agar bisa tampil dalam ukuran yang lebih kecil.
Google menyebut ukuran asli ini sebagai ukuran gambar “intrinsik”.
Misalnya saja, saat publisher mengunggah gambar berukuran 2048 x 1152. Maka ukuran ini disebut dengan ukuran intrinsik. Saat publisher mengubah ukuran gambar tersebut menjadi 640×360 maka ukuran yang tampil ini merupakan ukuran yang terlihat.
Untuk keperluan menghitung ukuran gambar, Google menggunakan ukuran yang lebih kecil antara gambar intrinsik dan ukuran yang terlihat. Jadi, trik ini bisa cukup membantu sebenarnya.
Namun untuk best practice nya, disarankan untuk mengupload gambar yang sama seperti gambar dalam ukuran yang terlihat. Ini akan membuat gambar di-unduh dengan lebih cepat dan skor LCP menjadi lebih optimal.
LCP dalam Menangani Gambar yang Dilayani dari Domain Lain
Gambar yang disajikan dari domain lain, seperti halnya dari CDN, umumnya tidak dihitung dalam perhitungan largest contentful paint. Namun jika publisher ingin sumber daya itu menjadi bagian dari perhitungan, bisa mengaturnya di fitur Timing-Allow-Origin.
Untuk memastikannya, karena ada kemungkinan setiap layanan CDN berbeda, Anda dapat membaca resource informasi dari CDN yang Anda gunakan. Jika masih belum menemukan informasi yang Anda butuhkan, cobalah untuk berkonsultasi langsung pada layanan CDN Anda.
Cara Menghitung Skor LCP
Semua elemen yang ada di viewport (layar pengguna) digunakan untuk menghitung LCP. Artinya, gambar yang tampil di luar layar dan kemudian masuk ke halaman setelah proses rendering, tidak terhitung sebagai bagian dari skor LCP.
Kebalikannya, elemen yang tampil dari awal viewport kemudian terdorong keluar dari layar bisa dihitung sebagai bagian dari perhitungan LCP.
Dan pertanyaan pentingnya adalah, bagaimana cara mendapatkan skor dalam LCP?
Dalam LCP ini sendiri terdapat dua jenis alat penilaian. Yang pertama adalah Field Tools, dan yang kedua adalah Lab Tools.
Field tools adalah pengukuran aktual sebuah website. Sedangkan Lab Tool memberikan skor virtual berdasarkan penjelajahan yang disimulasikan menggunakan algoritma dengan memperkirakan kondisi internet yang mungkin ditemui pengguna pada ponsel.
Cara Optimasi Masalah Largest Contentful Paint
Ini mungkin bagian paling penting yang perlu kita terapkan dalam optimasi website. Setidaknya ada tiga area utama (ditambah satu untuk Javascript Frameworks), yang perlu dioptimasi :
Server lambat
JavaScript dan CSS pemblokiran render
Waktu loading resource/ sumber daya yang lambat
Server Lambat
Server yang lambat akan membuat waktu render apapun di layar menjadi lebih lama. Sebaliknya, waktu server yang lebih cepat bisa meningkatkan setiap metrik pemuatan satu halaman, termasuk LCP. Sebelum melakukan perbaikan, cobalah untuk memperbaiki bagaimana dan dimana server Anda menangani konten. Anda bisa menggunakan Time to First Byte (TTFB) untuk mengukur waktu respon server. Untuk meningkatkan TTFB, berikut ini adalah sejumlah cara berbeda yang bisa Anda coba :
Optimalkan server Anda dengan menganalisa dan meningkatkan efisiensi kode dari sisi server
Sajikan halaman HTML dengan halaman cache lebih dulu
Buat koneksi pihak ketiga lebih awal
Buat Pemblokiran JavaScript dan CSS
Sebelum browser bisa merender konten apa pun, ia perlu mengurai kode HTML ke dalam DOM tree. Pengurai HTML ini akan berhenti saat bertemu dengan stylesheet eksternal (<link rel = “stylesheet”>) atau tag JavaScript yang sinkron (<script src = “main.js”>). Script dan stylesheet keduanya adalah sumber pemblokiran render yang menunda FCP dan berakibat LCP. Maka dari itu, menunda semua javascript dan CSS tidak penting bisa membantu pemuatan konten utama halaman website. Berikut ini adalah beberapa cara yang bisa Anda lakukan untuk membuat pemblokiran javascript dan CSS :
Minify CSS
Tunda load CSS tidak penting (Defer non-critical CSS)
Sisipkan Inline critical CSS untuk konten bagian atas dengan memasukkannya langsung di bagian <head>
Kurangi waktu pencekalan javascript dengan cara unduh dan sajikan jumlah minimal JavaScript yang pengguna perlukan.
Untuk problem yang berkaitan dengan CSS yang tidak penting untuk menyajikan apa yang pengguna lihat, tips dari Google adalah :
“Hapus semua CSS yang tidak digunakan seluruhnya atau pindahkan ke stylesheet lain jika digunakan pada halaman terpisah situs Anda.
Untuk CSS apa pun yang tidak perlu untuk rendering awal, gunakan loadCSS untuk memuat file secara tidak sinkron, yang memanfaatkan rel = “preload” dan “onload”.
Meskipun peningkatan waktu pemblokiran CSS atau Javascript bisa secara langsung berkontribusi pada skor LCP yang buruk, waktu yang diperlukan untuk memuat banyak resource juga mempengaruhi LCP. Jenis resource ini antara lain :
<img> element
Elemen/ tag <image> di dalam elemen <svg>
Tag <video> (Gambar poster video digunakan untuk mengukur LCP)
Elemen dengan gambar latar belakang dimuat melalui fungsi url () (sebagai lawan dari CSS gradient)
Juga elemen tingkat blok yang mengandung simpul teks atau elemen teks inline lainnya
Untuk mengurangi loading resource ini, berikut adalah beberapa cara yang bisa kita praktekkan :
Optimasi dan kompresi gambar
Pre-loading konten tertentu
Kompres file teks (Misalnya dengan Gzip)
Tool untuk Mengukur Skor LCP
Tool untuk mengukur largest contentful paint terdiri dari dua jenis, seperti yang Panda ulas di atas tadi. Yaitu terdiri dari Lab Tools dan Field Tools.
Field Tools
Field tool rekomendasi Google untuk mengukur LCP adalah :
Dua tool pertama disediakan oleh Google, dan tool terakhir disediakan oleh pihak ketiga.
Kesimpulan
Pembahasan Largest Contentful Paint mungkin terdengar sangat teknis untuk sebagian orang. Maka dari itu, memang perlu pemahaman dan tindakan teknis untuk melakukan optimasi LCP ini.
Berikut adalah resume dari artikel LCP yang Panda sajikan :
Apa itu Largest Contentful Paint?
Largest Contentful Paint atau LCP adalah ukuran berapa lama sebuah situs dalam mengunduh konten utama dan siap untuk berinteraksi.
Apakah Largest Contentful Paint atau LCP ini penting?
Di 2021, Google akan mulai menggunakan LCP sebagai salah satu penentu faktor peringkat. LCP akan menjadi sebuah metrik penting karena bisa secara akurat mengukur seberapa cepat halaman website yang pengguna akses. Selain itu, Google menganggap kalau praktek optimasi metrik ini relatif mudah.
Bagaimana cara menghitung skor LCP?
Ada dua jenis tool yang direkomendasikan Google untuk menghitung nilai LCP. Yang pertama adalah Field Tools dan yang kedua adalah Lab Tools. Rekomendasi tool dapat kamu temukan di bagian “Tool untuk Mengukur Skor LCP” di artikel ini.
Bagaimana cara optimasi Largest Contentful Paint atau LCP?
Setidaknya ada tiga area utama yang menjadi objek optimasi LCP. Anda dapat membacanya lebih lengkap di bagian Optimasi LCP di artikel ini.