Tuesday, November 12, 2013
Thursday, November 7, 2013
Modifikasi Blog Anda Agar Memiliki Kecepatan Loading Yang Maksimal
Meningkatkan Kecepatan Blog merupakan bagian integral dari strategi menaikkan traffic sebuah blog. Blog yang memiliki loading yang lebih cepat dan memakan sedikit waktu untuk menampilkan semua elemen akan meningkatkan pembaca, search engine traffic, dan begitu pula pendapatan. Desain blog yang bagus tidak akan ada artinya jika waktu loading sangat lama dan membosankan. Tidak semua orang memiliki koneksi internet yang cepat seperti LAN atau Wi-Fi. Dengan munculnya teknologi smart phone, penggunaan internet Mobile meningkat setiap bulan dan meninggalkan koneksi internet komputer. Para developer browser telah menciptakan inovasi agar browsernya kompatibel dengan iPhone, Android, Windows Phone dan Blackberry. Masyarakat yang tinggal di Amerika Serikat adalah konsumen terbesar dari smart phone ini. Amerika Serikat masuk dalam tiga negara teratas yang memiliki pengguna internet terbesar. Dalam rangka untuk menarik lebih banyak lalu lintas dari Amerika Serikat serta Inggris, dan Asia Anda perlu memastikan bahwa Anda memiliki beban blog yang ringan dan desain yang kompatibel dengan browser-browser besar seperti Chrome, Firefox, dan Internet Explorer 8. Dalam seri ini saya akan berbagi beberapa rahasia desainer web menggunakan template yang dirancang untuk memastikan situs web mereka memiliki sedikit waktu untuk loading dan memaksa pengunjung untuk menunggu selama beberapa detik.
Waktu loading yang ideal adalah sekitar 5-8 detik tetapi jarang sekali mencapai waktu tersebut karena kita tidak bisa mengorbankan desain blog banyak demi mempercepat waktu loading. Oleh karena itu, kami akan memastikan untuk menjaga desain blog tetap rapi dan bersih dengan mengadopsi cara-cara cerdas dengan mengoptimalkan script dan gambar. Gambar grafis, widget pihak ketiga, plugin, JavaScript, dan JQuery bertanggung jawab atas 80% dari waktu loading yang lambat pada blogger dan Wordpress.
Beberapa Kerugian Jika Loading Blog Lambat
- Mengakibatkan pengunjung tidak betah dengan blog Anda sehingga meningkatkan tingkat bounching
- Mengurangi PageView, Orang tidak akan berselancar di blog Anda dan cenderung akan meningggalkan blog Anda sesegera mungkin
- Jika terjadi penurunan PageView maka juga akan pendapatan dari iklan.
- Anda tidak akan mendapatkan target sponsor jika tampilan halaman Anda kurang dari 2-3 ribu/hari
- Area iklan yang Anda sediakan tidak dapat dijual dengan harga yang lebih tinggi
- Pengunjung tidak akan membagikan konten Anda di jaringan media sosial
- Pengunjung tidak akan berubah menjadi pembaca dan dengan demikian tidak ada peningkatan jumlah pelanggan
- Follower Anda di Facebook, Twitter, dan Google+ akan meningkat dengan lambat
- Orang akan cenderung untuk membaca Feeds Anda dari pada memilih mengunjungu blog Anda sehingga akan berefek pada penolakan dari AdSense.
- Robot pencari akan melewati proses index halaman yang terlalu padat dan penuh dengan script grafis
- Peringkat pencarian halaman kami pikir juga akan menurun
- Google menyukai penggunanya yang memiliki situs dengan loading yang cepat dan memberikan hukuman pada situs berloading lama
- Lalu lintas pada Internet Explorer akan menderita karena browser mengalami crash. IE sering crash ketika membuka halaman yang memakan waktu lama
- Lalu lintas dari Smart Phone juga akan berkurang karena koneksi internet mobile tidak sangat cepat. Orang lebih suka mengunjungi situs yang mudah diakses dan cepat menggunakan telepon genggamnya
Apa Langkah Selanjutnya?
Setelah menyadari beberapa kelemahan terbesar dari faktor kecepatan blog, sekarang akan menarik untuk membahas cara-cara yang efektif untuk mengurangi jumlah elemen yang mungkin menyebabkan waktu loading blog lebih lama. Kami akan berbagi tips untuk blogger blogspot mengenai cara-cara untuk meningkatkan kecepatan loading blog Anda. Saya yakin Anda akan belajar banyak dari artikel saya selanjutnya. Saya akan berbagi beberapa tips praktis lanjutan yang mudah diterapkan.
Nantikan kami selanjutnya... :) ^^
Memasang Tombol Share Pinterest, Facebook, Twitter Melayang di Blogger
Ini adalah salah satu dari beberapa widget social sharing yang paling saya sukai karena tampilannya yang rapi dan tidak berantakan. Anda telah melihat tren dari jumlah tombol share melayang di blog-blog populer. Pengembang telah menciptakan versi yang berbeda dari bar ini dan menerapkan efek Jquery dan gaya CSS3 tapi widget ini berbeda karena mengandung kustom Pinterest, Facebook, Twitter, dan tombol Email. Layanan seperti Addthis dan ShareThis keduanya melakukan pekerjaan yang besar, tetapi mereka masih perlu bekerja pada beberapa masalah integrasi plugin mereka. Pinterest pin it button lah yang menyebabkan masalah besar dan kegagalan dalam mengambil gambar thumbnail yang benar. Dalam kebanyakan kasus, bahkan tidak menampilkan gambar sehingga membuat konsep pinning terasa hambar. Namun bar ini didesain ulang dari widget yang disediakan oleh ShareThis untuk membuat yang baru dengan memperbaiki semua kekurangan. Tombol share ini akan melayang di sebelah kiri posting blog Anda dan akan melayang mengikuti scroll pengunjung ke atas atau ke bawah postingan. Widget ini berisi counter dari situs jejaring sosial yang memiliki potensi untuk membawa traffic blog Anda dengan cara mensirkulasi konten Anda ke khalayak yang lebih luas. Kami telah menguji widget ini pada beberapa browser seperti IE8+, Firefox, Google Chrome, dll dan semuanya bekerja dengan baik tanpa masalah kompatibilitas atau konflik desain. Marilah kita bekerja sekarang!Tombol Sosial Share yang Mana yang Harus Digunakan?
Prioritas pertama yang harus ada adalah Facebook, Google +, Twitter, Linkedin dan Sekarang Pinterest. Semua sosial share ini memainkan peranan dengan baik dalam sirkulasi konten Anda melalui banyak pengunjung. Social Media adalah mesin yang bekerja non-stop, yang jika didorong dengan benar dan hati-hati dapat memberikan berton-ton traffic dan juga dapat menghasilkan dolar juga dari website Anda. Setelah menampilkan banyak tombol share pastinya akan mempengaruhi waktu loading blog Anda, karena itu saya telah menambahkan tombol share AddThis yang menyediakan pengunjung dengan lebih dari 330+ pilihan sosial sharing semua di satu tempat.
Kenapa Tidak Menggunakan JQuery?
Abaikan penggunaan JavaScript dan Jquery sebanyak mungkin. Browser seperti Internet Explorer masih kekurangan dukungan untuk semua fungsi yang ditawarkan oleh jquery. Apalagi JavaScript bertanggung jawab untuk persentase besar dari waktu beban blog Anda secara keseluruhan. Oleh karena itu tidak ditambahkan efek smooth sliding untuk plugin ini.
Bagaimana Cara Kerjanya?
Saya telah mengintegrasikan Addthis dan layanan ShareThis di dalamnya. Dalam rangka untuk menyesuaikan tombol twitter dan lain-lain saya mengambil kode default ShareThis dan menyesuaikannya untuk mengubah gambar tombol, ukuran gelembung dan count text. Widget yang sejak awalnya kita kembangkan memang terlihat lebih menarik dibanding yang satu ini. Anda dapat melihat versi draft pertama yang dirancang pada gambar di bawah ini:
Jika Anda lihat gambar di atas, tombol-tombol share kurang rapat dan menghabiskan banyak ruang di blog Anda. Berbeda dengan ini yang terlihat lebih rapat dan seksi, juga tidak menghabiskan banyak ruang blog.
Cara Memasang Tombol Share Melayang
Langkah-langkahnya sangat mudah untuk diterapkan. Yang Anda butuhkan hanya mengcopy dan paste potongan panjang kode yang ada di bawah ini ke template Anda. Ikuti langkah-langkah berikut ini:
- Masuk ke Blogger > Template
- Backup dulu template Anda
- Klik Edit HTML
- Klik Expand Widget Templates
- Kemudian cari kode berikut ini:
<b:includable id='post' var='post'>
- Letakkan kode di bawah ini tepat di bawah kode tadi:
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<style>
.gnr_social_floating{
position:fixed; bottom:6%; margin-left:-72px; float:left; width:60px;
background-color:#f7f7f7; padding: 5px 0 0px 0px;
border-top:1px solid #ddd;
border-left:1px solid #ddd;
border-bottom:1px solid #ddd;
z-index:9999px !important;
border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;
}
.gnr_social_floating .gnr_side_social_button{
margin-bottom:5px;
float:none;
height:auto;
width:60px;
}
.gnr_social_floating .st_twitter_vcount, .gnr_social_floating.st_plusone_vcount, .st_email{
margin-left:5px;
}
.gnr_social_floating .st_fblike_vcount{
margin-left:5px;
}
.gnr_social_floating .stButton_gradient{
background:none !important;
height:21px !important;
padding-left:0 !important;
}
.gnr_social_floating .chicklets, .gnr_social_floating .stMainServices {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6VMlH_wPKZuL_ccHjVnLRGeLtd6tlZQ7OgJTOQ7CmL8SidrPaB6cJhu3A1fTwWphW-IIhPgieyBONDbVvoF74DhLQyGVRPXKW8DxQCjKU16waWz9a5SvWqM4ILAE8tbtNTtqKKceyuMfx/s400/gc_social_sprite.gif') no-repeat !important;
height:19px !important;
width:45px !important;
padding:0 !important;
}
.st_email .chicklets{
background-position:0 -77px !important;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6VMlH_wPKZuL_ccHjVnLRGeLtd6tlZQ7OgJTOQ7CmL8SidrPaB6cJhu3A1fTwWphW-IIhPgieyBONDbVvoF74DhLQyGVRPXKW8DxQCjKU16waWz9a5SvWqM4ILAE8tbtNTtqKKceyuMfx/s400/gc_social_sprite.gif') !important;
}
.gnr_social_floating .st_twitter_vcount .st-twitter-counter{
background-position:0 -58px !important;
}
.gnr_social_floating .stButton_gradient{
border:none !important;
}
.gnr_social_floating .stBubble_count{
width:44px !important;
font-size: 15px !important;
font-weight: normal !important;
padding-top:7px !important;
height:23px !important;
background:none !important;
}
.gnr_social_floating .st_twitter_vcount .stBubble_count{
color:#00a6df;
background-color:#f8fbfc !important;
}
.st_fblike_vcount{
margin-bottom: 0px;
display: block;
}
.st_twitter_vcount{
margin-bottom: 3px;
display: block;
}
.st_email{
margin-bottom: 5px; margin-top: 3px;
display: block;
}
.gnr_social_floating .stBubble{
background-position: 21px 31px !important;
height:35px !important;
}.gnr_social_floating .st_pinterest_vcount{
margin-left:5px;
}
.gnr_social_floating .st_pinterest_vcount .st-pinterest-counter{
background-position:0 -19px !important;
}
.gnr_social_floating .st_pinterest_vcount .stBubble_count{
color:#FF0505;
background-color:#fbf8f8 !important;
}
.gnr_social_floating .st_pinterest_vcount .stBubble{
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4Z2KmMd1QNynhVl1vTz2d0K3_FYb7f8LUv8SkSDIPNP9nbzj4LKYPlZWjF5ijoBJcP1FTB2VFJdlYdjlFGgjHJ43GOX7h7V_-58LCMwAj0zIQuQNpJ9M7q9sqniwsdFUYSYdnNEvhtRLB/s400/bubble_arrow_pinterest.png') !important;
}
.st_pinterest_vcount{
margin-bottom: 0px;
display: block;
}
</style>
<div class='gnr_social_floating'>
<script type='text/javascript'>var switchTo5x=true;</script>
<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>
<script type='text/javascript'>stLight.options({onhover:false});</script>
<span class='st_fblike_vcount' displaytext=''/>
<span class='st_twitter_vcount' displaytext='' st_via='DGeneraBlog'/>
<span class='st_pinterest_vcount' displaytext=''/>
<div style='margin:0px 0 0 5px;'>
<span class='st_plusone_vcount' displaytext=''/>
</div>
<div class='addthis_toolbox addthis_default_style ' style='margin:5px 0px 5px 8px;'>
<a class='addthis_counter'/>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/>
<script type='text/javascript'>
var addthis_config = {
ui_cobrand: "D-GENERA BLOG",
ui_header_color: "#ffffff",
ui_header_background: "#0080FF"
}
</script>
<script type='text/javascript'>var addthis_config = {"data_track_addressbar":true};</script>
<script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-5064705719d41eef' type='text/javascript'/>
<span class='st_email' displaytext=''/>
<p style=' line-height:0px; font-size:10px; font-weight:bold; text-align:center;'><a href='http://d-genera.blogspot.com/2013/01/memasang-tombol-share-pinterest.html' style='color:#CAC8C8;'>Widgets</a></p>
</div>
</b:if></b:if>
Keterangan:
position:fixed; bottom:10% : Untuk mengatur tinggi rendah widget.
margin-left:-60px; float:left; : Untuk mengatur jarak kiri kanan windet.
background-color:#f7f7f7; : Untuk mengganti warna background widget.
DGeneraBlog : Gantilah dengan username Twitter Anda.
- Simpan perubahan yang telah Anda lakukan.
Kesimpulan
Widget share melayang ini akan ditampilkan pada halaman posting saja dan tidak akan ditampilkan pada homepage. Widget ini memiliki latar belakang putih dan melayang di sebelah kiri posting blog. Jika Anda ingin membuat widget ini melayang di sebelah kanan maka yang Anda butuhkan adalah mengedit bagian dari kode yang sudah saya tandai. Jika ada tambahan atau koreksi silahkan tulis di kotak komentar yang tersedia.
Salam damai sobat blogger..!! :D
Cara Membackup Daftar Email Pelanggan FeedBurner Anda Dengan Aman
Melanjutkan postingan saya sebelumnya mengenai isu bahwa Google akan menutup layanan FeedBurner pada 2013 ini, maka saya akan memposting bagaimana cara membackup daftar email pelanggan FeedBurner Anda dengan Aman. FeedBurner adalah layanan untuk berlangganan melalui email yang banyak digunakan oleh blogger, kecuali Anda menggunakan layanan premium seperti aweber, kemungkinan bahwa Anda menggunakan FeedBurner juga. Untuk beberapa orang, FeedBurner mungkin segala sesuatu yang mereka butuhkan. Tapi untuk blogger yang lebih canggih di luar sana, beberapa layanan premium tampaknya menawarkan fitur lebih banyak. Dan fakta membuktikan bahwa FeedBurner berada dalam masalah beberapa bulan yang lalu bahwa layanannya tidak berjalan dengan sangat baik. Terserah apapun kasusnya, melakukan backup saya pikir merupakan salah satu ide yang baik. Apakah Anda ingin memindahkan pelanggan Anda ke layanan lain, atau Anda hanya ingin membuat cadangan, Anda hanya perlu untuk men-download daftar pelanggan FeedBurner Anda. Di sini, kami akan memberitahu Anda bagaimana untuk membackup daftar Email Pelanggan FeedBurner Anda.
FeedBurner tidak begitu terkenal karena beberapa alasan. Padahal layanan ini memiliki banyak fitur yang ditawarkan, seperti subscription management, email branding, customizable delivery and communication preferences, serta banyak lagi. Anda dapat melihat dan mengurutkan daftar pelanggan Anda, mengaktifkan/ menonaktifkan dan menghapus email individu, dan menerima email ketika orang berhenti berlangganan. Selain itu, FeedBurner memiliki pilihan ekspor, sehingga Anda dapat mengekspor daftar untuk format excel atau csv.
Download Email Pelanggan FeedBurner Anda
Untuk mendownloadnya, login dulu ke akun FeedBurner Anda. FeedBurner sebelumnya memiliki masalah menampilkan jumlah pelanggan, tetapi tampaknya baik-baik saja bagi kebanyakan orang saat ini. Setelah login, cukup klik pada nama blog yang ingin Anda backup daftar pelanggan Anda.
Anda kemudian akan diarahkan ke dashboard. Klik pada tab Publicize pada dashboard Anda.
Di bawah tab publicize, Anda akan melihat pilihan Email Subscriptions di sidebar kiri. Setelah Anda klik, Anda akan melihat beberapa opsi lebih lanjut. Sekarang klik pada Subscription Management.
Sekarang, Anda dapat melihat jumlah pelanggan email Anda. Ketika Anda pertama kali login ke FeedBurner, apa yang Anda lihat adalah jumlah total dari pelanggan email dan RSS digabungkan. Tapi apa yang Anda butuhkan adalah hanya daftar Email pelanggan bukan daftar pelanggan RSS. Pada halaman Subscription Management, jika Anda gulir ke bawah sampai ke bagian bawah, Anda akan melihat jumlah total Pelanggan Anda, yang hanya menghitung pelanggan email Anda.
Jika Anda klik pada pilihan View Subscriber Details (ditunjukkan pada gambar di atas), akan ada pilihan untuk mengekspor daftar.
Cukup klik pada Export: CSV, dan Anda sudah menyelesaikannya! Anda akan diminta untuk menyimpan file, yang berisi semua email pelanggan Anda. Anda dapat melakukan apa saja dengan file ini, baik menyimpannya di komputer Anda, atau meng-upload ke cloud storage misalnya Dropbox atau yang lainnya.
Sementara itu, jika Anda memiliki pertanyaan, jangan ragu untuk bertanya. Good luck :)








