Terwujud

Loading Blog Cepat tanpa Sidebar untuk Versi Mobile



Jika bermanfaat, Mohon di Share ya !, jika ada unek-unek komen aja
Ini merupakan artikel yang ingin saya share kepada teman-teman untuk berbagi pengalaman tentang kecepatan blog saat dibuka melalui ponsel/mobile.

Sebagaimana yang kita ketahui bahwa rata-rata pengunjung telah menggunakan smartphone untuk mengetahui apa saja informasi yang ingin mereka dapatkan, itu artinya kesempatan blog kita dibuka melalui desktop hanya sekitar 10-30% saja, sedangkan selebihnya itu dibuka melalui Mobile/ponsel/smartphone.
Blog
Nah, dengan perubahan pengguna untuk membuka blog dengan ponsel inilah yang membuat saya mengambil keputusan untuk menghilangkan sidebar-wrapper blog terwujud.com.

Alasan menghilangkan karena saya telah menanalisis pageview afilasi Idwebhost yang ada di sidebar bawah, untuk pageview nya begitu turun secara drastis, berbeda di tahun sebelumnya.

“Hal di atas mengindikasi kan bahwa pengunjung tidak begitu rajin melakukan scroll ke bawah, sebab mereka hanya menginginkan informasi yang mereka cari.”

Jadi, dapat dipastikan bahwa kolom sidebar yang kita tempatkan iklan, popular post, label atau lain sebagainya seperti blog ini, volume pengunjung melihatnya sangat minim. Oleh sebab itulah saya mencoba untuk menghilangkan sidebar blog saya pada versi mobile.

Tujuan saya menghilangkan sidebar pada blog terwujud.com tidak lain karena untuk memanjakan pengunjung yang kuota dan koneksi internetnya sangat memprihatinkan, so niatnya ibadah lho heehee. Selain itu, kabar baiknya adalah terkait dengan nilai SEO di mata Search engine seperti Google, mereka menilai jika blog yang mempunyai kecepatan loading yang optimal dan maksimal, maka nilai dan peringkat blog tersebut akan diperhitungkan.

Menggunakan CSS
Bagi yang ingin menghilangkan sidebar tertentu, maka gunakanlah CSS. Contohnya saya, untuk sidebar blog ini terbagi dalam 3 bagian yaitu .sidebar1-wrapper, .sidebar2-wrapper dan .sidebar3-wrapper. Nah, jika ingin menghilangkan satu atau dua sidebar, maka cukup menggunakan kode seperti dibawah ini:
@media (max-width: 650px){
.sidebar1-wrapper {display:none !important;}
}
Ingin semua sidebar?, salin kode dibawah ini:
@media (max-width: 650px){
#sidebar-wrapper{display:none !important;}
}
Pilihan:
Untuk ukuran tipe mobile, teman-teman bisa menentukan mana yang ingin disembunyikan sidebarnya, untuk itu silahkan rubah angka pada versi mobilenya, jika ingin tidak tampil pada ponsel ukuran kurang dari 5 inchi, maka kodenya @media (max-width: 320px), untuk pengaturan selanjut bisa dirubah sendiri sesuai keinginan teman-teman.

Hilangkan sidebar Versi Desktop secara Manual
Untuk membuat tampilan artikel melebar, maka teman-teman bisa menggunakan kode:
<style>
#sidebar-wrapper {display: none !important;}
.main-wrapper{width: 100%}
#terwujud-wrapper {display: none !important;}
</style>
Ingat: Jika iklan ingin dihilangkan seperti iklan yang letaknya diheader, maka silahkan cari dulu kode widget iklannya, contohnya seperti blog ini kodenya #terwujud-wrapper, maka saya cukup menambahkannya saja. Lihat kode di atas, kelihatan kan !

DEMO sudah bisa teman-teman lihat pada artikel ini.

Membuat artikel tampil melebar tanpa sidebar ini tidak dibuat otomatis, seperti halaman Jasa Review pada blog ini. Saya lebih memilih secara manual saja. Jadi mana saja artikel yang ingin dioptimalkan tampilannya, cukup dengan memasukkan kode di atas ke dalam versi HTML (letaknya bertetangga dengan Compose). Jadi, artikel lainnya tidak akan terganggu dan tidak akan berubah. Gimana, asyik bukan !.

Jika ada kode atau cara lain yang lebih menarik, teman-teman bisa share lho ke saya !, semoga bermanfaat.


Artikelnya sudah di share, makasih ya !

Mau Artikel Gratis! Silahkan Tulis Email Anda.
Print PDF

You Might Also Like:

Previous
Next Post »

Sudah ada 7 komentar

Saya akan sangat senang jika ada komentar yang membangun, tetapi:

*Jangan komentar SPAM
*Jangan menanam link
*Jangan ada unsur sara, Fornografi dan memojokkan

Komentar yang melanggar akan dimasukkan kedalam daftar SPAM dan tidak akan diijinkan lagi.

Klik dan Copy Icon di bawah:
:) :( hihi :-) :D =D :-d ;( ;-( @-) :P :o -_- (o) :p :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ $-) (y) (f) x-) (k) (h) cheer lol rock angry @@ :ng pin poop :* :v 100

By: Terwujud.com
Terima Kasih!!

  1. Iya sih.. Cepet jadinya ini aku buka dari android
    😊

    ReplyDelete
  2. Benar, kalau pakai hp jarang scroll ke bawah. Biasanya berhenti setelah infonya ketemu.
    Trims tipsnya, sangat membantu.

    ReplyDelete
  3. Meskipun tidak paham, tapi saya merasakan perubahannya bila dibandingkan pertama kali berkunjung ke sini.

    ReplyDelete
  4. Ya sekarang terasa lebih ringan dan memang kita harus bisa memposisikan diri sebagai pengunjung blog agar tahu apa saja yang kira-kira dibuyuhkan oleh pengunjung

    ReplyDelete
  5. Yang penting sih cara mengotomatiskan saat menulis konten yang seharusnya langsung bisa tersaji untuk perangkat mobile

    ReplyDelete
Copyright © 2014 Terwujud.com - All Rights Reserved