3 Langkah Mudah Meningkatkan Kecepatan Website

Beberapa waktu lalu teman saya bertanya bagaimana cara Meningkatkan Kecepatan Website. Apakah perlu mempekerjakan orang secara Khusus? berdasarkan pengalaman saya pribadi saya menyarankan 3 langkah mudah.

Jadi hari ini, saya akan menunjukkan kepada Anda cara mempercepat situs WordPress Anda dengan tiga langkah sederhana,

agar dapat mengetahui kecepatan loading website anda dengan Cek Kecepatan website di pagespeed insight atau juga di GTmetrix.com atau juga di pingdom.com jika rendah ubbah kecepatan situs Anda. dari sesuatu seperti ini,

Kecepatan Website

menjadi ini.

sitename

Google telah menggunakan kecepatan situs sebagai sinyal peringkat untuk pencarian desktop sejak 2010.

Dan pada 2018, kecepatan halaman juga menjadi faktor peringkat untuk pencarian seluler.

Dan meskipun peningkatan kecepatan hanya akan memengaruhi sebagian kecil situs web yang lambat,

waktu muat halaman yang lebih cepat menghasilkan pengalaman pengguna yang lebih baik dan pada kebanyakan website monetisasi akhirnya, lebih banyak pendapatan.

Faktanya, sebuah studi oleh Google menunjukkan bahwa saat waktu buka halaman meningkat, rasio pentalan atau bounce rate juga meningkat.

Kenapa Website saya Loading Lambat?

Sekarang, ada banyak alasan mengapa situs web Anda mungkin dimuat dengan lambat. Tetapi alasan paling umum yang saya lihat adalah karena konektivitas yang lambat, cache, ukuran halaman,

dan terkadang alasan yang lebih teknis seperti JS yang memblokir perenderan.

Bagaimana jika anda bukanlah orang yang benar-benar paham hal teknis ini? tiga langkah yang akan saya tunjukkan akan membantu Anda mendapatkan kinerja yang lebih baik dari situs Anda.

Sekarang, sebelum kita mulai, penting untuk diperhatikan hal-hal yang saya lakukan untuk situs ini

belum tentu diterjemahkan dengan sempurna ke situs Anda.

Ada banyak hal yang perlu dipertimbangkan terkait kecepatan situs WordPress seperti Anda

kode tema, plugin wordpress spesifik yang mungkin Anda gunakan, konfigurasi server, ukuran file gambar, dan lainnya.

3 Langkah Mudah Meningkatkan Kecepatan Website

Jadi saat kita menjalani tutorial, saya akan mencoba menjelaskan alasan yang lebih teknis di baliknya performa buruk, jadi semoga Anda dapat mendiagnosis masalah lebih lanjut sendiri.

Panduan ini berdasarkan pada penyelesaian masalah loading website pada blog saya sendiri ini. Jadi benar-benar di terapkan pada blog ini. tidak hanya sekedar studi kasus.

pada gambar diatas adalah data blog ini mengalami loading yang sangat lambat, di lakukan pengetesan pada 2 website yang memiliki tools khusus menganalisa website atau blog anda.

PageSpeed ​​Insights menunjukkan skor seluler 41 dan skor desktop 46.

cek kecepatan website

Dan GTMetrix, dimuat penuh dalam 9 detik dengan ukuran halaman 1,05 megabyte dan 103 permintaan. sangat-sangat lambat

sitename

#1 Langkah Pertama

pertama yang kami lakukan dalam meningkatkan kecepatan website adalah mengalihkan penyedia DNS ke layanan DNS gratis Cloudflare. Untuk memahami mengapa kami menggunakan Cloudflare, Anda perlu memahami cara kerja web,

setidaknya di tingkat dasar.Situs web hanyalah file di komputer yang dapat diakses melalui Internet.Setiap perangkat yang terhubung ke Internet memiliki alamat IP, termasuk servernya menghosting situs web Anda.

Jadi jika server Anda berlokasi di US, Singapore atau Jakarta dan pengunjung Anda berada di Surabaya kedua alamat IP ini perlu membuat sambungan untuk mengunduh konten file ke perangkat.

Sekarang, alamat IP sulit untuk dihafal, karena berupa ngka-angka dan saya ragu banyak orang akan memasukkan alamat.

Baca Juga  Pekerja IT : Jenis, kesulitan dan besaran Gajinya

Di situlah DNS berperan. DNS adalah singkatan dari Domain Name System. Dan ini sering disebut sebagai “buku telepon dunia web”.Singkatnya, DNS memetakan nama domain ke alamat IP sehingga orang dapat mengetik di domain nama untuk mengunjungi situs web.

Tapi masalahnya adalah ketika seseorang mengetik nama domain di browser mereka, pencarian DNS terjadi untuk menemukan alamat IP server. Jadi itu butuh waktu.

Dan biasanya, penyedia DNS gratis dari pencatatan domain Anda biasanya lambat merespons, membuat waktu muat halaman lebih lambat. DNS Cloudflare di sisi lain sangat cepat, mengingat ini gratis. Tetapi sekali lagi, jarak tempuh Anda mungkin berbeda tergantung pada penyedia DNS, yang Anda gunakan saat ini.

Jadi untuk mengatur ini, daftar ke akun Cloudflare dan kemudian klik Tambahkan situs.

Masukkan nama domain Anda, pilih dan konfirmasi paket Anda, dan setelah beberapa detik, Cloudflare akan memberi Anda kesempatan untuk meninjau catatan DNS Anda.

Klik Lanjutkan dan Anda akan diminta untuk mengubah server nama Anda, yang akan Anda lakukan perlu dilakukan dengan pencatatan domain Anda.

Boom! Langkah pertama selesai.

#2 Langkah Kedua

Hal berikutnya yang kami lakukan adalah membeli dan menginstal plugin WP Rocket.

WP Rocket adalah plugin pengoptimalan kecepatan situs all-in-one untuk WordPress.

sitename

Plugin ini dibuatnya sangat sederhana untuk membuat pengoptimalan teknis bahkan jika Anda punya dan tidak tahu apa yang Anda lakukan.

Plugin menangani pengoptimalan kecepatan halaman umum seperti caching, Preloading, kompresi, dan lazy Load. Kita akan bedah 4 menu penting di plugin ini

wp rocket

Berikut Panduan Cara Setting WP Rocket ini

Setelah mengaktifkan plugin, Anda dapat mengakses pengaturan WP Rocket dari bilah navigasi atas.

Baiklah, mari kita bahas beberapa pengaturan penting yang dimulai dengan cache.

sitename

Jika Anda tidak terbiasa dengan cache, pada dasarnya ini adalah cara untuk menyimpan salinan file sementara, sehingga dapat dikirimkan kepada pengunjung dengan cara yang lebih efisien. Dan karena situs ini adalah blog dasar yang responsif, saya mengaktifkan caching untuk perangkat seluler.

Berikutnya adalah pengoptimalan file, di mana Anda akan menghabiskan sebagian besar waktu kita.

sitename

Untuk Pengaturan Dasar, saya memilih untuk mengecilkan HTML dan mengoptimalkan Google Fonts. Minifikasi hanya menghapus spasi dan komentar dari kode, yang akan mengurangi ukuran file.Dan file yang lebih kecil dimuat lebih cepat daripada yang lebih besar.Saya juga memilih untuk mengoptimalkan Google Font.

Bagian selanjutnya adalah tentang mengoptimalkan file CSS. Sekali lagi, saya mengecilkan file CSS dan juga memilih untuk menggabungkannya.Anda sudah memahami manfaat minifikasi, jadi mari kita sentuh menggabungkan file.

Situs WordPress sering kali menyertakan banyak file CSS. Beberapa akan untuk tema, yang lain untuk plugin, dan Anda mungkin telah menambahkan beberapa yang khusus juga. Sekarang, apakah Anda memilih untuk mengaktifkan opsi ini atau tidak akan sangat tergantung pada bagaimana server Anda mengirimkan file.

Secara umum, file Anda akan dimuat menggunakan HTTP 1.1 atau HTTP 2.

Dengan 1.1, file Anda akan dimuat secara berurutan, artinya, satu file harus dimuat sepenuhnya sebelumnya yang berikutnya mulai memuat. Jadi menggabungkan skrip CSS Anda dapat membantu mengurangi waktu muat karena lebih sedikit file CSS yang dibutuhkan untuk dimuat.

Sekarang, dengan HTTP 2, file dapat dimuat secara bersamaan.

Baca Juga  101 Web : Panduan Lengkap Cara membuat Blog dan Web Company Profile

Artinya, jika Anda memiliki banyak file CSS, file tersebut dapat mulai memuat pada saat yang bersamaan, jadi menggabungkannya belum tentu berdampak besar. Untuk melihat apakah situs Anda menggunakan HTTP 2, Anda dapat menggunakan penguji Key CDN dan memasukkan URL Anda.

Opsi terakhir yang kami aktifkan adalah mengoptimalkan pengiriman CSS.

Pada dasarnya, opsi ini akan menghasilkan CSS yang dibutuhkan untuk konten paro atas dan secara asinkron memuat file CSS lain agar tidak memblokir proses rendering. Sekarang, konsep ini bisa jadi sangat teknis jadi saya tidak akan memperluasnya tapi secara umum,

ini adalah praktik terbaik pengoptimalan kecepatan halaman. Kita gulir ke bawah ke bagian file JavaScript.

Jadi pertama, saya menghapus jQuery Migrate, yang merupakan file yang telah ditambahkan ke WordPress sejak versi 3.6. Karena tidak ada masalah dengan jQuery untuk tema ini atau plugin apa pun, saya memilih untuk menonaktifkannya

karena tidak ada gunanya memuat skrip tambahan tanpa tujuan.Sekali lagi, kami memilih untuk mengecilkan file JS seperti yang kami lakukan dengan HTML dan CSS dan menggabungkan file JS kami karena tidak ada konflik atau masalah.

Dan opsi terakhir yang kami aktifkan adalah menunda pemuatan JavaScript.

Opsi ini pada dasarnya akan menunda pemuatan file JavaScript jadi yang terpenting konten seperti HTML dan CSS Anda dapat dikirim ke pengunjung Anda terlebih dahulu.

Dan kemudian JS akan dimuat. Dan ini dalam banyak kasus, memperbaiki masalah “menghilangkan JS yang memblokir render” yang mungkin Anda miliki

terlihat di PageSpeed ​​Insights.

Penting untuk diperhatikan bahwa jika Anda memilih untuk mengecilkan, menggabungkan, dan / atau menunda JavaScript Anda file, hal-hal dapat rusak di situs Anda.

Jadi, penting untuk benar-benar menguji fungsi situs Anda sebelum membiarkannya aktif secara permanen.

Kita lanjutkan ke kategori Media.

Di sini, saya memilih untuk memuat semua file media secara lambat.

LazyLoad meningkatkan kecepatan halaman karena menunda pemuatan gambar dan video hingga selesai

sitename

terlihat di layar. Faktanya, WordPress 5.5 akan memuat gambar secara lambat secara default, jadi Anda tidak perlu sebuah plugin jika Anda hanya menginginkan fitur ini.

Selanjutnya adalah Preloading. Preloading memungkinkan Anda untuk menentukan sumber daya penting sehingga browser mengetahui prioritasnya file yang harus dimuat terlebih dahulu. Misalnya, kode HTML . file JavaScript perlu dimuat terlebih dahulu karena hierarki.

Tentu saja, Anda dapat mengedit kodenya, tetapi itu bisa menjadi berantakan dan membingungkan jika Anda tidak punya pengetahuan pengkodean.

Tetapi jika kita menambahkan tag link lain untuk melakukan pramuat stylesheet, dan ini akan memberi tahu browser untuk memuat file CSS dengan prioritas yang lebih tinggi daripada file JS.

Dan itulah yang dilakukan opsi di WP Rocket ini untuk Anda. untuk meningkatkan kecepatan website

Sekarang, hal terakhir yang ingin saya bicarakan di sini adalah menggunakan CDN. Dan paling mudah untuk memahami cara kerjanya jika kita melihat contoh pertama tentang bagaimana perangkat terhubung ke server web.

Jadi sekali lagi, jika server ada di LA dan pengunjung ada di Las Vegas, mungkin tidak akan memakan waktu lama

lama bagi kedua perangkat untuk terhubung, karena jaraknya relatif dekat. Tetapi apa yang terjadi ketika seseorang dari Jerman, India, Australia atau Singapura mencoba untuk terhubung server web?

Ini akan memakan waktu lebih lama. Dan di situlah CDN dapat membantu.

Baca Juga  Investasi Web Hosting Terbaik Di Indonesia Layak Anda Lakukan

CDN adalah singkatan dari Content Delivery Network. Dan itulah tepatnya. Jaringan server yang terletak di seluruh dunia yang mengirimkan konten kepada pengunjung sebagai secepat mungkin. Dengan menggunakan CDN, pada dasarnya Anda menyimpan file di beberapa server secara global.

Lalu ketika pengunjung mencoba mengakses situs Anda, itu akan menghubungkan mereka ke situs terdekat, membuat koneksi yang lebih cepat antara pengguna dan konten.Jadi, jika situs Anda menarik audiens global, mungkin ada baiknya mendaftar ke layanan CDN,

mengaktifkan opsi di WP Rocket, dan menambahkan CNAME yang sesuai. Sekarang, ada plugin caching gratis lainnya yang memiliki banyak fitur seperti Autoptimize dan W3 Total Cache, tetapi saya pribadi lebih suka membayar sedikit biaya untuk WP Rocket

Tertarik Membeli Plugin WP rocket Klik gambar Berikut

sitename

#3 Langkah Ketiga

Dan langkah terakhir dalam tutorial kecepatan website pengoptimalan kecepatan situs ini adalah mengoptimalkan gambar Anda. Sekarang, karena kita telah menambahkan LazyLoad ke gambar, ini akan menyelesaikan banyak masalah.

Tetapi jika Anda menggunakan gambar unggulan yang berada di paruh atas saat dimuat, maka lazyload tidak akan membantu. Plus, gambar yang lebih kecil akan menghemat ruang penyimpanan.

Jadi solusi sederhananya adalah mengompres gambar Anda menggunakan kompresi lossy atau lossless. Dan ada beberapa plugin hebat yang akan melakukan ini untuk Anda seperti ShortPixel dan Imagify.

ShortPixel dapat mengurangi ukuran gambar cukup banyak, yang akan membantu

meningkatkan kecepatan halaman. ShortPixel juga memiliki fitur yang memungkinkan Anda menyajikan gambar dalam format WebP, yaitu pada dasarnya memungkinkan Anda memampatkan gambar lebih jauh tanpa mengurangi kualitas.

Buka saja Pengaturan dan pilih ShortPixel. Kemudian klik pada tab Advanced. Dari sini, Anda pasti ingin memastikan bahwa Anda telah mencentang kotak ini sehingga ShortPixel membuat WebP versi gambar Anda.

sitename

Sekarang setelah kami melakukan tiga pengoptimalan utama untuk kecepatan situs WordPress, mari kita jalankan alat PageSpeed ​​dan bandingkan dengan tolok ukur asli kita.

Pada wawasan PageSpeed, laman tersebut sebelumnya mendapat skor 41 pada perangkat seluler dan sekarang memiliki skor 94.

Itu memiliki skor desktop 46 dan sekarang memiliki skor desktop 86

sitename
sitename

Dan Anda akan melihat pola yang sama untuk GTMetrix dan peningkatan secara menyeluruh.

Dengan cek kecepatan website baru, Anda akan melihat ada penurunan yang signifikan pada ketiga metrik tersebut.

Tapi ingat, setiap konfigurasi WordPress akan berbeda karena Anda mungkin menggunakannya

tema yang lebih kikuk, lebih banyak plugin yang menghabiskan sumber daya, memiliki hosting yang lebih rendah, atau yang Anda miliki banyak sekali skrip pelacakan pihak ketiga. Jadi, jika Anda masih tidak puas dengan kecepatan situs Anda setelah melakukan pengoptimalan ini,

maka Anda mungkin membutuhkan lebih banyak pekerjaan kustom untuk Anda.

Jadi, Anda mungkin ingin mempertimbangkan untuk menghapus plugin dan skrip, mengganti tema,atau menyewa pengembang untuk melakukan perbaikan yang sesuai.

Jadi cobalah dan jika Anda menikmati tutorial ini, maka pastikan untuk menyukainya

Sampai jumpa di tutorial berikutnya.

Leave a Reply

Your email address will not be published. Required fields are marked *