Tips Mempercepat Loading Pada Blog

Sangat menjengkelkan bukan? bila kita mengunjungi suatu blog yang loadingnya lama sekali atau Lemot. Biasanya blog yang memiliki loading yang lama terlalu banyak memasang widget, script atau gambar itu penyebab dasarnya.Oke langsung saja kita ke topik pembicaraan yaitu Tips supaya Loading Blog Lebih Cepat dan Tidak Lemot

1. Simpan File Javascript di Google Code

Menyimpan file-file javascript di file hosting milik google akan membantu blog kamu berjalan lebih cepat. Javascript sendiri banyak digunakan untuk efek-efek pada blogger. Entah itu sebagai widget dan lain sebagainya. Kamu bisa membuat akun Google Code kamu sendiri di sini.

2. Singkirkan Kode-Kode yang Tidak Berguna

Menyingkirkan kode-kode yang tidak berguna dari template kamu juga dapat mempercepat loading blog kamu. Jika di template kamu terdapat kode JS, Jquery atau kode CSS yang tidak ada gunanya di blog, Lebih baik singkirkan dari sekarang.

3. Hapus Widget yang Tidak Berguna

Nah ini juga tidak kalah penting, bahkan widget sering kali di "kambing hitam" kan oleh sebagian blogger sebagai penyebab loading blog menjadi lama. Memang memasang widget akan membuat tampilan blog lebih fresh dan berwarna, namun jangan terlalu banyak. Jika terlalu banyak memasang widget, dan membuat blog menjadi lama, kamu akan kehilangan para pengunjung blog kamu.

4. Kurangi Tombol Sosial Media

Sebenarnya penggunaan tombol sosial media sangat penting guna membangun trafik pengunjung dan blog kamu. Namun hindari penggunaan yang terlalu banyak. Sekarang, banyak juga situs-situs yang menyediakan tombol sosial media secara gratis seperti AddThis ataupun ShareThis. Gunakan saja tombol sosial media yang populer seperti Facebook, Twitter, Google Plus ataupun Pinterest. Saya sendiri menggunakan addthis dan loading blog saya tidak terlalu berat :)

5. Jangan Gunakan Plugin Komentar Tambahan

Maksudnya adalah fitur komentar yang asalnya bukan dari blogger. Pasti kamu pernah mendengar InstantDebate, Disqus, atau Fitur Komentar yang asalnya dari Facebook ? Jika blog kamu menginstall plugin-plugin tersebut, itulah juga yang menyebabkan blog kamu berjalan lama. Kalau tidak percaya, coba kamu kunjung blog yang menggunakan fitur komentar dari  blogger dengan yang bukan dari blogger. Mana yang lebih cepat ? 

6. Kurangi Postingan Di Homepage

Mengurangi jumlah postingan di homepager juga dapat meningkatkan kecepatan blog. Batasi jumlah postingan di homepage pada blog. Gunakan fitur readmore pada postingan atau tampilkan saja judul postingan pada blog, maka blog kamu akan berlari wusshhh wuusshhh.

7. Gunakan Template Minimalis

Template yang minimalis akan membuat loading blog lebih cepat dibandingkan blog yang terlalu berwarna. Memang bagus jika blog berwarna terkesan lebih cerah dan tidak kaku, namun jangan terlalu banyak menggunakan warna.

 

Oke sudah dulu ya guys, semoga berhasil dan bermanfaat! terima kasih atas kunjunganya !

8. Kompress Kode CSS dan Javascript

Well, mengecilkan ukuran dari JS dan CSS juga akan membuat blog lebih cepat. Karena browser tidak akan memakan waktu yang terlalu lama dalam proses memuat javascript. Sudah banyak situs dan blog yang menyediakan tools gratis untuk mengkompress Javascript dan CSS. Kamu bisa cari cara dan tools-nya di google.

Cara Menentukan Nama Blog Yang Baik dan Benar

Nama memang belum tentu mencerminkan sebuah kepribadian, tapi paling tidak gambaran kasar kita dapat ketika kita membaca atau mendengar sebuah nama. Seperti juga nama untuk sebuah blog, banyak yang bilang apalah arti sebuah nama, kutipan dari Shakespeare di Romeo and Juliet. Terkadang kita membuat blog tanpa perencanaan yang matang, hanya sekedar ikutan temen.  Hal ini akan menjadikan kita bingung dalam memilih nama blog, kebingungan ini bukan hal yang aneh saat kita akan membuat blog. Dulupun waktu pertama kali saya mau membuat blog juga begitu. Baiklah, di hari Minggu yang penuh dengan hujan deras ini saya akan berbagi sedikit pengalaman tentang cara memilih nama blog yang baik.

Jika Anda punya keinginan untuk menjadikan blog terkenal, maka mulailah dengan memilih nama blog yang baik. Langsung saja, di bawah ini adalah tips untuk anda bagaimana memilih nama yang baik untuk sebuah blog :

1. Nama blog harus dapat menggambarkan blog secara keseluruhan
   
   Anda bisa bayangkan, hanya dengan membaca sebaris kata, pembaca bisa mengerti blog tersebut tentang apa. Potensi terbesar orang akan mengunjungi blog melalui search engineadalah dengan memperhatikan nama blog yang paling relevan dengan artikel yang dicarinya.
2. Buatlah nama blog yang mudah diingat 
   
   Agar mudah diingat, buatlah nama blog yang pendek dan jangan pula terlalu panjang. Nama blog cukup satu kata saja atau dua kata. Jika terlalu panjang akan sulit untuk diingat. Contoh kasus dapat Anda lihat pada beberapa blog yang sudah terkenal di Indonesia. Mereka membuat nama blog yang sederhana namun sangat mudah diingat.
3. Jangan terlalu banyak modifikasi ejaan 
   
   Perhatikan huruf, numerik dan penggunaan notasi-notasi yang tidak perlu. Jangan menggunakan kombinasi huruf dan angka yang membuat bingung pengunjung blog. Mungkin Anda pernah menemukan bog dengan nama yang ada kombinasi huruf, angka, simbol atau notasi-notasi tertentu. Wow, sangat kacau dan tidak baik bagi mesin cari seperti google. Tapi ini menurut saya, bukan bermaksud apa-apa.
4. Nama blog harus sama dengan nama domain 
   
   Banyak saya temui nama domain blog yang sangat berbeda dengan nama blog. Kelihatannya saja sepele, namun nama domain yang sama dengan nama blog akan sangat berarti dalam optimasi mesin cari. Nama blog bisa saja berbeda dengan domain blog namun usahakan masih mirip dan mendekati.
5. Nama blog harus unik 
   
   Misalnya membuat nama blog seperti judul film atau hal-hal yang kontroversial. Saya yakin keunikan ini akan menjadi satu daya tarik tertentu bagi pengunjung. Unik bisa juga berupa nama yang lucu atau seram dan mengerikan. Terserah saja, pokoknya beda dari yang lain.
6. Sisipkan keyword pada nama blog yang menjadi keyword pencarian blog Anda
   
   Tips ini sangat bermanfaat bagi blog yang menargetkan pasar tertentu. Apalagi blog bisnis, maka penyisipan keyword pada nama blog sangat penting. Tujuannya adalah mengpotimalkan search engine pencarian blog Anda melalui keyword tertentu yang sudah Anda targetkan.
7. Nama blog jangan terlalu umum dan jangan pula terlalu menargetkan niche tertentu
   
   Ada untung dan ruginya jika memilih nama yang terlalu umum. Anda akan sangat mudah mencari konten berita untuk blog jika blog Anda memilih topik yang umum namun tidak fokus pada topik tertentu akan membuat pengunjung tidak betah berada di blog Anda. Memilih nama blog dengan topik yang lebih khusus akan lebih baik, namun akan perlu dipertimbangkan siapa yang menjadi target pembaca blog tersebut. Jangan pula nantinya pembaca blog kita malah hanya sedikit karena topik yang terlalu sempit. Anda dapat menggunakan layanan google trend untukmenganalisa nama blog yang akan anda pilih.

Uraian diatas hanya sekedar saran, dan mungkin masih banyak cara memilih nama blog yang bagus. Cara tersebut tidak mutlak harus demikian dan Anda bisa pilih mana yang cocok dan sesuai dengan tipe dan karakter blog Anda. Jika Anda punya pendapat lain yang bisa dibagikan, saya sangat berterimakasih. Sekian tulisan kali ini, semoga bermanfaat dan happy blogging.

Cara Memasang Floating Social Bookmark Dengan Efek Easing di Blog

Buat para blogger mau yang senior ataupun yang masih junior. asti mau dong tampilan blog anda lebih ringkas, simple, tapi keren. dengan memasang Floating social bookmark yang dipinggir layar dan melayang mengikuti halaman. sehingga tidak mengurangi tempat java script diblog. seperti gambar dibawah.

Dengan penambahan jquery, jika Anda meletakkan cursor pada salah satu icon social bookmark, dia akan keluar pelan-pelan, lebih lembut seperti putri Solo yang baru keluar dari keraton, itu karena efek easing yang ada pada jquery-ui.min. Di samping efek easing yang saya tambahkan pada widget ini, juga jenis social media yang saya pasang lebih banyak. 

1. Login ke Blogger
2. Masuk ke Template >> Edit HTML (centang expand widget templates)
3. Letakkan kode CSS di bawah ini diatas ]]></b:skin> :
   
   .social-buttons {
       position: fixed;
       top: 130px;
       width: 45px;
       z-index: 9999;
   }
   .button-left {
       left: 0;
   }
   .button-right {
       right: 0;
   }
   .social-buttons #twitter-btn .social-icon,
   .social-buttons #facebook-btn .social-icon,
   .social-buttons #google-btn .social-icon,
   .social-buttons #rss-btn .social-icon,
   .social-buttons #pinterest-btn .social-icon,
   .social-buttons #youtube-btn .social-icon {
       background-color: #33353B;
       background-image: url(http://1.bp.blogspot.com/-KOzIiYFlBAk/UUmLwwZSs-I/AAAAAAAAAnA/h6G772N3cpI/s1600/mas-icons.png);
   }
   .button-left #facebook-btn span {
       background-position: right 10px;
   }
   .button-left #twitter-btn span {
       background-position: right -35px;
   }
   .button-left #google-btn span {
       background-position: right -127px;
   }
   .button-left #rss-btn span {
       background-position: right -80px;
   }
   .button-left #pinterest-btn span {
       background-position: 11px -177px;
   }
   .button-left #youtube-btn span {
       background-position: 11px -223px;
   }
   .button-right #facebook-btn span {
       background-position: 12px 10px;
   }
   .button-right #twitter-btn span {
       background-position: 11px -35px;
   }
   .button-right #google-btn span {
       background-position: 10px -127px;
   }
   .button-right #rss-btn span {
       background-position: 11px -80px;
   }
   .button-right #pinterest-btn span {
       background-position: 11px -177px;
   }
   .button-right #youtube-btn span {
       background-position: 11px -223px;
   }
   .social-buttons #facebook-btn:hover .social-icon {
       background-color: #3B5998;
   }
   .social-buttons #twitter-btn:hover .social-icon {
       background-color: #62BDB2;
   }
   .social-buttons #google-btn:hover .social-icon {
       background-color: #DB4A39;
   }
   .social-buttons #rss-btn:hover .social-icon {
       background-color: #FF8B0F;
   }
   .social-buttons #pinterest-btn:hover .social-icon {
       background-color: #D43638;
   }
   .social-buttons #youtube-btn:hover .social-icon {
       background-color: #C4302B;
   }
   .social-buttons a:hover .social-text {
       display: block;
   }
   .button-left .social-icon {
       -moz-transition: background-color 0.4s ease-in 0s;
       -webkit-transition: background-color 0.4s ease-in 0s;
       background-repeat: no-repeat;
       display: block;
       float: left;
       height: 43px;
       margin-bottom: 2px;
       width: 43px;
   }
   .button-left .social-text {
       display: none;
       float: right;
       font-size: 1em;
       font-weight: bold;
       margin: 11px 40px 11px 0px;
       white-space: nowrap;
   }
   .button-right .social-icon {
       -moz-transition: background-color 0.4s ease-in 0s;
       -webkit-transition: background-color 0.4s ease-in 0s;
       background-repeat: no-repeat;
       display: block;
       float: right;
       height: 43px;
       margin-bottom: 2px;
       width: 43px;
   }
   .button-right .social-text {
       display: none;
       float: left;
       font-size: 80%;
       font-weight: bold;
       margin: 11px 0 11px 40px;
       white-space: nowrap;
   }
   .social-buttons .social-text {
       color: #FFFFFF;
   }
4. Berikutnya penambahan jquery dan javascript, masih di Edit HTML letakkan kode berikut sebelum</head> :
   

   <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

   <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js' type='text/javascript'/>
   <script>
       $(window).load(function(){
           $(&#39;.social-buttons .social-icon&#39;).mouseenter(function(){
               $(this).stop();
               $(this).animate({width:&#39;160&#39;}, 500, &#39;easeOutBounce&#39;,function(){});
           });
           $(&#39;.social-buttons .social-icon&#39;).mouseleave(function(){
               $(this).stop();
               $(this).animate({width:&#39;43&#39;}, 500, &#39;easeOutBounce&#39;,function(){});
           });
       });
   </script>

   Untuk jquery library warna biru diatas, jika pada template yang Anda gunakan sudah terpasang, ditinggalkan saja.
5. Selanjutnya memanggil widget tersebut, letakkan kode HTML di bawah ini sebelum </body> :
   
   <div class='social-buttons button-right hidden-phone hidden-tablet'>
   <a class='itemsocial' href='https://www.facebook.com/your FB' id='facebook-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Facebook</span></span></a>
   <a class='itemsocial' href='https://twitter.com/your twitter' id='twitter-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Twitter</span></span></a>
   <a class='itemsocial' href='https://plus.google.com/your G+' id='google-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Google</span></span></a>
   <a class='itemsocial' href='http://pinterest.com/your ID' id='pinterest-btn' target='_blank'><span class='social-icon'>
   <span class='social-text'>Follow via Pinterest</span></span></a>
   <a class='itemsocial' href='https://www.youtube.com/user/your ID' id='youtube-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via Youtube</span></span></a>
   <a class='itemsocial' href='http://feeds.feedburner.com/your feed' id='rss-btn' target='_blank'><span class='social-icon'><span class='social-text'>Follow via RSS</span></span></a>
   </div>
   Ganti tulisan warna biru diatas, dengan ID Anda masing-masing jangan sampai keliru dengan ID tetangga.
6. Terakhir, Save Templates

Selesai sudah deh tutorialnya, terima kasih sudah berkunjung dan semoga berhasil yah :)

Cara Membuat Burung Twitter Terbang Di Blog

Twitter Flying Bird merupakan sebuah widget yang bisa digunakan untuk memperindah tampilan blog. Burung Twitter terbang yang disiapkan oleh tutorialblogspot.com, terdiri atas banyak warna, sehingga sobat blogger bisa menyesuaikan warna background blog sobat dengan warna burung Twitter terbang yang akan sobat blogger pasang. Untuk memasang widget yang cantik ini, sobat blogger tidak perlu edit template, yang sobat blogger perlu lakukan adalah memasang kode yang sudah saya siapkan di bawah ini

---

Cara Membuat Burung Twitter Terbang Di Blog

---

• Sign In di blogger.com
• Pada menu drop down, pilih Layout
• Klik Add a gadget dan pilih HTML/JavaScript
• Copy Paste kode kode di bawah ini pada kolom yang tersedia:

<script type="text/javascript" src="http://bloggerpeer.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI_cWcMuMyPTuQSPJwywHmTWadolFhd1CLpd-t6QjYZPbYaw7ruTNyeW-emlCXXYTywTmjUQzn0TtYNs8mejMdlFkMtXhIUHlGEYD8Gr0xMEVbLzi4MB49ve8eaWkll8Fs3OP38RFj3I4/s1600/burung+twitter+terbang.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/2torialBlogspot";
var tweetThisText = "Twitter - UserIDhttp://www.tutorialblogspot.com/";
tripleflapInit();
</script>

• Simpan Widget sobat

Tambahan:

1. Ganti 2torialBlogspot dengan nama akun Twitter sobat
2. Ganti URL http://www.tutorialblogspot.com dengan URL blogger sobat tentunya.

Untuk mengganti warna dari burung Twitter terbang, silahkan ganti yang warna biru dengan URL gambar di bawah ini:

Twitter Flying Bird atau Burung Twitter Terbang Warna Kuning

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKQ3h9KfATSVT4ayxT-ltiNdsKXl9vFDxBK9nVyltVfDTH_bYKouH9zV8BQkB5MJzDB5bcnIRxut7xp9vq2KZwJ73qzCFcPmKLq1kJyAg77c5fHEbuuSSjAO6c-FkRB67l7FJE9RUQ2FI/s1600/yellow+bird.png

Twitter Flying Bird atau Burung Twitter Terbang Warna Hitam

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZcHFeuppPM53pBQoAPKnoaQZ7knHQvETfwJXEmbv4aMimVPKa04V9TJ1Q7OvI47_LhAuSmOCifnT163oRQH9aWUQY8Md2JCISuOXvsmx2gVBqeoQB8vRYHHpmhcgej0oek-Qkv8_ywZk/s1600/black+bird.png

Twitter Flying Bird atau Burung Twitter Terbang Warna Biru

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0OB-SSivBPUKqnws4xVCGAbZHpW8s5hg2Hd4v6k-OtJNcOU05C8JAD_XroKJC6Xh-aQPGSkiKFTEFrXk8f3zlZzkg17vzTTk7JYA9goIYysSSuHlAL9hRkvn9ZioIEcLob22biaFCp7o/s1600/Blue+bird.png

Twitter Flying Bird atau Burung Twitter Terbang Warna Coklat

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4ULR4-SzP-sFBr6yDR0ObMYAZ7OItieQ2G0b1RGH9ZbW94NAnMW9Z4DDzmQtvpkLTKA71OQoteMSCrp2XnUxN6AsS58oBMxx11bMsuOYkTdOb2zUZDEzjG6ihNiXv7-szahdrokmk4iQ/s1600/brown+bird.png

Twitter Flying Bird atau Burung Twitter Terbang Warna Hijau

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhORxmxYMxi2LtSTAaMb3CSKKLzR3z5_VU-_ZiVDBOEMysZa4gMcuEkcdr5KIF0QVhevhncSEi5eW2QqdaSVa2fufLjJ4_CY9eoKDaZLgNnsSJbk0TFNWLMR83pJv_Zu4kdE3FjlH9fkyY/s1600/Green+bird.png

Twitter Flying Bird atau Burung Twitter Terbang Warna Ungu

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIA0bE9pU2IvKYPBIWdUCnYI7Vc3wdhs2gPgTXr19ho6bckPtQ6QBtLHjBmG1KuNZv03EdqCD4S3MP6Twz7DqBwH1KDeIdIUg2cs0vKoeYzmrwYgHstTnJO0DVHdYRujbduG6moGBFtN8/s1600/purple+bird.png

Twitter Flying Bird atau Burung Twitter Terbang Warna Putih

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg1mlpF57lMKAvdNzNIMs-ITyIp510e95iVDjbh8w9cSxJn0GJGpMRDIrpWdN42Rm6BXtVSRIdOCoPaVV0BlPiqXA506c5xvpPjZwokiA_qsTIKP7Hfhz4EB_NsKeKBzA6CwjR9tw-u-U/s1600/white+bird.png

Twitter Flying Bird atau Burung Twitter Terbang Warna Merah

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmBqbQPMuP8ymkw2kg5wwA_yDaOAA7U6AB131PJy0WjHWmjTMmqOzK_7Dug_iFvD0lhy_SQxrOxqnuZswfvk10dS8JsU9myBQoKl7qHYiAHE6ooWgClHUejMMI3_3bRwhXHr0BzM0fGmQ/s1600/red+bird.png

Happy Blogging dan semoga sukses dengan Blognya :)