Rich snippets : Uji coba data terstruktur website blog

Berawal dari cari tahu error apa saja yang terjadi pada blog saya breakdown-cover-cheap sehingga di-reject Google Adsense (GA). Semua Bad-Link dihapus, begitu juga dengan semua snippet tambahan di template blog blogger tersebut – yang dulu dipasang untuk membantu meningkatkan visitor dan pagerank. Tapi masih saja di-reject GA untuk kedua kalinya September 2011. Setahun kemudian Google Adsense. lagi-lagi menolak. Dalam pencarian tersebut justru saya temukan ini.

Rich snippets testing tool - website-files

Saya temukan error saat cek URL blog dengan fitur baru Google Webmaster Tools - rich snippets testing tool (Alat  Testing Data Terstruktur).

Penjelasan resmi tentang alat ini :

• Gunakan - Rich snippets testing tool untuk memeriksa apakah Google dapat mengurai markup data terstruktur dengan benar dan menampilkannya dalam hasil penelusuran.

Cara penggunaannya, klik link diatas, ketik URL blog, lalu klik PRATINJAU seperti berikut :

Setelah saya membuat komentar dengan reply yang berbeda warna untuk admin, ternyata menyebabkan terjadi ”hcard errors = Missing required field "name (fn)" pada blog.  Hasil analisa blog memunculkan 7 postingan di blog saya Error seperti ini :



Warning: Missing required field di Rich Snippets Testing Tool ini banyak didapati pada blog Blogger, tapi banyak admin blogger tidak ambil pusing. Padahal setiap error seharusnya diatasi karena mempengaruhi kredibilitas blog di hadapan si penentu posisi (Pagerank), yaitu Google.

Jika uji Rich Snippets Testing Tool menghasilkan teks warning berwarna merah Warning : Missing required field "updated" & Warning: Missing required hCard "author" solusinya :

Tambahkan metadata berikut ke file template (HTML)

<div class='vcard' id='hcard- Nama anda'>
<span class='fn n'>
<span class='given-name'>Posted by: nama anda</span>
</span>
</div>
<a class='updated' href=' http://namablog.blogspot.com/ ' rel='bookmark'>namablog,</a> Updated at: <abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr>

Solusi Missing required field updated dan Missing required hCard author

Ikuti tahapan rinci di bawah ini :

Langkah 1
Masuk ke dashboard blogger  >> Desain >> Edit HTML.   Jangan lupa centang 'Expand Template Widget' Untuk amannya disarankan "Download Full Template" dan SAVE  template ke hard-disk.

Langkah kedua

Cari kode di bawah ini :

• <data:post.body/>
  <div style='clear: both;'/><!-- clear for photos floats -->
  </div>
  <b:if cond='data:post.hasJumpLink'>
  <div class='jump-link'>
  <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
  </div>
  </b:if>

Langkah ketiga
Memasukan kode meta data tadi di antara code yang baru saja kita cari di langkah ke-2, sehingga menjadi seperti ini :

<data:post.body/>
<div style='clear: both;'/><!-- clear for photos floats -->
</div>
<div class='vcard' id='hcard- Nama anda’>
<span class='fn n'>
<span class='given-name'>Posted by: Nama anda</span>
</span>
</div>
<a class='updated' href=' http://namablog.blogspot.com/ ' rel='bookmark'>nama blog</a> Updated at: <abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>

Langkah keempat
SAVE dan lihat hasilnya pada test - rich snippets testing tool (Alat Uji Coba Data Terstruktur).

---

Penjelasan

Pada setiap template adanya error tersebut akan berbeda-beda dan tutorial diatas adalah untuk mengatasi error seperti contoh di atas yaitu adanya 3 unsur error;<.div>

1. Error Hcard
2. Error name (fn)
3. Error updated

Jika blog mengalami salah satu error di atas, Anda mengatasinya dengan cara dibawah ini :

1. Untuk error Hcard silahkan cari kode yang mengandung :
   
   <div class='vcard' id='hcard- Nama anda’>
   
   Mungkin setiap template berbeda-beda, jadi fokuskan pencarian pada kode vcard dan Hcard
   
   Jika tidak ada, masukkan code <div class='vcard' id='hcard- Nama anda’> seperti tutorial di atas
   
   
2. Untuk error name (fn) caranya, Anda tinggal cari kode <span class='fn n'> dan jika tidak ada ikuti saja tutorial di atas.
   
   
3. Untuk error updated, silahkan cari kode seperti di bawah ini :
   
   
   <a class='updated' href=' http://namablog.blogspot.com/ ' rel='bookmark'>nama blog</a> Updated at: <abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr> </a>
   
   Pada sebagian template kodenya seperti di bawah ini :
   
   
   <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a>
   
   Jika ada kode seperti diatas, maka cukup mengganti kode timestamp-link dengan updated. Dan yang seperti ini yang paling banyak ditemukan pada blog yang ada sekarang.

Mengapa Tool ini SANGAT PENTING?

Saya menjawabnya dengan praktek seperti di bawah ini :

Masuk ke penggunaan tool dengan klik link ini : Rich snippets testing tool

Silahkan URL blog/web Anda dimasukkan dan lihat hasilnya. Jika Anda menemukan ini :

Maka ini sangat fatal karena blog/web Anda tidak terdeteksi adanya data author dan publisher. Dan ini sangat tidak bersahabat dengan SEO.  Idealnya Anda menemukan hasil seperti di bawah ini :

---

SEMOGA BERMANFAAT

---

SITEMAP

PETA WEBSITE DESIGN

THANK YOU for your continued liking 'n sharing. If you haven't liked this post yet, you may do that by hitting the buttons just BELOW. Please drop your comment and questions ……

Anda sedang membaca Rich snippets : Uji coba data terstruktur website blog

Posted in: HTML-series,Microformats,Script-code,SEO-by-Google,Trick-of-SEO