728x90 AdSpace

HEADLINE NEWS

11 Agustus 2010

Loading page lambat merupakan salah satu masalah yang membuat pengunjung blog merasa tidak nyaman mengunjungi blog kita. kenyamanan pengunjung saat membuka blog kita perlu diprioritaskan pula. banyak hal yang membuat/menjadi penyebab loading page blog kita lambat, diantaranya adalah penggunaan javascript, html dan image yang cukup memakan banyak bandwidth, hal itu justru akan membuat loading blog semakin lambat/berat. bahkan ada satu hal yang membuat pengunjung malas berkunjung, yaitu banyaknya popups yang muncul ketika blog kita dibuka. ketika saya blogwalking, banyak blog yang menggunakan sidebar sebelah kanan dan mengutamakan kolom posting sebelah kiri, kenapa? karena jika sobat banyak menggunakan kode HTML atau javascript dan diletakkan di sidebar sebelah kiri, itu akan membuat loading blog terasa berat, itu disebabkan karena browser selalu membaca blog yang selalu berurutan dari kiri atas sampai kiri bawah, kemudian akan berlanjut ke bagian kanan atas sampai kanan bawah, dan bagian footer atau bawah blog tentunya yang akan kebagian yang akan terbaca paling akhir. dan untuk mengatasi permasalahan tersebut disarankan untuk menggunakan template dengan kolom postingan yang terletak di sebelah kiri, atau jika sobat menggunakan sidebar di sebelah kiri, usahakan jangan terlalu banyak memakai kode HTML atau Javascript di sebelah kiri karena akan membuat loading blog jadi sangat berat. untuk mengetahui lebih spesifik lagi apa saja yang membuat loading page blogmu lambat, bisa dibaca pada Kenapa Loading Page Blogmu Lambat?
dan selain hal diatas yang saya paparkan, yang utama adalah css yang ada dalam template kita, bagaimana cara kita agar css yang ada dalam blog kita se-ringan mungkin agar loading blog tidak lola alias loading lama.
perhatikan contoh css dibawah ini :
a:link {
    color:#006699;  text-decoration:none;
    }

    a:visited {
    color:#006699;  text-decoration:none;
    }

    a:hover {
    color:#006699;  text-decoration:underline;
    }

    #main .post-body a:link {
    color:#006699;  text-decoration:underline;
    }

    #main .post-body a:visited {
    color:#006699;  text-decoration:underline;
    }

    #main .post-body a:hover {
    color:#006699;  text-decoration:none;
    }
Kode css diatas adalah kode standard yang biasa sobat jumpai di HTML template, jika saya compress secara manual maka hasilnya akan seperti dibawah ini :
a:link,a:visited,#main .post-body a:hover {
    color:#006699;
    text-decoration:none
    }

    a:hover,#main .post-body a:link,#main .post-body a:visited {
    color:#006699;
    text-decoration:underline
    }
apa yang membedakan kedua bagian diatas ? jika sobat cermat melihat seluruh kode css yang paling atas [sebelum saya compress] bahwa semua bagian dalam kurung {....} yang membedakan hanya dua bagian yaitu pada penulisan text-decoration:none dan text-decoration:underline. Pemakaian spasi juga sangat berpengaruh dalam penulisan css, jika saya rapatkan maka hasilnya menjadi seperti berikut ini :
a:link,a:visited,#main .post-body a:hover{color:#006699;text-decoration:none}
a:hover,#main .post-body a:link,#main .post-body a:visited{color:#006699;text-decoration:underline}
Untuk kompressi kode css pada template atau compress CSS template sobat tidak perlu susah payah mengcompress-nya secara manual lagi :D, karena sekarang sudah banyak tools gratisan yang menyediakan fasilitas Compress css, salah satu yang sering digunakan adalah  situs http://www.csscompressor.com
  1. Untuk mengcompress css-nya silahkan kunjungi situs http://www.csscompressor.com
  2. Kemudian pada halaman depan, ada pilihan jenis compress kemudian masukkan kode css milik sobat kedalam kotak kosong yang tersedia lalu klik compress. 
  3. Maka akan terlihat hasil compress dibawahnya, seperti pada gambar berikut 
  4. Kemudian klik Select All dan copy semua kode yang sudah di compress tadi.   
 Semoga Bermanfaat

Asrizal Wahdan Wilsa

Memulai Blogging sejak tahun 2009 hingga sekarang. Aktif di bidang musik yang dinaungi salah satu label musik di Kota Bandung. Saat ini fokus melanjutkan kuliah ke jenjang S2 di Universitas Negeri Semarang (UNNES). Website: Sharing Media - Info Tips dan Trik Terbaru

  • Blogger Comments
  • Facebook Comments

17 komentar:

  1. patut dicoba nih... makasih infonya...

    BalasHapus
  2. akhirnya yang di tunggu2 nongol, thanks sob

    BalasHapus
  3. Kayaknya saya mesti Compreess template blog saya, soalnya loadnya berat banget,,,,

    BalasHapus
  4. Triknya bagus Sob, bisa dipeljari nih..
    thanks yah..

    met puasa yah sob. :-)

    BalasHapus
  5. wkowkowkowkw mantabs sob tp ane dah pake css sob ... web host kan pake itu :)

    BalasHapus
  6. memang banyak blog yang berat saat dikunjungi, kadang kita berpikir koneksi yang lambat. setelah dapat info ini menambah pengetahuan saya. terima kasih

    BalasHapus
  7. Mantap Gan ane juga udah pake CSS Compresor neh :j:

    BalasHapus
  8. kunjungan balik sekaligus coment nih gan..hehehe...
    wah good info lah..wah ngomong2 blog q loadingnya ringan ato lama za,, kayaknya berat blog q gak nyampe 100 kb dah..brarti masih terbilang ringan ..hehehe..

    BalasHapus
  9. wih .. ilmunya tak serap ya boss...

    BalasHapus
  10. Terima kasih atas pencerahannya sobat! :n:

    BalasHapus
  11. mantab infonya sobat..ke tkp dulu ah

    BalasHapus
  12. nyerap ilmu disini sambil sahur Gan :p:

    BalasHapus
  13. Komentar ini telah dihapus oleh administrator blog.

    BalasHapus
  14. saya sudah compress sob memang berpengaruh walau tidak terlalu banyak ...

    BalasHapus
  15. Wahhh sip nich CSS buat aq yg lum ngerti

    BalasHapus
  16. wah saya tidak mengira kalau spasi di kode CSS bikin beban website bertambah . . . thanks artikelnya sob :D

    BalasHapus
  17. kunjungan siang..ane coba ya gan :e:
    semoga berhasil :b:

    BalasHapus

Berkomentarlah dengan bijak, relevan dengan artikel, komentar spam dan promosi akan kami hapus, terimakasih.

Kami akan menjawab komentar anda secepat mungkin, opsi lain silakan berkomentar di halaman facebook/melalui twitter kami.

Item Reviewed: Meringankan Template Dengan CSS Compressor Description: Rating: 5 Reviewed By: Asrizal Wahdan Wilsa
Scroll to Top