Cara Mempercepat Loading Blog
Cara Mempercepat Loading Blog - Salah satu tips jitu yang bisa kita
terapkan untuk mempercepat loading blog
adalah dengan cara compress kode CSS dan
javascript yang ada pada template. Biasanya pengunjung akan langsung
mengeluarkan jurus GPL (Gak Pake Lama)
apabila menemukan blog yang loadingnya berat alias lelet dan mereka akan
langsung menutup halaman blog yang tadinya mau dibuka. Nah supaya blog kita
juga jangan sampai kena jurus GPL tadi, tidak ada salahnya kita antisipasi
dengan cara meningkatkan speed blog
kita melalui beberapa cara seperti mengkompresi
CSS dan javascript atau kompresi pada image/gambar untuk mempercepat loading blog anda.
Cara Mengkompresi Kode CSS dan JavaScript pada Template :
Untuk melakukan kompresi CSS dan javascript, sobat
dapat menggunakan tools CSS Compressor
yang bisa dicari di Google atau kompresi secara online melalui Online
YUI Compressor. Saya sarankan sobat menggunakan situs online ini karena
lebih gampang dan cepat. Tinggal copy CSS atau javascript yang mau dikompresi
dari template, kemudian pilih CS jika ingin melakukan compress CSS dan pilih JS
jika yang ingin dikompresi adalah javascript. Kemudian kode CSS atau javascript yang sudah dikompresi kita copy dan paste-kan kembali pada tempatnya semula dalam template. Berdasarkan pengalaman saya,
kesulitan yang sering dialami blogger adalah bagaimana membedakan mana yang CSS dan mana
yang javascript.
·
Ciri kode CSS pada template yaitu yang berada
diantara kode <b:skin><![CDATA[/* sampai dengan kode ]]></b:skin>.
Contoh yang kode CSS itu yang seperti ini nih..
.post-body {font-family:'Calibri', Segoe UI, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, sans-serif;font-size:15px;line-height:1.4em;margin:0 0 0.75em;}.post-footer {border-bottom:2px dotted #dddddd;color:#999999;font-style:normal;letter-spacing:0;margin:0.3em 0;padding:2px;text-transform:none;}
·
Ciri kode JavaScript pada template yaitu yang
berada diantara kode (diapit oleh 2 kode) <script
type='text/javascript'> dengan kode </script>. Atau bisa juga yang diantara
kode <script type='text/javascript'>
//<![CDATA[ dengan kode //]]> </script>. Contoh
javascript itu yang seperti ini mas bro..
<script type='text/javascript'>//<![CDATA[function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+" [...]"}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};//]]></script>
Cara Mengkompresi
Image atau Gambar :
Untuk kompresi image atau gambar, biasanya saya juga
melakukannya secara online di Free Image Optimizer.
Kalo mau pake tools lain, sobat bisa cari tools seperti JPEG Compressor di Google. Kompresi
image di layanan Free Image Optimizer ini mampu mengurangi ukuran (size)
gambar dalam kilobyte hingga 50% lebih tanpa mengurangi kualitas dari gambar tersebut.
Contoh hasil kompresinya seperti gambar dibawah ini.
Sebelum >> 26 Kb |
Sesudah >> 4 Kb |
Well, capek juga nulis artikel puanjang banget nih !
Sekarang coba sobat terapkan cara mempercepat loading blog yang sudah
saya jelaskan tadi. Untuk mengetahui berapa kecepatan loading blog anda sebelum
mengkompresi CSS, javascript dan image, cobalah pantau blog sobat melalui link http://gtmetrix.com ini. Saya sering
memeriksakan “kondisi kesehatan” blog saya melalui gtmetrix ini karena banyak parameter yang bisa kita pantau. Dan
sesudah mengkompresi, cobalah cek kembali berapa waktu loading blog sobat. Jika speednya menjadi lebih cepat,
berarti anda telah berhasil meningkatkan speed blog anda. Good luck buddy…!
Terima kasih mas rayhan..tutorialnya sangat saya perlukan untuk diterapkan di blog saya yang blogspot.
BalasHapuspertanyaan saya, bagaimana caranya jika kita ingin menerapkannya di blog wordpress dengan hosting sendiri?
makasih
thanks mas..tips yang sangat bermanfaat nih :D
BalasHapus@Vira
BalasHapusWow I'm surprised with ur blog ! Good job Vira suka blog kamu dan sharingnya.
@dentaq
Kompresi di blog WP plus minusnya sama aja mas bro. Dalam template WP kan juga ada CSS dan javascriptnya toh..?!
@dani nurhadi
Sama2 sobat.. :p
kalo codenya dicompress templatenya ada yang berubah gitu ngga?
BalasHapusTerima kasih atas informasinya, sekarang blog saya lebih ringan dari biasanya.
BalasHapuskarena semua artikel saya menggunakan gambar animasi sehingga loading jadi lambat, syukurlah ada tips mantap ini,sekali lagi terimakasih
Artikel yang sangat bermanfaat, Terima kasih.
BalasHapusmantap gan... walaupun agak ribet buat aku pemula
BalasHapussalam
http://gubukpantun.blogspot.com/
saya coba terapkan dlu gan........
BalasHapusMantap sekali infonya gan,,,
BalasHapusMakasih banyak,,,
N salam knal...
ijin comot gan.
BalasHapusmak nyuzzz...perlu di jajal ah
BalasHapusnice info gan, patutu dicoba
BalasHapusmempercepat loading blog..keren banget sob..bermanfaat sekali buat seo..loading cepat search engine senang :)punyaku lambat banget :(
BalasHapuswah terimakasih sob.. sangat membantu sekali buat tugas anne
BalasHapusMakasih mas, akhirnya ketemu jga tools buat kompres css dan javascript..
BalasHapusmakasih banyak sob, ahirnya ane bisa. nih sob sekalian mintak saran blog ane ya pliss... http://kataterbaru.blogspot.com/
BalasHapuspurwa-sedana.blogspot.com ..
BalasHapusgmna cara kerjanya ?
follow this blog
BalasHapushttp://riezcomp.blogspot.com
Akan langsung kupraktekan
BalasHapuswow... mantap gan... masih bisa diatur... nice tipsnya...
BalasHapusinfonya sngat brmanfaat... thanks ya
BalasHapusoia,, mw nanya ne cara bwt change favicon thu gimana ya.. sperti yg diujung atas thu..
Terima kasih Mas atas ilmunya. Sangat bermanfaat!
BalasHapusWah bgus, patut dicoba nih...
BalasHapussudah saya coba,tks u berhasil
BalasHapusmantap gan tipsnya
BalasHapustollong follback blog saya
Info yang menarik biar kucoba sekarang,.,.,., terimakasih
BalasHapusKeren bang...lanjutkan
BalasHapusalow lam kenal , sangat bagus infonya dan bermanfaat sekali ..
BalasHapusdi tunggu kunjungan anda di sini
salam sukses...
informasi yang menarik sob..terimakasih
BalasHapusartikelnya bagus dan bermanfaat sekali..
BalasHapusizin menerapkan ya..thanks sharenya