Jangan Gunakan Gambar untuk Background (Fast Loading Tips)

Baca Juga

SALAH satu cara mempercepat loading time blog adalah dengan tidak menggunakan background (latar) blog dengan gambar, image, atau foto. Makin cepat & ringan tampilan blog, maka akan makin user friendly dan disukai mesin pencari.

Gambar latar belakang biasanya berulang secara horizontal atau vertikal. Sekitar 50% penyebab blog tampil lambat adalah karena image background, menurut MBT. GT Metrix juga suka memberikan catatan khusus soal gambar latar blog ini.

Maka, ganti saja background berupa gambar itu dengan kode warna atau kode CSS/HTML. Dijamin, loading time blog akan lebih cepat dari sebelumnya.

Kode CSS latar belakang blog biasanya seperti ini:
body { background: #7AA1C3 url(http://xyz.com/bg-image.jpg);

Intinya, diawali dengan tulisan body {background:

Cara Mengubah Background Blog

Untuk mengubah latar belakang blog dari gambar menjadi kode CSS/HTML sangat mudah.
1. Template > Edit HTML
2. Temukan (Ctrl+F) kode body {background:# ....}
3. Ganti dengan kode berikut seperti ini:

body {background:#000;}

Catatan:
- Di belakang kode warna biasanya ada kode lain, seperti color:#444 dsb. Jangan sampai kehapus!
- Kode #000 adalah warna hitam. Silakan pilih warna lain di Kode Warna HTML.

Menggunakan Color Gradient

Kita juga bisa menggunakan warna gradient atau gradasi untuk background blog. Blog CB ini juga sekarang menggunakan Color Gradient.

Gak perlu repot-repot membuat sendiri kode warna gradient untuk background, cukup:
1. Buka Gradient Generator.
2. Pilih warna
3. Copy kodenya
4. Paste di kode body { 

Ini kode warna gradient  background blog CB. Silakan copas jika mau menggunakannya:

background: rgba(209,209,209,1);
background: -moz-linear-gradient(top, rgba(209,209,209,1) 0%, rgba(254,254,254,1) 0%, rgba(226,226,226,1) 75%, rgba(219,219,219,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(209,209,209,1)), color-stop(0%, rgba(254,254,254,1)), color-stop(75%, rgba(226,226,226,1)), color-stop(100%, rgba(219,219,219,1)));
background: -webkit-linear-gradient(top, rgba(209,209,209,1) 0%, rgba(254,254,254,1) 0%, rgba(226,226,226,1) 75%, rgba(219,219,219,1) 100%);
background: -o-linear-gradient(top, rgba(209,209,209,1) 0%, rgba(254,254,254,1) 0%, rgba(226,226,226,1) 75%, rgba(219,219,219,1) 100%);
background: -ms-linear-gradient(top, rgba(209,209,209,1) 0%, rgba(254,254,254,1) 0%, rgba(226,226,226,1) 75%, rgba(219,219,219,1) 100%);
background: linear-gradient(to bottom, rgba(209,209,209,1) 0%, rgba(254,254,254,1) 0%, rgba(226,226,226,1) 75%, rgba(219,219,219,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1d1d1', endColorstr='#dbdbdb', GradientType=0 );

Loads time blog CB (Cek: 9 Maret 2015)

Kenapa Harus Fast Loading?

Sering dibahas, kecepatan tampilan blog merupakan rekomendasi Google. Menurut Google, didukung survei, 75% pengunjung akan meninggalkan dan tidak akan membuka lagi blog yang tampil lambat, berat, lama, lemot, alis "lamberta".

Google rekomendasikan kecepatan blog di bawah 4 detik. Paling lambat 5-6 detik lah!

Banyak faktor yang memperlambat loads time blog, terutama gambar (image). Yang lainnya seperti flash, animasi, javascript, termasuk widget hit counter, statistik pengunjung, widget alexa rank, dll.

Tidak menggunakan latar belakang blog berupa gambar merupakan salah satu saja dari sekian cara mempercepat loading time blog. Good Luck! (http://contohblognih.blogspot.com).*