Upload
seikei-university
View
1.476
Download
2
Embed Size (px)
Citation preview
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
全てのエンジニアのための Web標準技術とのつきあい方
2011年3月16日 W3C/Keio
慶應義塾大学大学院 政策・メディア研究科
特任助教 深見嘉明
@rhys_no1
オープンソースカンファレンス2012Tokyo Spring
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
はなすひと 深見嘉明 1. ウェブ標準の役割とHTML5/関連仕様
2. もう使われている!ソーシャルサービスにおける活用事例
3. マルチデバイス対応のためのコーディングテクニック
4. APIを安全に使うためのセキュリティの実践
5. マークアップの進化が変えるユーザーエクスペリエンス
6. ビジネスの現場で起きているプロセス変革
7. そしてウェブの進化はコミュニケーションをどう変える?
(C) 2012 慶應義塾大学SFC研究所 次世代Web応用技術・ラボ
1
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
今日のポイント
• つかおう • つくろう
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
つかおう ここまで普及した、ここまで進化したHTML5
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
HTML5! • http://www.w3.org/TR/html5/
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
HTML5,,,,,
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
新世代ウェブの構成要素
• HTML5 • CSS3 • JavaScript • WebGL
7
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
HTML5 • ウェブサイト記述のためのマークアップ規則 – マシンリーダビリティの向上(HTML5はXHTMLの後継でもある)
– 表現の幅を拡大 • API仕様群
– Webをアプリケーションの実行環境に進化させる技術
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
仕様策定プロセス
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判断
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
HTML5 • ウェブサイト記述のためのマークアップ規則 – マシンリーダビリティの向上(HTML5はXHTMLの後継でもある)
– 表現の幅を拡大 • API仕様群
– Webをアプリケーションの実行環境に進化させる技術
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
一番最近のAPIまわりのニュース
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
Device APIs Working Group - W3C <http://www.w3.org/2009/dap/>
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
様々な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
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
Device APIs Working Group - W3C <http://www.w3.org/2009/dap/>
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
Web RTC WGhttp://www.w3.org/2011/04/webrtc-charter.html
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
ソーシャル 17
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
is it true?
Social = closed?
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
ソーシャルといえば • クローズドな世界 • プロプライエタリ仕様のAPI公開 • ゲームコンテンツの囲い込み
標準なんて関係ない?
19
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
2011年、Facebook/ ZyngaがW3Cに入会
20
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
true!
Social ♥ standards
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
つくろう プロダクトやサービスだけじゃなくて、、
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
次世代ウェブの構成要素
• HTML5 • CSS3 • JavaScript • WebGL
(C) 2012 慶應義塾大学SFC研究所 次世代Web応用技術・ラボ
23
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
インターネット・ウェブのガヴァナンス
• インターネット標準 – IETF, ICANN, ISOC,,,,
• ウェブ標準 – W3C, Ecma, Khronos,,,,
(C) 2012 慶應義塾大学SFC研究所 次世代Web応用技術・ラボ
24
民間による 自主的なガヴァナンス
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
W3Cを含むWeb標準の特徴 • 民間の標準化団体や開発者コミュニティによって 仕様が開発されている
• オープンな場での議論 • 仕様に強制力は存在しない
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
でも、、 なぜみんな ウェブ標準にコミットする のか?
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
キーワード
ネットワーク外部性
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
身近な例
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
メカニズム
みんなが使う
その仕様を採用する
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
ポイント • 実装主義だから、みんなが使う仕様が標準になっていく。
• 既に広く使われている仕様=勧告になる可能性が高い
• ポイントを抑えることが大切
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
ウェブ標準とは? • Loyalty Free/ Open Usage • Open Process • One Web, One Network • 設計書であり、ルールでもある • 策定中、だけど実装済み • 強制力なし、でも実効力がある
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
仕様策定プロセス
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判断
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
1) 仕様=プラットフォームを創る
2) アプリケーションを創る
3) ビジネスモデルを創る
エコシステムの構造
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
仕様策定プロセス
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判断
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
W3Cの組織体制と活動グループ 37
CEO Director
COO
Management Team (W3M)
Technology Architecture Group (TAG)
Web Accessibility Initiative (WAI)
Interaction
Technology & Society
Ubiquitous Web
Business Development
Communication
System
Advisory Board
Technology Domains Management & Marketing
Administration
Advisory Committee
Working Group Interest Group Coordination Group Incubator Group
Business Group Community Group
Host/ Site
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
2000年代前半のW3C
XHTML
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
semantic web
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
schema.org • HTML5/ RDFa, Microdataは、データフォーマット(マークアップの記述法)のみの規定
• 複数サービスで共通に用いる語彙(使用するキーワードと機会解釈する意味のセット)を別途定めたものがschema.org
40
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
Open Graph Protocol (OGP) • Facebookが提唱し、ミクシィやGREEでも使われているHTMLを修飾するフォーマット(schema.orgと似たようなもの)
• RDFa準拠
41
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
Web of Data • ウェブはコンピュータによってアクセスされる
• ウェブで公開される情報が、計算機処理可能なフォーマットのデータであればもっと便利
• One Web。ということは、データフォーマットも共通であるべき
43
Web of Data
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
データ共有プラットフォームとしてのLOD
• Linked Open Data (LOD) の特徴 – ID = URI, http:// – W3C標準形式=RDFで情報提供 – 他のURI(データリソース)とリンク
http://www.w3.org
World Wide Web
Consortium
subject object
名前
44
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
45 Linked Dataの原則
• あらゆる事柄にURIをつける • HTTP経由でURIを参照 • URIを参照したときは情報を閲覧できる • 他の関連情報へのリンクを含める
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
データ共有プラットフォームとしてのLOD • 既に各分野でリンクされたデータセットが多数生成されています – 203のデータセット – 2500万の RDF triples – 3億9500万の RDF links
46
(http://www4.wiwiss.fu-berlin.de/lodcloud/state/)
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
Linked Dataの本質 • 世界共通の識別子(Identifier) • 世界共通のデータフォーマット=RDF • 世界共通のAPI
Web全体を データリソースとして アプリケーションが
作れる
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
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
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
The Web of Thingsのインパクト • Identifier(識別子)さえあれば、どんな事物・概念もコンピュータネットワーク上で取り扱うことができる
• IdentifierがURIであれば、WWW上で取り扱うことが できる
• モノ・場所・人・時間……あらゆるものがURIをもち、WWW上で相互に関連付けられ、計算処理されることにより、高度なサービスが提供される世界。それこそが、、、、、
The Web of Things
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
http://lod.sfc.keio.ac.jp/challenge2011/
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
アプリケーション部門最優秀賞
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
データセット部門最優秀賞
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
アイデア部門優秀賞
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
オープン・ガバメント賞
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
公共LOD賞
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
2012年 • 海外と比較して遅れていたオープンガバメント、オープンデータが一気に進展しそう。
• IT戦略会議、電子行政に関するタスクフォースでも、オープンデータが議題に。
• オープンデータの世界標準はLOD • オープンデータ+サービス • オープンデータ+ビジネス
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
今日のポイント
• つかおう • つくろう
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
ありがとうございました。 [email protected] http://www.w3.org
@rhys_no1
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
ウェブ標準化活動への参加方法 1. 会員としてW3Cに参加する
1. Working Groupへの参加によって、仕様にご自身の技術や意見を盛り込む
2. 会議(電話・F2F)、メーリングリスト等の議論やデータにアクセス可能。→いち早く詳細な情報を入手して、最新の仕様を 実装可能
2. Interest Groupへ参加する ! 会員企業・団体に属していない個人でも参加可能。 ! 日本語で議論するJAIG (Japanese Interest Group)もあります。
! 日本の実態に即した仕様に関する意見を、発信することが可能です。
! Web and TV Interest Groupの活動は始まったばかりです。今こそ、ぜひご参加を。
3. 標準仕様を積極的に実装する
These slides are copyright © 2011 W3C (MIT, ERCIM & Keio). !Stata Center photo by See-Ming Lee available under a Creative Commons Attribution Share-Alike 2.0 License http://www.flickr.com/photos/seeminglee/3791607622/ !
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