Apr 9, 2012

Manakah Meta Tag yang Benar-benar SEO Friendly?

meta tag untuk seo blog

Saat blogwalking hampir setiap blog kita temui artikel yang membahas tentang tata cara membuat dan memasang meta tag keyword ataupun meta tag deskripsi blog. Masing-masing penulis blog memaparkan bagaimana cara memasang meta tag yang benar-benar ramah search engine alias seo friendly. Baik itu berdasarkan pengalaman sendiri (blogger yang profesional) maupun blogger yang ikut-ikutan alias copas artikel tanpa menganalisis kontennya (contoh ; saya) hehehe. Saya sendiri terkadang bingung mau memakai yang mana, yang akhirnya semua dicoba, malah hancur jadinya alias meta tag terduplikasi.

Nah, pada kesempatan ini saya akan berbagi meta tag yang dipakai Super Gaptek beserta penjelasannya Siapa tahu ada sobat blogger yang lain mau ikut mencontoh meta tag ini. Dan saya ingin sobat yang lebih paham mengenai meta tag penujang seo blog bisa memberikan masukan dan komentarnya, kira-kira apakah meta tag yang saya pakai ini bagus untuk seo blog.


<head>

<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
 <b:if cond='data:blog.isMobile'>
      <meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
    <b:else/>
      <meta content='width=1100' name='viewport'/>
    </b:if>
<b:include data='blog' name='all-head-content'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/> | Cara Membuat Blog Tips SEO dan Membuat Widget</title>
<b:else/>
<title><data:blog.pageName/> | Belajar Ngeblog</title>
</b:if>

<meta content='Panduan Cara Membuat Blog Gratis Tips Trik Blogger Blogspot Tools Tips SEO dan Modifikasi Widget' name='description'/>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
  <meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>
<meta content='TiIp6ySW23o-RV9pvN8hlDG6oLRqTZvthyaSuFHOBEc' name='google-site-verification'/>
<meta content='index,follow,snipet' name='googlebot'/>
<meta content='3 days' name='revisit-after'/>
<meta content='842002FC0A683BE4CIUB610D73D01A58' name='msvalidate.01'/>
<meta content='NUmrQ_sjhe78YkKoNbwtrYUTxKI' name='alexaVerifyID'/>
<meta content='ALL' name='WEBCRAWLERS'/>
<meta content='document' name='resource-type'/>
<meta content='global' name='distribution'/>
<meta content='id' http-equiv='Content-Language'/>
<meta content='id' name='geo.country'/>
<meta content='Indonesia' name='geo.placename'/>
<meta content='never' name='expires'/>
<meta content='julak' name='author'/>
<meta content='general' name='rating'/>
<meta content='global' name='target'/>
<meta content='ALL' name='spiders'/>
<meta content='Blogger' name='publisher'/>

 Penjelasan:

1. kode merah adalah meta tag bawaan blogger, menurut saya ini penting, karena berpengaruh terhadap tampilan blog di internet explorer dan versi mobile.
2. Kode berwarna biru adalah meta tag deskripsi setelah nama blog dan nama blog, ini berpengaruh terhadap tampilan di search engine google, dimana tampilannya akan seperti gambar di bawah.

meta tag deskripsi blog


3. Kode berwarna hijau adalah meta tag fitur terbaru blogspot, yaitu meta tag yang harus di masukkan jika ingin meta tag deskripsi blog / homepage dan meta tag postingan blog terindeks google.

4. Sedangkan kode biru muda terakhir adalah adalah meta content tambahan, yang juga cukup penting, seperti contoh code meta google site verification yang tujuannya agar blog kita terverifikasi oleh google webmaster tools, begitu juga dengan kode,
<meta content='842002FC0A683BE4CIUB610D73D01A58' name='msvalidate.01'/>  
yaitu kode verifikasi bing webmaster tools. dan kode claim widget alexa rank  
( <meta content='NUmrQ_sjhe78YkKoNbwtrYUTxKI' name='alexaVerifyID'/> )


Nah sobat jika ada kekurangan mohon bantuannya berbagi informasi, oh ya mengapa saya tidak memasang meta tag keyword, alasan saya cukup simpel ; Buat saya seluruh isi artikel postingan blog adalah kata kunci alias keyword.


Apr 7, 2012

Cara membuat Kotak Like Facebook Page Menempel di Sisi Blog

 cara membuat kotak like halaman facebook disisi blog yang bisa keluar masuk blogbelajar2.blogspot.comKotak Like facebook page ini cukup keren dan cukup unik, karena facebook page atau halaman facebook akan muncul jika kursor pointer di arahkan ke kotak atau tulisan facebooknya, dan akan menutup kembali jika kursor mouse di arahkan ke tempat lain. Memang sudah banyak yang memakai widget ini, namun tidak ada salahnya jika saya kembali menuliskan artikel tentang cara bagaimana membuat widget facebook likebox yang menempel di sisi blog ini, siapa tahu ada sobat blogger yang belum tahu dan ingin membuat widget seperti ini.

Widget ini menurut saya sangat cocok diterapkan pada blog yang banyak widgetnya di sidebar. Sehingga tidak begitu banyak memakan tempat. Dari segi estetika keindahan tampilan blog juga cukup bagus. Cara memasangnya juga cukup mudah karena tidak perlu masuk ke edit HTML, hanya tinggal menambahkan gadget di sidebar.

Untuk live demonya bisa sobat lihat di sini
Oke langsung saja kita ikuti tutorial cara membuat kotak like facebook page menempel di sisi blog.

1. Masuk ke akun blogger > Rancangan > Tambah Gadget > pilih HTML/Javascript.
    copy paste kode di bawah ini:



 2. Klik Pratinjau, lalu simpan template. Selesai.

Catatan:
Silahkan ganti kata caramembuatblogspot dengan username halaman facebook sobat sendiri. Untuk mengetahui cara merubah username halaman facebook silakan buka artikel cara mengganti username akun facebook.

Nah bagaimana... sudah jadi khan... hehehe, Happy Blogging !!! 

Cara Merubah Username Halaman Facebook dengan Nama

Artikel ini tentunya ditujukan buat sobat blogger yang memiliki akun halaman facebook sendiri. Tujuannya adalah agar akun atau nama halaman facebook tersebut mudah diingat dan menjadi lebih singkat, karena sebelumnya facebook masih memakai kode-kode angka pada url halaman facebook. Sebetulnya hal ini (mengganti angka tersebut dengan nama sendiri) sudah lama, namun baru sempat saya posting.

Mungkin sobat pernah melihat akun facebook pribadi misalnya dengan alamat url seperti ini;
http://www.facebook.com/profile.php?id=100002897277563
Kemudian bandingkan dengan akun facebook yang usernamenya sudah diganti dengan nama sendiri seperti ini.

http://www.facebook.com/eyangsubur

Atau pula url  halaman facebook seperti ini;

http://www.facebook.com/pages/Pantai-Cinta/184781151612669
bandingkan dengan halaman facebook dengan url di bawah;

http://www.facebook.com/caramembuatblogspot
Bagaimana, sobat tentu tau perbedaannya, ya lebih singkat dan pastinya lebih mudah diingat. Mengapa mengganti url atau username halaman facebook perlu dilakukan, karena banyak widget-widget yang menggunakan atau yang terkait dengan halaman facebook nantinya menggunakan username atau kata terakhir tersebut dan tidak lagi memakai angka-angka yang jumlahnya sampai 12 digit tersebut.

Oke langsung saja ya sahabat blogger kita ikuti caranya.
1. Masuk / Login  ke akun facebook sobat, kemudian buka halaman facebook sobat.
2. Masuk ke http://facebook.com/username.
3. Klik Pada arah yang bertanda panah (halaman), kemudian pilih halaman yang dikehendaki, jika sobat memiliki lebih dari satu facebook page.
4. Klik Periksa Ketersediaan.

 cara mengganti username facebook agar lebih singkat

5. Masukkan username/nama pengguna yang dikehendaki pada form yang ada.
6. Klik Oke. Selesai.

Lihat perubahannya, url halaman facebook sobat tidak ada kode dengan angka, namun langsung username. Oh ya cara ini juga bisa untuk menyingkat username akun facebook pribadi. Selamat Mencoba.

Apr 6, 2012

Cara Membuat Related Posts / Artikel Terkait dengan Tampilan Gambar

Related Post atau sering juga kita sebut artikel terkait adalah artikel yang berhubungan dengan postingan yang sedang dibuka/dibaca. Artikel terkait yang ditampilkan adalah artikel yang sama-sama dalam satu label/kategori. Artikel terkait penting untuk SEO dan menambah kunjungan ke blog kita. Tentunya agar pembaca tertarik untuk membacanya kita perlu menghiasnya dengan tambahan gambar. Belum lengkap rasanya jika widget yang satu ini tidak disertakan dalam blog kita.

artikel terkait dengan tampilan gambar di bawah postingan blog


Pada kesempatan yang lalu saya pernah membuat artikel tentang tata cara membuat artikel terkait dengan tampilan teks biasa alias tanpa gambar. Nah sekarang saya akan membuat artikel terkait dengan tambahan gambar / thumbnail.

Memang banyak teknik-teknik cara membuat artikel terkait dengan gambar, salah satunya ialah dengan linkwithin yang cukup terkenal itu di kalangan blogger. Namun tak ada salahnya jika kita mencoba teknik yang satu ini.

Oke langsung saja kita buat tutorialnya
1. Masuk ke akun blogger > Menu Template> Edit HTML.
2. Centang expland template widget.
3. Cari kode di bawah ini  (tekan CTRL+F untuk memudahkan pencarian)
</head>
4. Masukkan kode di bawah ini  tepat di atas / sebelum kode </head> tadi.

Sobat blogger bisa mengganti kode berwarna merah di atas; a. angka 5 jumlah postingan yang ingin ditampilkan b. "artikel terkait" dengan kalimat yang dikehendaki  5. Kemudian cari kode seperti berikut:
<div class='post-footer-line post-footer-line-1'>
atau kode seperti ini
<div class='post-footer-line post-footer-line-1'> </div>
atau kode seperti ini
<p class='post-footer-line post-footer-line-1'>
6. Masukkan kode dibawah ini, tepat dibawah kode-kode di atas tadi (pilih salah satu).


7. Terakhir, klik pratinjau, lalu save template. Selesai. Dan widget artikel terkait dengan tampilan gambar di bawah postingan blog sudah jadi. Untuk melihat live demonya silakan sobat buka di sini.

Oke, bagaimana sobat, saya yakin ini adalah sesuatu yang sangat mudah dilakukan, jika belum bisa teruslah mencoba, karena semua keberhasilan tentunya diawali dengan sebuah percobaan.

Apr 5, 2012

Cara Membuat Recent Comment dengan Avatar Image Unik

Buat sobat blogger yang ingin menampilkan komentar terakhir di blognya bisa mencoba widget yang satu ini. menurut saya widget recent comments ini cukup unik karena juga menampilkan avatar image. Sobat blogger bisa melihat tampilannya seperti pada gambar di bawah.



recent comments with avatar image


 Caranya....? Masuk ke akun blogger > tata letak > add gadget> HTML/Javascript
Setelah itu tinggal masukkan saja kode widget recent comments dibawah ini;




Terakhir pratinjau, lalu simpan template.

Modifikasi;

1.  angka 5 (warna biru adalah jumlah komentar terakhir yang ingin ditampilkan)
2.  angka 60 dan 40 adalah ukuran image avatar komentar postingan blog.
3.  Silahkan mencoba bereksperimen sendiri untuk hal-hal lainnya, cobalah.
4.  Ganti http://www.super-gaptek.com dengan nama blog sobat

Demikian cara membuat widget recent comment dengan avatar atau komentar terakhir di blog. Silakan jika sobat mau mencobanya.


Apr 1, 2012

Cara Menambahkan Meta Deskripsi Blogger Versi Terbaru

Mungkin sebagian sobat blogger sudah ada yang tahu mengenai fitur ini, dimana blogger/blogspot telah menambahkan fitur terbarunya yaitu teknik atau cara terbaru dalam memasang atau menambahkan meta deskripsi pada pada blog, jadi kita tidak perlu repot-repot lagi membuat meta deskripsi dengan mengedit template, atau masuk pada edit HTML pada menu Design / Rancangan.

Meta deskripsi adalah sesuatu yang penting dalam menggambarkan isi atau deskripsi suatu blog ataupun juga isi sebuah halaman posting. Saya yakin sebagian besar blogger suka menautkan sesuatu ke jejaring sosial tertentu, namun terkadang deskripsi sebuah blog di tautkan ke facebook (homepage) dan postingan blog tidak muncul. disinilah fungsi dari sebuah sebuah meta deskripsi yaitu memunculkan deskripsi suatu blog atau postingan blog jika kita menautkannya pada jejaring sosial tertentu. Selain fungsi itu adalah agar muncul deskripsi di halaman pencarian search engine.

Seperti sudah saya kemukakan di atas, ini adalah fitur terbaru blogger, dimana bagi seorang blogger pemula sangat mudah menggunakan fitur terbaru ini. Ada dua macam meta tag deskripsi yang akan saya berikan tutorialnya kali ini; yang pertama adalah menambahkan meta deskripsi blog / homepage dan yang kedua menambahkan meta deskripsi tiap halaman posting atau individual post blog. Disini saya menggunakan tampilan baru dasbor blogger.

Oke langsung saja kita garap.

A. Menambahkan meta deskripsi pada homepage blogger.

 

Masuk ke akun blogger Dasbor > Klik Setelan/Setting > Preferensi Penelusuran/ Search preferences > Meta tags (lihat dibagian atas) > Description/uraian > Klik link Edit > pilih Yes

memasang meta tag deskripsi blog

Silakan masukkan deskripsi blog sobat pada form yang tersedia. lalu save changes / simpan perubahan. 

B. Menambahkan meta deskripsi tiap halaman postingan blog dan static page.

 

1. Masuk ke menu Post > pilih postingan blog yang akan di edit.
2. Klik Setelan entri / search Description (lihat di sebelah kanan) > Uraian Penelusuran.

cara memasukkan dan memasang meta tag deskripsi setiap halaman posting

3. Masukkan deskripsi postingan blog sobat pada kotak yang tersedia. Kemudian simpan.

Ingat, untuk postingan lama, sobat harus mengedit postingan secara manual.

 

Catatan : 

1. Fitur ini hanya bisa difungsikan jika kita memakai / upgrade ke dashboard blogger tampilan baru
2. Untuk mengetahui meta tag sudah berfungsi atau tidak, sobat bisa mengeceknya di meta tag checker atau masuk ke sini

3. Jika belum, silahkan tambahkan kode berikut di bawah kode <head>

<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>  
     atau di atas kode <b:skin><![CDATA[

Lihat perubahannya pada gbr dibawah.

meta tag deskripsi blog versi terbaru
Homepage blog di tautkan ke FB dengan meta deskripsi

cara membuat dan memasang meta tag deskripsi keyword setiap postingan blog
tautan Postingan blog setelah menggunakan meta tag deskripsi


Demikian tutorial bagaimana cara membuat dan memasang meta tag deskripsi blog dan setiap postingan blog. Oke rasanya cukup mudah, tinggal sobat praktekkan saja, Selamat Mencoba. 


Mar 29, 2012

Cara Membuat Share Button Like, Tweet, Google +1 Melayang di Sisi Kiri Blog

Lagi-lagi "Tombol Berbagi", hehehe, Yups, Mengapa saya suka banget posting artikel seperti ini sama sobat, karena tombol bagikan seperti like facebook dan tweet cukup ampuh dalam mendongkrak popularitas dan kunjungan ke blog kita. Apalagi buat newbie blogger, takutnya keseleo belajar SEO, hehehe.

tombol share button like facebook twitter google plus di sisi blog
 
Langsung Saja ya....
Masuk ke akun Blogger >  Tata letak > Tambah Gadget > HTML/Javascript, kemudian masukkan kode di bawah ini;


Sobat bisa membuang kode yang berwarna merah jika mau. Untuk demonya silakan lihat di sini