NEWS UPDATE :
Saturday, April 7, 2012

Mempercepat Loading Blog Dengan Teknik Kompress CSS

Share to :

Blog sobat loadingnya berat, ingin mempercepat loading blogspot, pada posting ini akan saya share tentang cara mempercepat loading blog dengan teknik kompresi di CSS untuk pengguna blogger/blogspot, selain pengguna blogger/blogspot, mungkin akan sedikit beda, tetapi prinsipnya sama. 
Kemarin saya sudah posting  tentang Cara Membuat Navigasi Breadcum di Blogger, hal itu tujuannya untuk menguatkan blog kita dalam persaingan SERP Google dan Bing. :o

Apa itu CSS?
Menurut mbae wikipedia :
Cascading Style Sheet (CSS) merupakan salah satu bahasa pemrograman web untuk mengendalikan beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam.
Sama halnya styles dalam aplikasi pengolahan kata seperti Microsoft Word yang dapat mengatur beberapa style, misalnya heading, subbab, bodytext, footer, images, dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa berkas (file). Pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML.

CSS dapat mengendalikan ukuran gambar, warna bagian tubuh pada teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter lainnya.CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan dokumen.Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda.

Apa ada kaitannya CSS dengan SEO?
Menurut pengamatan para pakar seo, CSS dan SEO sangat berkaitan erat dan juga saling berhubungan. Misalnya robot google akan malas mengunjungi blog kita, gara - gara CSS nya yang amburadul, yang membuat loading blog kita jadi berat. Akibatnya beberapa postingan kita yang seharusnya masuk menjadi 10 besar google menjadi tersingkir dari persaingan SERP.

Dimana letak kode CSS blog kita?
Terletak dibagian Template blog kita. yaitu : 
Dasbor >> Rancangan >> edit HTML >> terletak di antara <b:skin> --sampai--> ]]></b:skin> 

Lalu Bagaimana cara Kompresi CSS blog nya?
Ada 2 Cara yang bis kita pakai, yaitu:

1. Cara Manual
Cara ini akan menyita banyak waktu, karena akan dilakukan secara manual dan satu persatu.
contoh:
#header-wrapper {
background: url(http://www.freeimagehosting.net/uploads/e439563253.jpg) no-repeat #000;
height: 150px;
margin-top: padding: 0px 0px 0px 0px;
text-align: center;
border: 1px solid #000;
}
setelah dikompres akan menjadi
#header-wrapper{background:url(http://www.freeimagehosting.net/
uploads/e439563253.jpg) no-repeat #000;height:150px;margin-top:padding:0px 0px 0px 0px;text-align:center;border:1px solid #000;}
{Margin-top: 15px;
Margin-right: 10px;
Margin-bottom: 15px;
Margin-left: 15px; }
menjadi
{Margin:15px 10px;} 

Sobat bisa mengecek dulu kecepatan loading blog sobat disini, lalu setelah selesai di kompress css nya, bandingkan dengan hasil sebelumnya.

2. Cara Instant/Otomatis
Cara ini terbilang lebih simple dan cepat, karena kita memanfaatkan tool gratis kompresi CSS secara online.

Caranya dengan memotong/meng copy kode CSS pada temlate sobat yaitu letaknya di antara  <b:skin> --sampai--> ]]></b:skin> , lalu memasukkan/paste kode CSS kedalam form yang disediakan, klik compress, jadi dech..... :d  
Lalu copy hasil compressan tadi, dan paste kembali di antara <b:skin> --sampai--> ]]></b:skin>  yang ada di template kita tadi. Simpan template  sobat. :x

Kita bisa mengunjungi situs dibawah ini :
http://www.cssoptimiser.com/
http://www.cssdrive.com/index.php/main/csscompressor
http://www.csscompressor.com/
http://www.csstidyonline.com/
Dan masih banyak lagi situs - situs yang menyediakan kompresi css untuk mempercepat loading blog kita, silakan cari/browsing di mbah google. :D 

Sekian dulu tentang cara mempercepat loading blog dengan teknik kompresi di CSS untuk pengguna blogger/blogspot.
Selamat mencoba, semoga bermanfaat.... ;)


Tulisan ini menarik? Copas permalink ini blogmu donk!

23 komentar:

Sandy Doank said... Balas Komentar

kunjugan pagi ke tempat sahabat lama sebelum beraktivitas, kompresing memang perlu gan....

AbduGreen said... Balas Komentar

iya gan... :D

Frendli Wirnawan said... Balas Komentar

sudah di kompress kemaren tapi sepertinya tidak semua bisa soalnya ada css yang waktu di kompress hasilnya malah jadi aneh...

AbduGreen said... Balas Komentar

Jadi aneh gimana maksudnya sob... emang gak semua..
jadi cari aja css yang bisa di compress,, kalo ada yang ga bisa,,, compress manual aja seperti contoh artikel diatas,,

BlogS of Hariyanto said... Balas Komentar

asyik nich dapat pengetahuan tambahan untuk percepatan loading, terimakasih kawan sudah berbagi info :)

AbduGreen said... Balas Komentar

Ok dah sob,.. makasih atas kunjungannya...

loveheaven07 said... Balas Komentar

nice tip sob

AbduGreen said... Balas Komentar

ok.. thanks ya..

muhammad hidayat said... Balas Komentar

Wahh..manteb sob..
Perlu dicoba nih..
Thanks udah share...

AbduGreen said... Balas Komentar

ok.. makasih sudah berkunjung

Dony Lim said... Balas Komentar

wah , nica info nih , kadang suka berat buka blog sendiri . :O

AbduGreen said... Balas Komentar

Nice Info???? wkwkwkwk :D

tutorial blog said... Balas Komentar

kembali lagi kerumah sahabat setelah perbaiki kompie...nice impo gan........

AbduGreen said... Balas Komentar

hehe.. makasih sobat..

Fahmi Setiawan said... Balas Komentar

Tempat favorite saya mengcompress di cssdrive tuh. hahahaaa...

AbduGreen said... Balas Komentar

Oh ya.. hihiihi,, sama donk

Agriculturproduct said... Balas Komentar

Setelah saya kompres malah kacau warnanya gan.yahh terpaksa nggak jadi.nice info gan.

AbduGreen said... Balas Komentar

kompress cssnya sob..

MIKROTIK said... Balas Komentar

wah bisa yah sob..
mantab sob..

etool said... Balas Komentar

yyo thanks infonya gan..........bb

Eflianda said... Balas Komentar

entar malah jadi aneh ga sob setelah d compres..?
soalnya dulu pernh kompres, hasilnya malah ga karuan..

Rama Sahrul Robi said... Balas Komentar

wah,, mantap broo... makasih banyak infonya

CERITA-CERITA said... Balas Komentar

berpengaruh sama tampilan blog gak ik?

Post a Comment

Berkomentarlah di blog ini dengan Etika yang Baik dan Cerdas
- Jangan mencantumkan link apapun, ex: http://xxx
- Komentar yang Nyepam TIDAK AKAN SAYA PUBLISH
- Jangan sampai komentarmu masuk ke dalam SPAM!

 
Support : Creating Website | My Pages | Makcum Abdu
Copyright © 2011. Abdu-Green's Blog - All Rights Reserved
Template Modify by Creating Website
Proudly powered by Blogger