Mempercepat Loading Blog dengan Compress kode CSS, siapa yang tidak mau blognya mempunyai loading yang cepat, hari gini geto lho banyak persaingan antara 1 blogger dengan blogger lainnya yang rebutan traffic. Ya salah satunya meningkatkan kecepatan loading blog ,karena para pengunjung paling males jika menemui blog yang loadingnya minta ampun beratnya dan jangan berharap para pengunjung akan kembali lagi ke blog kamu. Walaupun posisi blog kamu pada hasil pencarian sering masuk 10 besar namun dengan melihat alamat blog kamu pengunjung tidak akan meng-klik di hasil pencarian untuk mengunjungi blog kamu, ih . . . Gak mau deh kalo geto, amit-amit.
Untuk mengatasi hal tersebut saya mempunyai trik untuk masalah kecepatan loading blog yakni dengan meng-kompres kode CSS pada template blogspot. Mungkin sudah banyak tutorial tentang cara mengkompres kode CSS namun pada kesempatan ini saya akan berbagi trik yang berbeda tentang kompres-kompresan kode CSS, walaupun tidak jauh-jauh amat dari kebanyakan tutorial yg bertebaran.
Ada dua cara tentang meng-kompres kode css:1. Kompres kode CSS pada umumnya.
2. Kompres kode CSS melalui trik saya
Mari kita bahas satu-persatu.
1. KOMPRES KODE CSS PADA UMUMNYA
Untuk trik yang pertama ini adalah trik yang pada umumnya para blogger lakukan.
· pertama cek dulu kecepatan loading blog kamu untuk membandingkan.
· login ke dashbord blog kamu.
· pilih Rancangan »» Edit HTML
· download template lengkap dulu barangkali terjadi kesalahan (wajib / harus)
· Kemudian blok dan POTONG semua kode CSS dari setelah kode <b:skin><![CDATA[ sampai pada kode sebelum ]]></b:skin>
Kalau kurang jelas begini, potong kode mulai dari
<b:skin><![CDATA[ disini mulainya | . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . KODE-KODE CSS. . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . .
sampai disini |
]]></b:skin>
Kalau kurang jelas begini, potong kode mulai dari
<b:skin><![CDATA[ disini mulainya | . . . . . . . . . . . . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . KODE-KODE CSS. . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . .
sampai disini |
]]></b:skin>
· buka situs CSS compressor disini
· kemudian setting pengaturannya seperti berikut:
¬- Compression mode = pilih 'Normal'
¬- Comment handling = pilih 'Don't strip any comments'
¬- Compression mode = pilih 'Normal'
¬- Comment handling = pilih 'Don't strip any comments'
· pastekan kode CSS yang telah di potong tadi pada kotak kosong.
· kemudian klik Compress-It
· kemudian copy hasil kompresan tadi dan tempatkan pada template kamu diantara kode
<b:skin><![CDATA[
Pastekan disini kode CSS yang telah di kompres tadi
]]></b:skin>
<b:skin><![CDATA[
Pastekan disini kode CSS yang telah di kompres tadi
]]></b:skin>
· terakhir klik SIMPAN
Sekarang bandingkan dengan loading blog kamu sebelum di kompres, awak yakin pasti lebih cepat, kalau lebih lambat loadingnya berarti emang koneksi internet kamu yang LOL >.<
2. KOMPRES KODE CSS MELALUI TRIK SAYA
Untuk trik yang kedua ini tidak jauh berbeda dengan trik yang pertama hanya saja pada saat meng-kompres kode css pengaturannya di bedakan. Dan trik saya ini agak ribet dan rumit, ini hanya di khususkan untuk kalangan blogger dengan tingkat level menengah keatas, namun jika para newbie yang mau pake trik juga boleh. Syarat utama untuk memakai trik yang kedua ini adalah pastikan kamu tidak akan merubah tampilan layout blog kamu baik dari CSS sendiri maupun dari kode HTML. Atau syarat lainnya adalah menyimpan template kamu yang terakhir jika sewaktu-waktu kamu ingin menambahkan menu atau merubah layout blog, setelah ditambah atau di perbaiki, ulangi pengompresan seperti trik yang kedua ini. bingung kan dengan trik yang kedua ini. Habis bingung menyusun kata-katanya dan emang sengaja di bikin bingung Jika siap bingung lets do it.
Seperti cara diatas yakni memotong kode CSS diantara kode <b:skin><![CDATA[ dan kode ]]></b:skin> Dan pastikan kamu telah menandai kotak kecil pada Expand Widget Template.
· masuk ke situs CSS compressor disini
· setting pengaturannya seperti berikut:
¬- compression mode = pilih 'Super Compact'
¬- comment handling = pilih 'Strip all any comments'
¬- compression mode = pilih 'Super Compact'
¬- comment handling = pilih 'Strip all any comments'
· kemudian tempatkan hasil kompresannya diantara kode
<b:skin><![CDATA[
Pastekan disini kode CSS yang telah di kompres tadi
]]></b:skin>
<b:skin><![CDATA[
Pastekan disini kode CSS yang telah di kompres tadi
]]></b:skin>
· kemudian potong kembali pada kode diantara kode
<body>
Bla. . . . .bla. . . . .bla. . . . . Bla . . . . .
</body>
<body>
Bla. . . . .bla. . . . .bla. . . . . Bla . . . . .
</body>
· buka halaman berikut dan kompres kode tersebut disini namanya HTML OPTIMIZER
· copy dan pastekan kode hasil kompresan tadi diantara kode
<body> dan </body>
<body> dan </body>
· terakhir klik SIMPAN
Sekarang bandingkan dengan loading blog sebelum di kompres dengantrik yang pertama dan dengan trik yang kedua, lebih cepat mana? Silahkan dan tentukan pilihan mana yang kamu suka. Selamat berexperimen.
Pusing-pusing dah loe :D
gx ngerti mbaknya..
ReplyDeletebingung. crany :(
pengen, tapi binguuung -___-
ReplyDeletebantuin huuu :(