Sabtu, 31 Desember 2011

Kompres kode CSS untuk mempercepat loading blog

Siapa yang tidak mau blognya mempunyai loading yang cepat, hargi 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 area-tik-tok 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 area-tik-tok 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 area-tik-tok
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>
  • buka situs CSS compressor disini
  • kemudian setting pengaturannya seperti berikut:
    ¬- 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>
  • 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 Lemot, hehehe
cara kompres kode CSS untuk meningkatkan kecepatan loading blog 

2. Kompres kode CSS melalui trik area-tik-tok

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 area-tik-tok 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. cara kompres kode CSS untuk meningkatkan kecepatan loading blog bingung kan dg trik yang kedua ini. Habis bingung menyusun kata-katanya dan emang sengaja di bikin bingung cara kompres kode CSS untuk meningkatkan kecepatan loading blog 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'
  • kemudian tempatkan hasil kompresannya diantara kode
    <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>
  • buka halaman berikut dan kompres kode tersebut disini namanya HTML OPTIMIZER
  • copy dan pastekan kode hasil kompresan tadi diantara kode
    <body> dan </body>
  • terakhir klik SIMPAN
Sekarang bandingkan dengan loading blog sebelum di kompres dengan trik yang pertama dan dengan trik yang kedua, lebih cepat mana? Silahkan dan tentukan pilihan mana yang kamu suka. Selamat Mencoba . . . . .

Tidak ada komentar: