PANDUANEKA

Aneka Panduan & Solusi Anda

13 September 2017

11 Cara Mempercepat Loading Blog untuk Meningkatkan Trafik Pengunjung

Memberikan pengalaman pembaca blog yang baik salah satunya dengan cara mempercepat loading blog. Kecepatan loading blog yang ringan waktu di buka pengunjung baik langsung dari url atau melalui hasil pencarian berpotensi akan mendatangkan traffik yang luar biasa bagi blog anda.

Namun sebaliknya bila blog terasa berat dan lamban saat diakses, maka blog anda besar kemungkinan akan ditinggalkan pengunjung dan berpindah ke blog lain dengan topik yang sama.
Salah satu faktor yang sangat disarankan oleh Google adalah kecepatan loading. Mesin pencari sendiri dalam mengindex blog untuk masuk halaman pertama di samping melihat dari sisi penyajian konten berkualitas juga sangat memprioritaskan kecepatan loading blog yang cepat dan ringan dari semua kata kunci yang dicari.

Jadi, agar blog anda baik dimata pengunjung dan juga mesin pencari perhatikan sisi kecepatan blog anda dan tambahkan sedikit optimasi Seo On-Page dan Off-Page di dalamnya.
11 Cara Mempercepat Loading Blog untuk Meningkatkan Trafik Pengunjung

Cara Cek Kecepatan Loading Blog

Banyak alat yang bisa dipakai untuk mengecek kecepatan loading blog. Ada beberapa tool gratis untuk mengecek kecepatan loading blog, diantaranya :

Pagespeed insight
11 Cara Mempercepat Loading Blog untuk Meningkatkan Trafik Pengunjung

Think with Google
11 Cara Mempercepat Loading Blog untuk Meningkatkan Trafik Pengunjung

GTMetrix
11 Cara Mempercepat Loading Blog untuk Meningkatkan Trafik Pengunjung

Saya sendiri sering menggunakan pagespeed insight untuk tes kecepatan blog saya. Tool gratis dari Google ini memiliki tingkat akurasi yang baik dan disertai saran solusi perbaikan yang dapat anda lakukan.

Silahkan cek loading blog anda dengan salah satu dari 3 tool gratis diatas sekarang juga. Apabila anda menggunakan pagespeed insight, lihat score dan indikator yang anda peroleh.

Untuk memulai, masukkan url blog anda dikotak yang disediakan, kemudian klik Analyze.
Pagespeed Insights sendiri mempunyai 2 menu utama, yakni saran optimasi untuk Mobile dan Desktop. Bagian Mobile mempunyai 2 sub-menu yaitu Speed dan User Experience, sedangkan bagian Desktop terdapat sub-menu Suggestions Summary.

Di Pagespeed Insights ini ada 3 elemen utama yang bisa kita optimasi yaitu Image, Javascript dan CSS.

Jika score yang anda peroleh menunjukkan indikator hijau berarti blog anda telah memenuhi standar kecepatan yang disarankan tetapi jika menunjukkan indikator warna merah atau kuning, anda wajib waspada. Itu berarti kerja loading blog anda masih lamban dan butuh perbaikan.

Pada artikel kali ini saya akan memberi panduan yang bisa anda terapkan agar loading blog anda lebih ringan dan cepat.

Trik Membuat Loading Blog Ringan dan Cepat

Loading halaman blog yang cepat ( versi desktop dan mobile) sangat disukai oleh mesin pencari dan pengunjung.

Dimata search engine, blog dengan loading yang ringan memiliki struktur yang mudah untuk dirayapi. Bagi pengunjung, kecepatan proses loading membuat mereka tidak menunggu lama alih-alih justru menekan tombol close (x).

Nah, berikut ini trik yang bisa anda lakukan, untuk kepuasan pembaca blog anda.

1. Matikan CSS default dari Blogger
Caranya dengan mereset css bawaan blogger, silahkan masuk ke Edit HTML, kemudian cari kode  <b:skin><![CDATA[  kemudian ganti kode tersebut dengan kode dibawah ini
&lt;style type=&quot;text/css&quot;&gt;&lt;!-- /* <b:skin><![CDATA[

2. Mematikan Java script bawaan Blogger yang berada diatas header
Caranya masuk ke Edit HTML , temukan kode </head>  kemudian ganti dengan kode dibawah ini
&lt;!--</head>--&gt;&lt;/body&gt;

3. Mematikan Java script Bawaan Blogger yang ada di atas kode </body>
Caranya di Edit HTML, temukan kode </body>  dan ganti dengan kode dibawah ini
&lt;!--</body>--&gt;&lt;/body&gt;

4. Kode Jquery harus asinkron
Hampir di semua template blog terdapat kode script jquery.  Jquery adalah library Javascript multiplatform yang dirancang agar menyusun client-side script pada file HTML menjadi lebih mudah.

Dengan syntax jquery, para pengembang template lebih gampang dalam merancang berbagai plugin berbasis JavaScript. Plugin inilah yang dipakai untuk menyusun abstraksi seperti interaksi animasi, dan efek yang kompleks dari berbagai widget yang dapat dikonfigurasi.

Namun begitu, agar loading blog menjadi lebih ringan dan cepat penempatan kode jquery pada template haruslah dibarengi dengan kode asinkron.

Silahkan menuju ke edit HTML blog anda, cari kode ini:
< script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'/>
Tambahkan kode asinkron (tulisan warna kuning) untuk menambah kecepatan loading blog hingga kode menjadi seperti di bawah ini.
<script async='true' src='//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'/>

5. Kompreslah gambar anda
Gambar adalah visualisasi pendukung dan penguat sebuah konten. Gambar pun perlu dioptimasi agar artikel bisa muncul di halaman pertama.

Sebaiknya anda baca juga : Cara Optimasi Gambar Postingan Agar SEO Friendly Secara Otomatis

Tiap gambar memiliki muatan file dan format yang berbeda. Perhatikan kedua hal tersebut saat memasang gambar di artikel anda.

Makin besar ukuran file dan resolusinya, daya muat blog juga semakin berat dan membuat lamban. Maka perlu untuk mengkompres gambar agar ukuran file jadi lebih kecil.
.
Untuk caranya, silahkan baca di artikel saya : 2 Cara Kompress Gambar Tanpa Mengurangi Kualitas Gambar Tampilan

6. Minimalkan html template 
Untuk membantu meringankan kerja loading, HTML template jika memungkinkan perlu diperkecil ukurannya. Banyak situs yang memberikan layanan gratis untuk merampingkan HTML, diantaranya adalah HTML Compressor.

Selain mudah, hasil kompresinya akan tetap mempertahankan kode script asli pada template anda. Mereka hanya membuang kode-kode yang tidak dibutuhkan.

Catatan: Sebelum melakukan kompress, back up dulu template anda

  1. Silahkan, buka HTML Compressor 
  2. Dari Edit HTML, tekan tombol ctrl+A lalu copy dan pastekan html template anda pada kotak source di halaman HTML Compressor. Selanjutnya klik Compress. Tunggu beberapa saat. 
  3. Setelah muncul hasil kompres, pilih select all, lalu pastekan ke halaman html template anda.
  4. Pratinjau template, jika tidak terjadi masalah klik save/simpan. 

Yang perlu digaribawahi, cara ini tidak bisa diterapkan pada semua template, jadi cara ini mungkin saja tidak bisa diterapkan pada template yang anda gunakan.

7. Cukup gunakan satu script kode asinkron iklan pada template (khusus blog Adsense) 
Tips ini khusus buat publisher Adsense. Iklan, termasuk iklan Adsense merupakan salah satu penyebab lambannya loading halaman blog.

Andai dalam satu blog terpasang beberapa iklan Adsense maka kode asinkron akan dibaca satu persatu. Hal ini bisa memperlambat daya muat loading blog.

Tapi tenang, ada cara untuk mengatasinya. Silahkan baca panduan caranya:   Satu Script Kode Asinkron Adsense Untuk Mempercepat Loading Halaman Blog

8. Memodifikasi css bundle blogger 
Bagi anda yang mengecek speed loading blog lewat pagespeed insight, dan mendapat indikator warna merah atau kuning, kemungkinan besar akan mendapat peringatan ini “Eliminate renderblocking JavaScript and CSS in abovethe-fold content”.

Peringatan itu menandakan bahwa ada script di konten paruh atas pada template yang menghalangi proses render. Salah satu nya adalah css bundle blogger.

Cara mengatasinya mudah:

1. Cari kode <b:skin>….</b:skin> di Edit HTML anda lalu letakkan kode di bawah ini sebelum kode <b:skin>.
&lt;style
type=&quot;text/css&quot;&gt;
&lt;!-- /*
2. Simpan template, dan coba cek kembali skor kecepatan blog anda.

9 . Memasang widget seperlunya 
Keberadaan widget sangat penting dalam navigasi blog guna mempermudah pengunjung menemukan konten anda.

Tapi terkadang seorang blogger terlalu asyik memasang widget disana-sini yang sebenarnya tidak terlalu penting. Hal ini tentu saja akan memperlambat loading blog itu sendiri. Anda harus memilih widget apa saja yang sebaiknya dipasang.

Utamakan widget yang berfungsi sebagai navigasi yang memudahkan pengunjung menemukan artikel yang ada di blog.

Setidaknya ada 4 widget yang menurut saya wajib ada dalam blog yaitu popular post, recent post, label dan arsip. Diluar keempatnya, saya rasa tidak mutlak harus anda pasang.

Konon, keempat widget tadi juga termasuk salah satu syarat yang harus ada pada sebuah blog agar cepat diterima waktu didaftarkan ke Google Adsense.

10. Tampilkan widget hanya di salah satu halaman blog 
Untuk lebih mempercepat dan memperingan loading blog, anda bisa menampilkan widget pada salah halaman. Contohnya pada blog saya ini recent post hanya tampil pada halaman postingan saja sedang popular post hanya tampil pada homepage saja.

Cara ini sangat efektif mengurangi loading blog karena widget tidak harus diload semua setiap membuka salah satu halaman. Alasan lainnya pada homepage biasanya sudah tampil postingan-postingan terbaru pada halaman depan sehingga tidak perlu ditambahi lagi widget recent post pada sidebar homepage.

Untuk panduannya, silahkan baca : Cara Menampilkan Widget Hanya di Homepage atau Halaman Posting

11. Cukup tampilkan 4-5 postingan pada homepage blog
Jangan terlalu banyak menampilkan postingan pada halaman utama blog anda cukup 5 postingan saja. Semakin banyak postingan yang tampil semakin banyak pula yang akan diload sebelum tampilan halaman terbuka. Maka, biasanya template style magazine mempunyai speed yang lebih lambat dibanding template yang simpel.

Penutup

Ingat, sekarang adalah era mobile dimana semua dituntut untuk cepat. Tidak terkecuali blog. Blog yang lamban, kemungkinan besar untuk ditinggalkan dan dilupakan.

Jangan kecewakan pengunjung anda hanya gara-gara blog super lambat. Jika ingin menarik banyak pengunjung blog, mulai terapkan trik-trik di atas. Buat loading halaman web anda sekencang mungkin.

Apakah sekarang loading blog anda sudah kencang? Tolong beritahu saya lewat kolom komentar di bawah. Semoga bermanfaat.

4 comments:

  1. terima kasih ilmunya mas .. itu yang point 8 sama ya mas dengan yang di awal? trus saya coba cari yang jquery kok ga muncul ya di blog saya? apa memang gak ada? thanks

    ReplyDelete
    Replies
    1. Ya mba, poin 8 dan 1 itu sama kalau sudah pasang kode seperti poin 1 tidak usah pasang lagi kode no 8...pada kebanyakan template yang ada saat ini biasanya sudah diset seperti kode pada poin no 1

      Delete
  2. Cuma bisa dapat 70/100

    Masih ada http:// maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

    Yang membuat berat loading

    ReplyDelete
    Replies
    1. Sebenarnya kalau tidak terlalu penting sebaiknya tidak usah memasang font awesome karena memerlukan render yang berat. Skor 70/100 dengan adanya font awesome didalam template sudah masuk kategori baik asal tidak dibawah skor 50/100

      Delete

- Silahkan berkomentar sesuai topik.
- Mohon centang pada Notive me agar tahu balasan dari kami.
- Sebelum bertanya, silahkan Anda cari terlebih dahulu di kotak pencarian (Search)
- Untuk setiap komentar saya akan lakukan kunjungan balik ke situs Anda dengan atau tanpa komentar
Terima kasih atas kunjungan dan komentarnya