2011年7月28日に福岡で行われたイベントFutureSyncでのLT資料です。 HTML5をマークアップという側面から見て、これからのマークアップの意味みたいな部分について意見を述べています。

1. マークアップの 夜明け ぜよ ～僕の思うこれからのマークアップ～ Kousuke (seven)Inamoto

4. Tag タグ とは、荷札、付箋といった意味の英単語。 あらかじめ定められた特殊な記法により文書に埋め込む形で記述される付加情報。 地の文とは別のレベルで解釈され 、 付加情報を埋め込む特殊な文字列などのことをタグと言う。

5. タグには“意味”がある

6. HTML ５になって その“意味”が増えた

7. <hx> 見出しであることを表す <p> 段落であることを表す <img> 画像であることを表す <ul> 順不同のリストであることを表す <ol> 順序リストであることを表す <li> リストであることを表す <a> アンカーリンクであることを表す

8. <article> 内容が単体で完結しているセクションを表す <aside> 補足的な説明を表す <nav> Web サイトのナビゲーションリンクを配置するためのセクション <section> 汎用的なセクション <hgroup> 複数の見出しをひとまとまりにする <header> セクションのヘッダ <footer> セクションのフッタ <address> article/body に関する問い合わせ先アドレス

9. <article> <aside> <nav> <section> <hgroup> <header> <footer> <address>

10. <article> <aside> <nav> <section> <hgroup> <header> <footer> <address> “ 見た目の”デザインを マークアップするのではない

11. <article> <aside> <nav> <section> <hgroup> <header> <footer> <address> 文書構造を、情報デザインを マークアップする

12. NO ANSWER

13. S ample

15. <header> <h1> <nav>

16. <section> <header> <section> <div> <div>

17. <footer> <div>

18. NO ANSWER

19. THINK

23. http://developers.facebook.com/docs/opengraph/

24. http://developers.facebook.com/docs/opengraph/ OGP は今後重要

25. http://developers.facebook.com/docs/opengraph/ ですが・・・

26. http://developers.facebook.com/docs/opengraph/ OGP だけじゃあ、だめ

27. HTML ５になって その“意味”が増えた

28. セマンティック Web

29. 2009 年 TED にて “ Linked Data” を提唱 “ これまではウェブに文書を置いていた。 これからはウェブにデータを置いてもらいたい“

30. 人にとってシェアする対象は コンテンツやデータだが、 システムにとってはシェアする対象は ソースコード

31. 考えられたソースコードがコンテンツを導く

32. 本領発揮！ マークアップの夜明けぜよ