全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版
-
Upload
seikei-university -
Category
Technology
-
view
1.475 -
download
0
Transcript of 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版
![Page 1: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/1.jpg)
全てのエンジニアのための Web標準技術とのつきあい方
2011年12月3日 W3C/Keio
慶應義塾大学大学院 政策・メディア研究科
特任助教 深見嘉明
@rhys_no1
オープンソースカンファレンス2011Fukuoka
![Page 2: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/2.jpg)
はなすひと1) 深見嘉明 • W3C/Keioで広報のお手伝い • 元マーケティングリサーチャー • こんな本を書きました
![Page 3: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/3.jpg)
最近では • WebDesigning 2011年6月号「Web標準を巡る10年」を監修
![Page 4: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/4.jpg)
![Page 5: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/5.jpg)
HTML5! • http://www.w3.org/TR/html5/
![Page 6: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/6.jpg)
HTML5の正式な定義
• W3Cで策定している – HTML4.01 – XHTML1.0 – DOM2 HTML の次期バージョン
![Page 7: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/7.jpg)
HTML5の由来
• WHATWGによる提案 – Web Applications 1.0 – Web Forms 2.0
アプリケーションの実行環境としてのWebを実現
![Page 8: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/8.jpg)
HTML5 • ウェブサイト記述のためのマークアップ規則 – マシンリーダビリティの向上(HTML5はXHTMLの後継でもある)
– 表現の幅を拡大 • API仕様群
– Webをアプリケーションの実行環境に進化させる技術
![Page 9: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/9.jpg)
HTML5,,,,,
![Page 10: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/10.jpg)
ソーシャル 9
![Page 11: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/11.jpg)
is it true?
Social = closed?
![Page 12: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/12.jpg)
ソーシャルといえば • クローズドな世界 • プロプライエタリ仕様のAPI公開 • ゲームコンテンツの囲い込み
標準なんて関係ない?
11
![Page 13: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/13.jpg)
2011年、Facebook/ ZyngaがW3Cに入会
12
![Page 14: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/14.jpg)
true!
Social ♥ standards
![Page 15: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/15.jpg)
新世代ウェブの構成要素
• HTML5 • CSS3 • JavaScript • WebGL
14
![Page 16: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/16.jpg)
広義のHTML5
• ウェブアプリケーションの動作環境 • リッチコンテンツの取扱が容易に • デバイスとの連携に用いられる多様なAPI
• 多様な端末(モバイル、そして、、、、)に適したUIの実現
15
![Page 17: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/17.jpg)
HTML5! • http://www.w3.org/TR/html5/
![Page 18: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/18.jpg)
HTML5!,,,,,!?
![Page 19: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/19.jpg)
仕様策定プロセス
Working Group Interest Group Coordination Group
Working Draft
Last Call Working Draft
Candidate Recommendation
Proposed Recommendation
Recommendation 勧告
Incubator Group
ACによる投票
Directorの判断
他のグループとの 整合性を取る
実装例を待つ
特徴: 1, 実装主義 2, Consensus方式 3, Director判断
![Page 20: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/20.jpg)
W3C標準化プロセスの特徴
• W3C≠デジュール標準 • 実装主義
各社の採用・実装を コントロールしていない
実装が進んではじめて 標準にいきつく
![Page 21: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/21.jpg)
W3Cを含むWeb標準の特徴 • 民間の標準化団体や開発者コミュニティによって 仕様が開発されている
• オープンな場での議論 • 仕様に強制力は存在しない
![Page 22: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/22.jpg)
でも、、
なぜみんな ウェブ標準にコミットする のか?
![Page 23: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/23.jpg)
キーワード
ネットワーク外部性
![Page 24: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/24.jpg)
身近な例
![Page 25: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/25.jpg)
メカニズム
みんなが使う
その仕様を採用する
![Page 26: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/26.jpg)
![Page 27: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/27.jpg)
![Page 28: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/28.jpg)
ポイント • 実装主義だから、みんなが使う仕様が標準になっていく。
• 既に広く使われている仕様=勧告になる可能性が高い
• ポイントを抑えることが大切
![Page 29: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/29.jpg)
ウェブ標準とは? • Loyalty Free/ Open Usage • Open Process • One Web, One Network • 設計書であり、ルールでもある • 策定中、だけど実装済み • 強制力なし、でも実効力がある
![Page 30: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/30.jpg)
![Page 31: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/31.jpg)
![Page 32: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/32.jpg)
![Page 33: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/33.jpg)
![Page 34: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/34.jpg)
1) 仕様=プラットフォームを創る
2) アプリケーションを創る
3) ビジネスモデルを創る
エコシステムの構造
![Page 35: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/35.jpg)
仕様策定プロセス
Working Group Interest Group Coordination Group
Working Draft
Last Call Working Draft
Candidate Recommendation
Proposed Recommendation
Recommendation 勧告
Incubator Group
ACによる投票
Directorの判断
他のグループとの 整合性を取る
実装例を待つ
特徴: 1, 実装主義 2, Consensus方式 3, Director判断
![Page 36: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/36.jpg)
![Page 37: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/37.jpg)
一番最近のAPIまわりのニュース • First Draft of Vibration API
Published (17 November 2011) – The Device APIs Working Group has
published the First Public Working Draft of Vibration API. The Vibration API defines a means for web developers to programmatically provide tactile feedback in the form of vibration. The API is designed to tackle high-value use cases related to gaming, and is not meant to be used as a generic notification mechanism. Learn more about the Ubiquitous Web Applications Activity
![Page 38: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/38.jpg)
Device APIs Working Group - W3C <http://www.w3.org/2009/dap/>
![Page 39: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/39.jpg)
様々なDevice API仕様 • Battery status • Contacts (reading from addressbook) • HTML Media Capture (camera/
microphone interactions through HTML forms)
• Messaging (SMS, MMS, emails) • Vibration API • Calendar • Systems info and events (CPU, network,
etc.) • Discovery
![Page 40: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/40.jpg)
W3C Technical Architecture Group Work Plan
• HTML.next
• もう次の議論が始まっている
• デバイスメーカーの方、 ネイティブアプリ開発者の方、 出番ですよ!
![Page 41: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/41.jpg)
2000年代前半のW3C
XHTML
![Page 42: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/42.jpg)
semantic web
![Page 43: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/43.jpg)
schema.org • HTML5/ RDFa, Microdataは、データフォーマット(マークアップの記述法)のみの規定
• 複数サービスで共通に用いる語彙(使用するキーワードと機会解釈する意味のセット)を別途定めたものがschema.org
42
![Page 44: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/44.jpg)
Open Graph Protocol (OGP) • Facebookが提唱し、ミクシィやGREEでも使われているHTMLを修飾するフォーマット(schema.orgと似たようなもの)
• RDFa準拠
43
![Page 45: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/45.jpg)
![Page 46: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/46.jpg)
Web of Data • ウェブはコンピュータによってアクセスされる
• ウェブで公開される情報が、計算機処理可能なフォーマットのデータであればもっと便利
• One Web。ということは、データフォーマットも共通であるべき
45
Web of Data
![Page 47: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/47.jpg)
データ共有プラットフォームとしてのLOD
• Linked Open Data (LOD) の特徴 – ID = URI, http:// – W3C標準形式=RDFで情報提供 – 他のURI(データリソース)とリンク
http://www.w3.org
World Wide Web
Consortium
subject object
名前
46
![Page 48: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/48.jpg)
47
Linked Dataの原則
• あらゆる事柄にURIをつける • HTTP経由でURIを参照 • URIを参照したときは情報を閲覧できる • 他の関連情報へのリンクを含める
![Page 49: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/49.jpg)
データ共有プラットフォームとしてのLOD • 既に各分野でリンクされたデータセットが多数生成されています – 203のデータセット – 2500万の RDF triples – 3億9500万の RDF links
48
(http://www4.wiwiss.fu-berlin.de/lodcloud/state/)
![Page 50: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/50.jpg)
Linked Dataの本質 • 世界共通の識別子(Identifier) • 世界共通のデータフォーマット=RDF • 世界共通のAPI
Web全体を データリソースとして アプリケーションが
作れる
![Page 51: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/51.jpg)
http://lod.sfc.keio.ac.jp/challenge2011/
• 賞金総額約100万円(予定)
• 応募締切:2012年1月31日
![Page 52: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/52.jpg)
The Web of Things
http://ercim-news.ercim.eu/content/view/343/536/
It's not the wires - it's the computers It's not the documents - it's the things The World of Things ... on the Web
![Page 53: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/53.jpg)
The Web of Thingsのインパクト • Identifier(識別子)さえあれば、どんな事物・概念もコンピュータネットワーク上で取り扱うことができる
• IdentifierがURIであれば、WWW上で取り扱うことが できる
• モノ・場所・人・時間……あらゆるものがURIをもち、WWW上で相互に関連付けられ、計算処理されることにより、高度なサービスが提供される世界。それこそが、、、、、
The Web of Things
![Page 54: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/54.jpg)
ありがとうございました。 [email protected] http://www.w3.org @rhys_no1
![Page 55: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/55.jpg)
ウェブ標準化活動への参加方法 1. 会員としてW3Cに参加する
1. Working Groupへの参加によって、仕様にご自身の技術や意見を盛り込む
2. 会議(電話・F2F)、メーリングリスト等の議論やデータにアクセス可能。→いち早く詳細な情報を入手して、最新の仕様を 実装可能
2. Interest Groupへ参加する 会員企業・団体に属していない個人でも参加可能。 日本語で議論するJAIG (Japanese Interest Group)もあります。
日本の実態に即した仕様に関する意見を、発信することが可能です。
Web and TV Interest Groupの活動は始まったばかりです。今こそ、ぜひご参加を。
3. 標準仕様を積極的に実装する
![Page 56: 全てのエンジニアのためのWeb標準技術とのつきあい方 OSC福岡 2011版](https://reader031.fdocument.pub/reader031/viewer/2022021500/58d09b611a28abdd648b5c05/html5/thumbnails/56.jpg)
W3C関係URL W3C全般について: * W3Cトップページ=http://www.w3.org/ * W3Cについて=http://www.w3.org/Consortium/ * 初めて訪れる方向けの説明
=http://www.w3.org/Consortium/new-to-w3c.html *★申し込みページ: http://www.w3.org/Consortium/application.php3 *日本語による記入方法ガイド:W3c Application Step 1.pdf 特許方針について * W3C Patent Policy=http://www.w3.org/Consortium/Patent-Policy-20040205/ * Patent Policy FAQ=http://www.w3.org/2003/12/22-pp-faq.html * Implementation of Patent Policy
=http://www.w3.org/2004/01/pp-impl/
W3C文書の日本語翻訳集=http://www.w3.org/2005/11/Translations/Query?titleLanguageMatch=&lang=ja&search2=Submit 標準準拠確認ツール (Validator)=http://validator.w3.org/#validate_by_uri