全てのエンジニアのためのWeb標準技術とのつきあい方 OSC名古屋 2012版

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年5月12日 W3C/Keio

慶應義塾大学大学院政策・メディア研究科

特任助教深見嘉明

@rhys_no1

オープンソースカンファレンス2012Nagoya


はなすひと深見嘉明 1.   ウェブ標準の役割とHTML5/関連仕様

2.  もう使われている！ソーシャルサービスにおける活用事例

3.  マルチデバイス対応のためのコーディングテクニック

4.  APIを安全に使うためのセキュリティの実践

5.  マークアップの進化が変えるユーザーエクスペリエンス

6.  ビジネスの現場で起きているプロセス変革

7.   そしてウェブの進化はコミュニケーションをどう変える？

(C) 2012 慶應義塾大学SFC研究所次世代Web応用技術・ラボ

1



今日のポイント

• つかおう • つくろう


つかおうここまで普及した、ここまで進化したHTML5


HTML5! •  http://www.w3.org/TR/html5/


HTML5,,,,,


新世代ウェブの構成要素

• HTML5 • CSS3 • JavaScript • WebGL

7


HTML5 • ウェブサイト記述のためのマークアップ規則 – マシンリーダビリティの向上（HTML5はXHTMLの後継でもある）

– 表現の幅を拡大 •  API仕様群

– Webをアプリケーションの実行環境に進化させる技術


仕様策定プロセス

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判断


HTML5 • ウェブサイト記述のためのマークアップ規則 – マシンリーダビリティの向上（HTML5はXHTMLの後継でもある）

– 表現の幅を拡大 •  API仕様群

– Webをアプリケーションの実行環境に進化させる技術



一番最近のAPIまわりのニュース


Device APIs Working Group - W3C <http://www.w3.org/2009/dap/>


様々な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


Device APIs Working Group - W3C <http://www.w3.org/2009/dap/>


Web RTC WGhttp://www.w3.org/2011/04/webrtc-charter.html


ソーシャル 17


is it true?

Social = closed?


ソーシャルといえば •  クローズドな世界 •  プロプライエタリ仕様のAPI公開 •  ゲームコンテンツの囲い込み

標準なんて関係ない？

19


2011年、Facebook/ ZyngaがW3Cに入会

20


true!

Social ♥ standards


つくろうプロダクトやサービスだけじゃなくて、、


次世代ウェブの構成要素

• HTML5 • CSS3 • JavaScript • WebGL


23


インターネット・ウェブのガヴァナンス

•  インターネット標準 –  IETF, ICANN, ISOC,,,,

•  ウェブ標準 – W3C, Ecma, Khronos,,,,


24

民間による自主的なガヴァナンス


W3Cを含むWeb標準の特徴 • 民間の標準化団体や開発者コミュニティによって仕様が開発されている

•  オープンな場での議論 •  仕様に強制力は存在しない


でも、、

なぜみんなウェブ標準にコミットするのか？


キーワード

ネットワーク外部性


身近な例


メカニズム

みんなが使う

その仕様を採用する




ポイント • 実装主義だから、みんなが使う仕様が標準になっていく。

• 既に広く使われている仕様＝勧告になる可能性が高い

• ポイントを抑えることが大切


ウェブ標準とは？ •  Loyalty Free/ Open Usage •  Open Process •  One Web, One Network •  設計書であり、ルールでもある •  策定中、だけど実装済み •  強制力なし、でも実効力がある




Working Draft





Incubator Group

ACによる投票

Directorの判断


実装例を待つ



1) 仕様=プラットフォームを創る

2) アプリケーションを創る

3) ビジネスモデルを創る

エコシステムの構造




Working Draft





Incubator Group

ACによる投票

Directorの判断


実装例を待つ



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


2000年代前半のW3C

XHTML


semantic web


schema.org •  HTML5/ RDFa, Microdataは、データフォーマット(マークアップの記述法)のみの規定

•  複数サービスで共通に用いる語彙(使用するキーワードと機会解釈する意味のセット)を別途定めたものがschema.org

40


Open Graph Protocol (OGP) •  Facebookが提唱し、ミクシィやGREEでも使われているHTMLを修飾するフォーマット(schema.orgと似たようなもの)

•  RDFa準拠

41



Web of Data •  ウェブはコンピュータによってアクセスされる

•  ウェブで公開される情報が、計算機処理可能なフォーマットのデータであればもっと便利

•  One Web。ということは、データフォーマットも共通であるべき

43

Web of Data


データ共有プラットフォームとしてのLOD

•  Linked Open Data (LOD) の特徴 – ID = URI, http:// – W3C標準形式=RDFで情報提供 – 他のURI(データリソース)とリンク

http://www.w3.org

World Wide Web

Consortium

subject object

名前

44


45

Linked Dataの原則

•  あらゆる事柄にURIをつける •  HTTP経由でURIを参照 •  URIを参照したときは情報を閲覧できる •  他の関連情報へのリンクを含める


データ共有プラットフォームとしてのLOD •  既に各分野でリンクされたデータセットが多数生成されています –  203のデータセット –  2500万の RDF triples –  3億9500万の RDF links

46

(http://www4.wiwiss.fu-berlin.de/lodcloud/state/)


Linked Dataの本質 •  世界共通の識別子(Identifier) •  世界共通のデータフォーマット=RDF •  世界共通のAPI

Web全体をデータリソースとしてアプリケーションが

作れる


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


The Web of Thingsのインパクト •  Identifier(識別子）さえあれば、どんな事物・概念もコンピュータネットワーク上で取り扱うことができる

•  IdentifierがURIであれば、WWW上で取り扱うことができる

•  モノ・場所・人・時間……あらゆるものがURIをもち、WWW上で相互に関連付けられ、計算処理されることにより、高度なサービスが提供される世界。それこそが、、、、、

The Web of Things


LODとオープンガバメント実践しよう


http://lod.sfc.keio.ac.jp/challenge2011/


公共LOD賞


2012年 •  海外と比較して遅れていたオープンガバメント、オープンデータが一気に進展しそう。

•  IT戦略会議、電子行政に関するタスクフォースでも、オープンデータが議題に。

•  オープンデータの世界標準はLOD •  オープンデータ＋サービス •  オープンデータ＋ビジネス


福井県鯖江市に行って来ました


福井県鯖江市に行って来ました •  国立情報学研究所 LODACチーム

http://lodac.nii.ac.jp/ •  NPO法人Linked Open Data Initiative 設立準備委員会(その前身であるODCIのウェブサイト：http://scholex.com/ocdi/）

•  W3C/Keio、慶應義塾大学SFC萩野研究室


地元ディベロッパーコミュニティと


データシティ鯖江


アンケートでTシャツプレゼント!


情報開示とオープンデータの差 •  既存の「情報開示」

– 開示までにかかるコストが大きい

– 特定の分析視点に基づいてデータが提示される

– 「データそのもの」が必要な場合、それを取り出すコストがかかる

加工されたデータ

データ収集

分析

プレゼンテーション


情報開示とオープンデータの差 •  LODによるオープンデータ

データ

ニーズ

データ

ニーズ

データ

ニーズ

データ

ニーズ


情報開示とオープンデータの差 •  LODによるオープンデータ

– データ生成・公開／利用の分離 – データ利用に伴う負担の分散化 – 必要なデータを各所から収集して用いる（マッシュアップ）が容易

– ニーズがある場所で、効率的にアプリケーションやサービスが開発される


LODによるオープンガバメントの意義

•  負荷分散効果による、データ提供側・利用者側の負荷低減

•  アプリケーションやサービスのDIY・地産地消を実現

•  スケーラビリティ効果 – 効率的な情報発信、サービス提供範囲拡大 – 他所の成功事例を簡単に導入


今日のポイント

• つかおう • つくろう


ありがとうございました。 [email protected] http://www.w3.org

@rhys_no1


ウェブ標準化活動への参加方法 1.  会員としてW3Cに参加する

1.  Working Groupへの参加によって、仕様にご自身の技術や意見を盛り込む

2.  会議(電話・F2F)、メーリングリスト等の議論やデータにアクセス可能。→いち早く詳細な情報を入手して、最新の仕様を　実装可能

2.  Interest Groupへ参加する Ø  会員企業・団体に属していない個人でも参加可能。 Ø  日本語で議論するJAIG (Japanese Interest Group)もあります。

Ø  日本の実態に即した仕様に関する意見を、発信することが可能です。

Ø  Web and TV Interest Groupの活動は始まったばかりです。今こそ、ぜひご参加を。

3.  標準仕様を積極的に実装する


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