Mengenal Istilah - Istilah Dalam Blog

Banyak istilah-istilah yang didapatkan dalam dunia blogger, kadang kita asing akan istilah tersebut karena banyak definisi yang dijabarkan oleh para master-master blog. Seperti halnya Kang Fathur yang pertama kali mengenal yang namanya blog. Lah untuk itu semua bagi pemula yang masih ingin memahami istilah istilah yang terkandung dalam blog akan saya paparkan sedikit dalam blog Portal Informasi Online.

Berikut ini yang bisa dipelajari dan mohon diterima walau hanya sedikit yang diulas, sebab memang hal yang berkenaan dengan dunia online sangatlah rumit untuk langsung dipahami.

  • SEO ( Search Engine Optimization )
Dalam dunia online, SEO adalah Suatu teknik yang digunakan pada blog atau website supaya mudah ditemukan pada Search Engine (mesin pencari) dan mendapatkan peringkat yang memuaskan alias terbaik. Teknik ini banyak diulas oleh temen-temen blogger yang lain, atau jika anda ingin lebih mengerti Apa SEO Itu silakan diliat disini.

  • SERP (Search Engine Results Page)
Apa istilah SERP? merupakan sebuah halaman dari hasil pencarian yang ditampilkan oleh search engine, pendek kata bisa juga dikatakan merupakan halaman hasil pencari mesin pencari. Apabila anda ingin mengetahui hasil dari pencari di search engine untuk sebuah halaman blog dengan cara mengetikkang nama domain pada kolom pencarian. seperti contoh site:http://kang-fathur.blogspot.com/

  • Meta Tag
Meta tags merupakan sebuah  kode-kode HTML yang berada di bagian halaman sebuah situs baik itu blog ataupun web. Meta tags yang berbeda akan memiliki fungsi yang berbeda pula, akan tetapi  secara umum semuanya digunakan untuk memberikan informasi tambahan mengenai kondisi sebuah halaman situs kepada robot di mesin pencari.

  • Meta Tags Description
Merupakan sebuah perintah dalam bentuk kode HTML yang terdapat di dalam template situs yang berada pada tiap-tiap halaman-Nya.Meta tag description ini berfungsi untuk menyampaikan ringkasan informasi dari suatu judul halaman posting kepada search engine. dimana ringkasan dari meta tag description akan hanya tampil pada halaman index pencarian.

  • Keywords
Keyword adalah kata kunci penting dalam SEO, agar blog atau web mudah ditemukan sebagai indentitas secara keseluruhan. Keyword ini bisa bersifat spesifik untuk halaman page tertentu dalam situs untuk mencari traffic sebanyak mungkin melalui search engine.

  • Backlink
Backlink dan banyak kalangan blogger menyebut dengan Link Exchange merupakan sesuatu yang penting dalam dunia blogging. Sebab semakin bnyak backlink yang didapatkan akn semkin tinggi kesempatan akan mendapatkan pagerank.

Demikian dulu yang bisa say sampaikan, semoga dn semoga artikel kecil ini berguna bagi anda semua.
Bersambung..........

Tips Membuat Menu Breadcrumbs di Blog

Menu Breadcrumbs banyak kita jumpai pada blog-blog yang didukung wordpress, akan tetapi menu seperti yang ditunjukkan pada gambar dibawah ini merupakan menu navigasi yang dipasang di blogspot. Banyak kalangan yang menyebut Menu Breadcrumbs ini dengan "breadcrumb-navigation”. Dengan adanya “breadcrumb-navigation” maka pengunjung blog anda dapat dengan mudah melihat posisi postingan serta akan membuat penasaran untuk mencari dan melihat artikel dalam satu kategori.

Bahkan ada pula hal pembuatan breadcrumb-navigation menjadi salah satu penunjang SEO Friendly.

Menu Breadcrumbs

Cara membuatnya gak terlalu ribet, seperti ini caranya....
  • Masuk ke akun Blogger Anda;
  • Klik tombol Rancangan dan pilih Edit HTML;
  • Beri Centang Expend Widget;
  • Cari kode ]]></b:skin>
  • Jika ketemu copy paste kode berikut diatas
.breadcrumbs{padding:10px 5px 5px 0;margin: 0 0 5px;font-size:95%;line-height:1.4em;border-bottom:4px double #AFB0B2}
  • Terus scroll kebawah dan cari kode
<div class='post hentry uncustomized-post-template'>
  • Lalu letakkan kode berikut sesudah kode diatas
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187;
<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if>
</b:loop>
</b:if> &#187; <data:post.title/>
</div>
</b:if>
</b:if>
  • Simpan Template
selamat mencoba dan semoga brhasil serta bermanfaat bagi anda semua.

Membuat Tombol Back-To-Top pada Blog

Banyak web ataupun blogger yang yang menyajikan artikel, tutorial, dan informasi-informasi yang panjang dalam tulisannya. Dengan seperti itu, kita kadang males menggerakkan scroll apa mouse untuk kembali lagi ke awal tulisan (kembali keatas). Untuk itu, sebaiknya bagi temen-temen pemilik blog untuk memasnag tombol keatan alias back to top button.

Sebenarnya tutorial seperti ini sudah banyak diketahui bahkan di share kan oleh para webmaster-webmaster, akan tetapi pada tutorial yang akan Kang Fathur bagikan beda dengan pada umumnya. Banyak tombol yang saya jumpai diblog temen-temen langsung menuju keatas saat tombol itu diklik. Lah, yang ini tidak, saat back to top button diklik maka akan tampil seperti gerakan scroll pada mouse. Bisa anda buktikan pada blog ini persis dikiri bawah.

Caranya sangat mudah, tinggal anda memasukkan code javascript pada HTML yang dipasang di widget blog. Dan ini kode yang harus anda masukan pada widget atau gadget blog anda.

<script type="text/javascript" >
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcVKaU9DsA9dKCE3-2gDcKZbNMedcg1SzEg5P-3rl4UueCMOV7ZoywF5k-OKobwMPyTFqhGy1wxHIW_HnuttxOsdx7n-CJrJFF5-j31OYPDd1WvB7IP_QTacTGdtU__3uRHBL1FNqBnOc/" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false},
scrollup:function(){
if (!this.cssfixedsupport) //if control is positioned using JavaScript
this.$control.css({opacity:0}) //hide control immediately after clicking it
var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
dest=jQuery('#'+dest).offset().top
else
dest=0
this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
},
keepfixed:function(){
var $window=jQuery(window)
var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
this.$control.css({left:controlx+'px', top:controly+'px'})
},
togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}
},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all
mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:'Scroll Back to Top'})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')
if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>

Langkah selanjutnya memilih Edit HTML dan cari kode </head> dan copy paste kode dibawah diatas kode </head>

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

Oke semoga artikel kecil ini bermanfaat bagi anda semua. Selamat mencoba...
◄ Newer Post Older Post ►
 

@ 2012 PIO LAB is proudly powered by blogger.com | Design by Portal Informasi Online