Anda pasti sudah seringkan keluar-masuk situs atau blog orang lain, atau anda juga sedang mengelola sebuah blog. Dimana biasanya pada saat kita sedang mengunjungi sebuah situs dan ketika halaman yang kita inginkan mungkin sedikit lebih lama baru terbuka sehingga kadang kita lebih memilih untuk meninggalkan blogtersebut dan mencari apa yang kita cari di blog atau situs lain.
Nah kecepatan sebuah blog juga sangat mempengaruhi, banyak atau sedikitnya pengunjung blog tersebut. Oleh karena itu, agar pengunjung blog anda tidak pergi hanya karena loading halaman blog anda agak sedit lambat, maka saya menemukan sebuah situs yang sangat berguna bagi anda.
Bukan hanya CSS yang dapat mereka kompress, tetapi Javascript dan HTML juga dapat mereka kompres. Sehingga apabila kita telah mengompress CSS& Javascript pada template kita, sehingga loading halaman kita akan jauh lebih cepat dibanding sebelumnya.
Berikut situs yang saya maksud Htmlcompressor. Pada situs ini kita diberi pilihan, apakah kita akan mengkompress CSS, Javascript atau kode HTML kita.
Berikut contoh dari kompress tersebut:
- CSSyang tadinya seperti dibawah ini
#header-wrapper {width: 1010px; margin: 0 auto; position:relative; min-height: 130px;}#header-inner {float: right; width: 510px;}#header-wrapper h1 {font-size: 55px; line-height: 55px; letter-spacing: -3px; padding: 0px; margin: 0px; font-weight: bold; font-family: "Trebuchet MS";position: absolute; top: 48px; color:$colortituloblog; }#header-wrapper h1 a, #header-wrapper h1 { color:$colortituloblog; text-decoration: none; }#header-wrapper h1 a:visited { color:#660000; text-decoration: none; }#header-wrapper h1 a:hover { color:#660000; text-decoration: none; }#header-wrapper p {position: absolute; top: 105px; color:$descripcioncolor; font-size: 14px; line-height: 14px; font-weight: bold; font-family: "Trebuchet MS"; padding: 0px; margin: 0px; }
- Dikompress menjadi seperti ini
#header-wrapper {width: 1010px;margin: 0 auto;position:relative;min-height: 130px;}
#header-inner {float: right; width: 510px;}
#header-wrapper h1 {
font-size: 55px; line-height: 55px; letter-spacing: -3px; padding: 0px; margin: 0px; font-weight: bold; font-family: "Trebuchet MS";position: absolute; top: 48px; color:$colortituloblog; }
#header-wrapper h1 a, #header-wrapper h1 { color:$colortituloblog; text-decoration: none; }
#header-wrapper h1 a:visited { color:#660000; text-decoration: none; }
#header-wrapper h1 a:hover { color:#660000; text-decoration: none; }
#header-wrapper p {position: absolute; top: 105px; color:$descripcioncolor;font-size: 14px;line-height: 14px; font-weight: bold;font-family: "Trebuchet MS"; padding: 0px;margin: 0px;}
#header-inner {float: right; width: 510px;}
#header-wrapper h1 {
font-size: 55px; line-height: 55px; letter-spacing: -3px; padding: 0px; margin: 0px; font-weight: bold; font-family: "Trebuchet MS";position: absolute; top: 48px; color:$colortituloblog; }
#header-wrapper h1 a, #header-wrapper h1 { color:$colortituloblog; text-decoration: none; }
#header-wrapper h1 a:visited { color:#660000; text-decoration: none; }
#header-wrapper h1 a:hover { color:#660000; text-decoration: none; }
#header-wrapper p {position: absolute; top: 105px; color:$descripcioncolor;font-size: 14px;line-height: 14px; font-weight: bold;font-family: "Trebuchet MS"; padding: 0px;margin: 0px;}
Semoga tips diatas dapat membantu dan membuat blog anda ramai pengunjung. Ukuran dari CSS ini berkurang sebanyak 8 byte, sehingga dapat lebih mempercepat loading blog anda.
