SKIP TO MAIN CONTENT
tina-andrew.blogpot.com blog uses cookies to help google service, personalise ads, and more. By visiting us you agree with our privacy policy. For more information: Cookies Policy | Privacy Policy

Tips Ngeblog Blogger Blogspot

Belajar Microdata Schema Bagi Pemula ~ Rich Snippet

English Version Post of  http://tina-andrew.blogspot.com/2014/03/learn-microdata-schema-for-beginner.html based on requests emailed to me.-

Mengenal Microdata Schema

Setelah mempelajari apa itu skema Microdata dan menerapkannya dalam blog saya sendiri,
Sudah waktunya untuk berbagi kepada Anda semua yang saya tahu tentang hal itu. Hal pertama setelah memahami sedikit mengenai Microdata Schema adalah menerapkannya dalam script HTML5 saya sendiri, di blog saya sendiri, yaitu: tina-andrew.blogspot.com. Saya tidak bermaksud bahwa ini pengetesan saja. Saya selalu pergi serius melakukan sesuatu. Saya suka melakukan hal ini karena ini adalah "the current edge of technology" yang  dirancang oleh programmer yang berkualitas dan terkenal dan developer. Microdata skema adalah aturan penulisan naskah HTML - Ini adalah usulan untuk markup semantik di HTML - lebih lanjut, "Microdata adalah spesifikasi HTML WHATWG digunakan untuk metadata dalam konten yang ada pada halaman web. search engine, web crawler, dan browser dapat mengekstrak dan proses Microdata dari halaman web dan menggunakannya untuk memberikan pengalaman jelajah yang lebih bagi pengguna". (taken from: wikipedia). Microdata HTML dimulai dari menentukan apa jenis itemtype yang akan digunakan berdasarkan topik blog dan deskripsi blog. Dengan kata lain, ItemType mengacu pada jenis, atau apa jenis blog milik Anda. Ketika blog anda tentang artikel maka Anda dapat menulis sebagai berikut:-


<div itemscope=""itemtype="http: //schema. org /Article">


Ada banyak itemtypes yang dapat digunakan dalam menandai naskah HTML5 Anda. Ini semua ada dan tersimpan di schema.org yang beberapa dari itemtype akan dibahas dalam halaman ini.

Untuk Blogspot, ada 3 jenis itemtype Anda dapat memilih :
1. Blog itemtype> schema. org/Blog
Misalnya:
<div itemscope=""itemtype="http ://schema. org /Blog">
(jenis ini dipilih oleh blog ini)

2. Blogposting> schema. org/BlogPosting
Misalnya:
<div itemscope="" itemtype="http: //schema. org/BlogPosting">


3. Article> schema. org/Artikel
Misalnya:

<div itemscope="" itemtype="http: //schema. org/Article">


Banyak sumber yang saya dapatkan bahwa lebih baik memilih itemtype yang lebih spesifik, misalnya, itemtype BlogPosting. bukan Article atau Blog karena properti dari ketiga itemtype ini mendukung semua kebutuhan blogspot didalam memperkaya Snippet Blogspot. Jika Anda menggunakan wordpress, Anda dapat memilih itemtype Article, misalnya, itemtype WebPage.
Misalnya:


<div itemscope=""itemtype="http ://schema. org/WebPage">
.

Bagaimana Markup Microdata Skema ke Blogspot Anda

Pertama, Anda harus membersihkan skrip HTML Blogspot Anda dengan mengganti beberapa script asli (Perhatikan bahwa tindakan ini adalah sah dan legal - yang berarti bahwa Blogspot memberi kita sepenuhnya dan memberikan untuk itu dan itu adalah legal untuk memodifikasi Blogspot Anda HTML Script - jadi, tidak perlu khawatir).

Langkah-langkah berikut ini adalah bagaimana untuk membersihkan HTML5 Blogspot anda:-

a) Jenis HTML Anda harus dalam HTML5 tag,
misalnya <!DOCTYPE html>
b) Dalam tag <head>, Anda harus menggantinya
&lt;head&gt;

serta tag </head> tertutup, dari </head> menjadi:
  &lt;/head&gt;&lt;!--
  <head/>
  --&gt;


c) Setelah tag <head> terbuka, ganti skin menjadi: -
<b:skin> <![CDATA[
]]></b:skin>


d) Hapus semua skin di bawah script dalam butir (c) di atas. Biasanya berisi script sebagai berikut ini:-
<![CDATA[/* ------------------------------------------- ----
Blogger Template Style
Nama: Picture Window
Designer : Josh Peterson
----------------------------------------------- *// * Variable definitions
   ====================
   <Variable Name="keycolor"description="Main Color"type="color"default="#1a222a"value="#1a222a"/>
   < Nama Variabel = "body. background "description = "Tubuh Background"type = "background "color = "$ (body. background. color) "default = "# 111111 url(// themes. googleusercontent. com/image?id=1OACCYOE0-eoTRTfsBuX1NMN9nz599ufI1Jh0CggPFA_sK80AGkIr8pLtYRpNUKPmwtEa) repeat- x fixed tengah atas "value = "# 111111 url( //themes. googleusercontent. com /image?id=1OACCYOE0-eoTRTfsBuX1NMN9nz599ufI1Jh0CggPFA_sK80AGkIr8pLtYRpNUKPmwtEa) tengah atas mengulang - x fixed "/>..................... ---- Sebelum tanda :
*/.


e) Tambahkan ini mengikuti jenis gaya di bawah tag </head> tertutup:-
<style type="text/css">
dan, tambahkan berikut ini tag gaya tertutup sebelum tag </head> tertutup:-
</style>

Akhirnya, itu semua harus seperti berikut ini:-
<HTML dir='ltr' lang='en' xml:lang='en' xmlns='http:// www. w3. org /1999/xhtml'>
&lt;head&gt;
<meta charset='UTF-8'/>

.......
  &lt;/head&gt;&lt;!--
  <head/>
  --&gt;

<style type="text/css">
......................-css-code-goes-here-..................

</style>
<body>

......................-body-code-goes-here-..................
</body>
</HTML>


Sebelum mulai menambahkan script skema microdata, hal yang paling penting yang harus Anda ketahui adalah bahwa Microdata skema dalam case-sensitive. Anda kemudian harus berhati-hati untuk menulis naskah untuk menghindari kesalahan fatal.

"Terus, sekarang gimana? " :D
Okay, itu adalah script paling sederhana di dunia dan saya harap Anda menikmati markup Blogspot Anda HTML Script dengan Microdata skema sejak Google, Msn dan Yahoo telah berkumpul dan menyatakan bahwa schema.org adalah pusat dari semua keputusan dalam kaitannya dengan jenis microdata.

Pertama yang harus Anda lakukan untuk markup microdata skema adalah menambahkan script berikut ini menjadi open tag <body> Anda.

Sebagai contoh:

<body itemscope=""itemtype="http: // schema. org/Blog">
.

Script tersebut memiliki makna untuk menginformasikan crawler atau mesin pencari bahwa semua dalam tag <body> adalah script microdata skema.

Tidak apa-apa jika Anda memisahkan script ke tag <div>.
Sebagai contoh:


<body>
<div itemscope="" itemtype="http :// schema. org/Blog">
............
</div>
</body>


Di dalam tag <body> atau tag <div>, Anda dapat mengganti beberapa itemtype ke Microdata skema seperti yang Anda inginkan, misalnya, Author jenis, Alamat, dll. Untuk keterangan lebih lanjut, Anda dapat mengunjungi untuk schema.org.

Gunakan rentang tag <span> dan <itemprop> antara div atau p tag terbuka dan tertutup.

Sebagai contoh:


<div itemscope="" itemtype="http: // schema. org/ Person">
Author: <span itemprop="name">Herman Bin Nasarudin</span><br/>
Author in Google+ <span itemprop="url"><a href="https://plus.google.com/103914706589632755932">Author on Google+</a></span>
</div>


Demonya adalah sebagai berikut :

Author : Herman Bin Nasarudin
Penulis di Google+

Perhatikan bahwa ketika Anda menulis Itemscope di Blogspot, harus menambahkan tanda sebagai berikut untuk menghindari error:-

itemscope = ""
(dengan tanda = dan tanda petik dua) dan tanpa itu bisa bila anda menggunakannya dalam halaman web.
Bila tidak, ini akan menjadi kesalahan jika Anda hanya ketik : itemscope tanpa = ""

Herman Bin Nasarudin in Google+
Google+ Profile
Google+ Page

Newer Post Lihat Tips & Tutorial Sebelumnya
Back to Homepage

Popular Posts