Hai bloggers.. mungkin sebagian besar dari kalian telah mengetahui, tapi tidak sedikit yang belum, khususnya yang baru bergelut di dunia ini seperti saya. Tentang apa itu? Beberapa waktu lalu saya merasa bahwa blog saya (ini) terasa sangat berat/lemot saat akan dibuka. Padahal saya menggunakan WiFi Speedy untuk koneksi internetnya (bukan modem berbentuk seperti flashdisk). Kemudian saya mencari tau di Google apa penyebabnya dan bagaimana solusinya?. Tak butuh waktu lama saya pun menemukan sebuah artikel yang membahas tentang masalah tersebut beserta solusinya.
Blog saat dibuka terasa berat/lemot dapat disebabkan oleh banyak hal, salah satunya adalah penulisan kode-kode CSS yang kurang pas (bukan salah) ---ingat, KURANG PAS.. hehe..--- sehingga perlu dilakukan perbaikan mengenai susunan penulisannya. Jika kode CSS-nya hanya terdiri dari puluhan baris kode masih dapat dilakukan pengeditan secara manual, namun bagaimana jika ratusan bahkan ribuan baris? Bisa, tetapi kurang efisien waktu.
Setelah membaca penyebabnya, kemudian saya langsung mempraktekan solusinya step by step dan ternyata berhasil. Yaaa walaupun hasilnya tidak signifikan menambah kecepatan saat membuka blog ini, namun dapat sedikit mengurangi. Perlambatan berkurang 8% dari sebelumnya 22507 bytes, setelah dikompres menjadi 20750 bytes dengan saves sebesar 1757 bytes atau 8%. Ini buktinya:
Caranya sangat mudah, perhatikan step by step ya agar hasilnya sesuai yang diinginkan. Ada 2 cara, yaitu melalui csscompressor.com dan www.cssdrive.com
Demikian ilmu yang dapat saya bagikan. Terima kasih telah membaca artikel tentang cara mengompres kode CSS agar blog tidak berat/lemot ketika dibuka ini. Semoga bermanfaat bagi kita semua. Salam....
Blog saat dibuka terasa berat/lemot dapat disebabkan oleh banyak hal, salah satunya adalah penulisan kode-kode CSS yang kurang pas (bukan salah) ---ingat, KURANG PAS.. hehe..--- sehingga perlu dilakukan perbaikan mengenai susunan penulisannya. Jika kode CSS-nya hanya terdiri dari puluhan baris kode masih dapat dilakukan pengeditan secara manual, namun bagaimana jika ratusan bahkan ribuan baris? Bisa, tetapi kurang efisien waktu.
Setelah membaca penyebabnya, kemudian saya langsung mempraktekan solusinya step by step dan ternyata berhasil. Yaaa walaupun hasilnya tidak signifikan menambah kecepatan saat membuka blog ini, namun dapat sedikit mengurangi. Perlambatan berkurang 8% dari sebelumnya 22507 bytes, setelah dikompres menjadi 20750 bytes dengan saves sebesar 1757 bytes atau 8%. Ini buktinya:
Caranya sangat mudah, perhatikan step by step ya agar hasilnya sesuai yang diinginkan. Ada 2 cara, yaitu melalui csscompressor.com dan www.cssdrive.com
Cara pertama melalui cssdrive.com
- Buka alamat cssdrive.com
- Pilih menu Tools, lalu klik CSS Compressor
- Buka blog kalian, pilih Template kemudian klik Edit HTML
- Cari kode CSS yang akan dikompres, etaknya antara </b:skin> dan ]]></b:skin>. Untuk lebih mudah dalam pencarian, tekan control/ctrl + F lalu copy paste </b:skin> atau ]]></b:skin>
- Catatan: untuk menghindari dampak buruk dari kegagalan proses ini, lebih baik kalian copy dulu kode yang akan dikompres dan disimpan di notepad (.txt) agar tetap memiliki cadangan jika terjadi error
- Pilih Normal pada Compressor mode, Don't trip any comments pada Comments handling, kemudian paste kode CSS yang akan kalian kompres pada Insert CSS code.
- Klik Compress-it!
- Setelah proses kompres selesai, dibagian bawah kalian dapat melihat perubahan yeng terjadi pada kode CSS sebelum dan sesudah dikompres, sekaligus presentase efisiensinya.
- Gantilah kode CSS pada template blog kalian sebelum dikompres dengan kode CSS yang baru saja dikompres.
- Jangan lupa untuk memastikan tidak ada kode CSS yang error, gunakan Preview template sebelum menyimpan perubahan kode CSS
- Jika semua baik, tinggal klik Save template. SELESAI
Cara kedua melalui csscompressor.com
- Buka alamat csscompressor.com
- Lakukan langkah ke-3 sampai ke-5 seperti pada cara yang pertama (menggunakan cssdrive.com)
- Paste kode CSS yang akan kalian kompres pada CSS Source Code Input:
- Pada Compression Level pilih Standard (balance between readability and size)
- Klik Compress.
- Lakukan langkah ke-9, 10 dan 11 seperti pada cara yang pertama (menggunakan cssdrive.com). SELESAI
Demikian ilmu yang dapat saya bagikan. Terima kasih telah membaca artikel tentang cara mengompres kode CSS agar blog tidak berat/lemot ketika dibuka ini. Semoga bermanfaat bagi kita semua. Salam....
No comments:
Post a Comment