HTML5勉強会 ライトニングトーク用の資料です。

1. オレオレ拡張はやめて、
マイクロデータ
使って行きましょう!
Social Tipping Platform
http://growbutton.com
Grow! inc. Jun Takeno

2. これからボタン業界の話をします
様々なソーシャルボタンたち。。。

3. likeボタン xhtmlの時代
Likeボタンのソースって？
<fb:like href="http://growbutton.com"
send="true" width="450" show_faces="true"></
fb:like>

4. likeボタン html5対応版
Likeボタンのソースって？ (Custom Data Attribute)
<div class="fb-like" data-href="http://
growbutton.com" data-send="true" data-
width="450" data-show-faces="true"></div>

5. ちなみにTweetボタン
Tweetボタン Custom Data Attribute
<a href="https://twitter.com/share" class="twitter-share-button" data-
url="http://growbutton.com/yamitake" data-text="Grow! Me!" data-
via="GrowBt" data-related="yamitake" data-hashtags="GrowBt">Tweet</a>

6. ？
これって結局
オレオレ拡張じゃない？
Custom Attribute使ってたら、結局変わらないよね？

7. Grow!ボタン
➡こっちの方が良いよね。
<span itemscope itemref="rectangle" itemtype="http://
growbutton.com/ns#button">
<span itemprop="url">[URL]</span>
<span itemprop="title">[Title]</span>
<span itemprop="image">[Image]</span>
</span>

8. マイクロデータのメリット
1.検索エンジンにmetaデータを拾ってもらえる。
2.１ページ内に複数のデータを定義できる。
1.Open Graphだと単一な物になってしまう。
2.html metaデータも同様
3.みんなが統一するとみんな幸せ。

9. Google +1 ボタンはちゃんとしてるよ！
1.マイクロデータを参照(google推奨)
2.Open Graphを使用する
3.htmlのmetaタグ
4.googleにお任せ

10. Grow!ボタンの宣伝!
※Grow!社はweb標準を推奨します.
http://yamitake.github.com/

11. Grow!は既に800万コンテンツを
マイクロデータでmeta化してきました。
これってすごくないですか？
マイクロデータ使って行きましょう!
Social Tipping Platform
http://growbutton.com
THANK YOU FOR YOUR KIND ATTENTION.