Apakah kalian pernah mengecek blog kalian? bagaimana cepat atau lambat? Jika kalian tidak mengetahuinya coba kalian tes kecepatan Blog kalian di gtmetrix.com.

nanti akan muncul berapa kecepatan pada blog kalian.. tentu kalian tidak inginkan mempunyai blog yang lambat karena dapat menyebabkan para visitor kabur, dan menjadikan bounce rate blog anda sangat tinggi

saya ingin sedikit bercerita tentang pengalaman pribadi saya, waktu awal mula saya memasuki dunia blog, saya tidak memikirkan tentang kecepatan blog saya, yang saya pikirkan hanyalah menulis artikel sebanyak banyaknya.

Hingga suatu saat saya melihat ada orang yang memberikan screenshot kecepatan blog nya. Saya pun bertanya "mas, gimana cara nya liat gituan?" dia pun menjawab "cek aja di gtmetrix.

Saya pun mencoba mengecek kecepatan Blog saya. Alangkah terkejutnya saya saat melihat kecepatan blog saya tidak sampai 70%. Saya bingung bagaimana cara meningkatkan Kecepatan blog .

Saya pun mencoba untuk menghapus beberapa gambar, mengompres gambar dipostingan ternyata hanya sedikit atau bahkan tidak berperngaruh..

Hingga akhirnya saya menemukan caranya. untuk itu saya akan berbagi bagaimana cara meningkatkan Kecepatan blog


Mengeceknya di gtmetrix.com

Pertama kita cek dulu di gtmetrix.com apa yang mebuat website kita lambat. Setelah dicek maka akan muncul apa apa saja yang menyebabkan blog menjadi lambat,

salah satunya adalah gambar pada artikel di website kita, nah untuk mengatasinya lihatlah saran dari gtmetrix tersebut apa yang harus dilakukan.


Lihatlah pada gambar tersebut ada beberapa gambar yang masih bisa diperkecil ukurannya, anda bisa memperkecil atau mengompres gambar melalui website website penyedia layanan kompres.. 

ya mudahnya sih anda bisa mencari di google. Gambar memang tidak juga terlalu berpengaruh banyak namun tetap saja mampu meningkatkan kcepatan blog anda

Mengompres CSS

Cascading Style Sheet atau yang lebih dikenal dengan CSS yaitu  untuk mengendalikan beberapa komponen dalam suatu website sehingga akan lebih terstruktur dan seragam.


Perlu anda ketahui bahwa CSS itu bukanlah bahasa pemrograman. Tanpa CSS web ataupun akan terasa hampa karena tidak memiliki gaya. Jika anda belum tau bagaimana kode css itu akan saya beri tau
Contoh kode CSS:

/* cloud label*/

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:100%;filter:alpha(100);opacity:10}

.cloud-label-widget-content{text-align:left}

.label-size{background:#08A2FA;border-radius:30px;display:block;float:left;margin:0 3px 3px 0;color:#08a2fa;font-size:11px;text-transform:uppercase}

.label-size a,.label-size span{display:inline-block;color:#000000!important;padding:6px 8px;font-weight:bold}

.label-size:hover{background:#7faafd}

.label-count{white-space:nowrap;padding-right:3px;margin-left:-3px;background:#7faafd;color:#fff!important}

.label-size{line-height:1.2}


Nah kira kira seperti itulah kode CSS (Belum dikompres). Lalu bagaimana mengompresnya? anda bisa mengompres css menggunakan website. anda hanya perlu mengetikan "compress css".
jika sudah dikompres kode css di atas tadi akan menjadi seperti ini :

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:100%;filter:alpha(100);opacity:10}

.cloud-label-widget-content{text-align:left}

.label-size{background:#08A2FA;border-radius:30px;display:block;float:left;margin:0 3px 3px 0;color:#08a2fa;font-size:11px;text-transform:uppercase}

.label-size a,.label-size span{display:inline-block;color:#000000!important;padding:6px 8px;font-weight:bold}

.label-size:hover{background:#7faafd}

.label-count{white-space:nowrap;padding-right:3px;margin-left:-3px;background:#7faafd;color:#fff!important}

.label-size{line-height:1.2} 

Kelihatannya memang hanya sedikit berubah tetapi itu bisa dibilang cukup berpengaruh kepada kecepatan blog anda.

Menghapus kode script google plusone.js

    Script ini sangatlah mengganggu perenderan sehingga menyebabkan blog agak lambat untuk memuat, sehingga kita akan menghapusnya 1. masuk ke blogger dan edit template2. gunakan perintah CTRL+F Dan cari tulisan  https://apis.google.com/js/plusone.js3. hapus kode mulai dari <b:section class='navbar' id='navbar'... Sampai dengan </b:section>



4. Jika sudah dihapus cari kode </body> dan kalian ubah menjadi &lt;!--</body>--&gt;&lt;/body&gt;
5. klik simpan 

Menggunakan Script Lazy load.

Script ini berfungsi agar gambar yang tidak dilihat tidak akan di load, jadi lumayan agar tidak menghabiskan waktu loading dan sangat membantu dalam kecepatan blog hehe... Untuk memasangnya anda bisa ikuti tutorial  cara pasang Lazy loadJika anda sudah melakukan semua tutorial diatas, cobalah cek kembali blog anda di gtmetrix dan juga coba lihat sendiri blog anda. Coba dan rasakan perbedaannya..Sekian dari saya untuk kali ini. saya akhiri salam !!

Related Posts

0 komentar untuk 4 cara meningkatkan kecepatan pada blog