Google sangat ketat dalam menentukan peringkat Situs Web. Tidak hanya mengoptimalkan SEO pada situs, tetapi juga harus mematuhi aturan waktu memuat yang ketat agar pengalaman pengguna lebih optimal.

Semuanya dimulai ketika pengunjung mengunjungi situs web mu untuk pertama kalinya. Jika situs atau blogmu lambat, pengunjung akan langsung pergi dan mencari situs web yang lebih baik, yang memuat dengan cepat dan menawarkan konten yang sama atau bahkan lebih baik.

Google tahu semua itu. Dan, itulah sebabnya mereka juga memberi peringkat situs web lebih tinggi pada blog/website yang memuat lebih cepat. Sebagai blogger atau pemilik bisnis, tugas kita adalah membuat loading situs secepat mungkin. Ada banyak cara untuk melakukannya, tetapi dalam artikel ini, saya hanya akan berfokus pada cara meminimalkan CSS, JS, dan HTML.

Situs web atau blog dibangun menggunakan banyak file di mana sebagian besar adalah HTML, CSS, dan JS. File-file ini mengandung banyak Kode yang dibuat secara otomatis atau ditulis oleh pengembang. Kode yang ditulis dalam file-file ini dapat dibaca secara manusiawi karena mereka perlu dikembangkan.

Namun, hal tadi tidak berlaku untuk mesin karena mereka dapat dengan cepat membaca kode. Singkatnya, ini berarti bahwa komputer tidak memerlukan kode yang diformat yang dapat kita gunakan untuk menghemat ruang dan membantu meningkatkan ukuran file situs web.

Sebelum memulai prosesnya, pertama-tama kita akan mempelajari apa arti sebenarnya minify dan bagaimana hal itu dapat menguntungkan waktu pemuatan situs web / blog.

Minify adalah proses dimana ruang atau karakter yang tidak perlu dihapus dari kode. Spasi dan karakter ini tidak diperlukan untuk menjalankan kode dan karenanya hanya menambah ukuran pada file. Ketika dihapus, file menjadi lebih ringan yang pada gilirannya meningkatkan waktu pemuatan halaman. Minify adalah strategi yang bagus untuk blog memuat lebih cepat dan mendapat peringkat yang lebih baik.

Ketika proses minifikasi selesai, tool minify akan menghapus hal-hal berikut dari kode blog:

Semua karakter dan komentar ini menambah lama untuk kode dibaca, karen karakter dan komentar itu hanya dimaksudkan untuk pembaca manusia. Minifikasi membantu keseluruhan data yang ditransfer, ketika situs web diminta dari server.

Bagi pengembang, akan sangat mudah untuk membedakan antara file yang diperkecil dan file yang tidak diperkecil. File yang diperkecil memiliki ekstensi .min di dalamnya. Misalnya, header.min.css

Perbedaan perbedaan dan kompresi

Kompresi tidak mirip dengan minifikasi. Kompresi adalah teknik di mana ukuran file dikurangi dengan menggunakan algoritma kompresi atau skema ushc sebagai brotli atau gzip. Keduanya memiliki tujuan mengurangi ukuran file tetapi dengan pendekatan yang berbeda.

Jadi, pada dasarnya, kamu dapat mengecilkan file dan kemudian mengompresnya sebelum mengirimkannya ke pengguna website atau blog. File yang pernah diterima dari sisi klien kemudian akan dikompresi dan kemudian digunakan untuk tujuan rendering.

Sekarang kita telah memahami apa itu minification dan perbedaannya dengan kompresi, sekarang saatnya bagi kita untuk belajar bagaimana mengecilkan CSS, JS, dan HTML.

Proses pertama sangat mudah. Yang perlu kamu lakukan adalah menghapus hal-hal yang tidak perlu dari kode website mu. Coba lihat contoh di bawah ini.

Setelah minifikasi akan terlihat seperti di bawah ini:

Sulit dibaca kan? Bagi manusia memang sulit dibaca, tapi tidak untuk komputer. Format di atas menghapus spasi kosong yang tidak perlu, ini menjadikannya lebih kecil dan karenanya mengurangi waktu pemuatan file.

Proses manual dapat dilakukan tanpa harus mengunduh aplikasi, karena kamu bisa menggunakan tools online untuk minify CSS websitemu. Berikut ini daftar situs penyedia minfy CSS online gratis:

CSSminifier.com: Alat mudah yang digunakan untuk memperkecil CSS. Yang perlu kamu lakukan adalah meng-copy kode CSS pada template blog dan mem-paste kode tadi dan mencopy hasil minify ke template blog.

phpied.com: Ini adalah alat pengembangan yang menggunakan minifikasi CSS Kompresor YUI.

Jscompress.com: Ini adalah alat minifikasi berbasis JavaScript. Alat ini memungkinkan kamu menyalin dan menempelkan kode dan mengunduh kode yang diperkecil.

yui.github.io: Alat pengembangan yang dapat digunakan selama pengembangan.

htmlcompress.com: Alat minifikasi online yang memungkinkan kamu memperkecil HTML, CSS, dan JavaScript.

HTMLMinifier: Adalah alat Pengubah / Kompresor HTML Online. Menyediakan API. Sederhana, mudah dan Cepat.