HTML5微数据

1 <div>
2   我的名字是王富强，但大家叫我小强。我的个人首页是：
3   <a href="http://www.example.com">www.example.com</a>
4   我住在上海市富贵新村。我是工程师，目前在财富科技公司上班。
5 </div>

1 <div itemscope itemtype="http://data-vocabulary.org/Person">
2   我的名字是<span itemprop="name">王富强</span>，
3   但大家叫我<span itemprop="nickname">小强</span>。
4   我的个人首页是：
5   <a href="http://www.example.com" itemprop="url">www.example.com</a>
6   我住在上海市富贵新村。我是<span itemprop="title">工程师</span>，
7   目前在<span itemprop="affiliation">财富科技公司</span>上班。
8 </div>

1 <p itemscope>下周我要去<span itemprop="name">韩红刚</span>家拔萝卜</p>

1 <p itemscope><time itemprop="date" datetime="2011-12-05">下周</time>我要去 <a itemprop="url" href="http://weibo.com/u/2499612703">韩红刚</a>家拔萝卜</p>

1 <p itemscope><time itemprop="date" datetime="2011-12-05">下周</time>我要去 <a itemprop="url" href="http://weibo.com/u/2499612703"><span itemprop="name">韩红刚</span></a>家拔萝卜</p>

1 <p itemscope><span itemprop="name">五月天</span>主唱是<span itemprop="members"
2   itemscope><span itemprop="name">阿信</span>。</span></p>

1 <span itemprop="members" itemscope>前S˙H˙E 的成员是
2   <span itemprop="name">任家萱</span>，
3   <span itemprop="name">田馥甄</span>和
4   <span itemprop="name">陈嘉桦</span>.</span>

1 <p itemscope><span itemprop="name call">志玲姐</span>
2  是个美女。</p>

1 <p itemscope itemref="band-members">后天我要去看<span itemprop="name">
2 S˙H˙E</span>的演唱会，好兴奋哈！</p>
3 ……
4 <span id="band-members" itemprop="members" itemscope>S˙H˙E 的成员是
5   <span itemprop="name">任家萱</span>，
6   <span itemprop="name">田馥甄</span>和
7   <span itemprop="name">陈嘉桦</span>.</span>

1 <p itemscope><span itemprop="name" itemscope>
2    钟欣桐<meta itemprop="likes" content="twins成员">
3   </span>摄影爱好者陈老师的粉丝。</p>

1 <p itemscope><span itemprop="name" itemscope itemref="meta-likes">
2    钟欣桐<meta id="meta-likes" itemprop="likes" content="twins成员">
3   </span>摄影爱好者陈老师的粉丝。</p>

1 <p itemscope itemtype="http://schema.org/MusicGroup">后天我要去看<span itemprop="name">
2 S˙H˙E</span>的演唱会，好兴奋哈！</p>

1 <p itemscope itemtype="http://vocab.example.com/book"
2   itemid="urn:isbn:0321687299">
3   <!-- 书信息… -->
4 </p>

 1 <section>
 2   <h3><a href="http://atnd.org/events/5181" title="WDE-ex Vol11『iPad
 3   のウェブデザイン：私たちがみつけたこと 』 : ATND">WDE-ex Vol.11 — Designing
 4   for iPad: Our experience so far</a></h3>
 5   <p>On <time datetime="2010-07-21T19:00:00+09:00">July 21st 19:00
 6   </time>-<time datetime="2010-07-21T20:00:00+09:00">20:00</time> at
 7   <span itemscope itemtype="http://schema.org/Organization">
 8   <a itemprop="url" href="http://www.apple.com/jp/retail/ginza/map/">
 9   <span itemprop="name">Apple Ginza</span></a></span>,
10   <span itemscope itemtype="http://schema.org/Person">
11   <a itemprop="url" href="http://informationarchitects.jp/" title="iA">
12   <span itemprop="name">Oliver Reichenstein</span>, CEO of iA</a>
13   </span>, will share the lessons they‘ve learned while creating three
14   iPad apps and one iPad website.</p>
15 </section>

 1 {
 2   "items": [
 3     {
 4       "type": [
 5         "http://schema.org/Organization"
 6       ],
 7       "properties": {
 8         "url": [
 9           "http://www.apple.com/jp/retail/ginza/map/"
10         ],
11         "name": [
12           "Apple Ginza"
13         ]
14       }
15     },
16     {
17       "type": [
18         "http://schema.org/Person"
19       ],
20       "properties": {
21         "url": [
22           "http://informationarchitects.jp/"
23         ],
24         "name": [
25           "Oliver Reichenstein"
26         ]
27       }
28     }
29   ]
30 }