産業技術大学院大学「IT特論(第4学期・正規科目)」

HTML5から始まる技術革新
日本オープン・ウェブ・アソシエーション 理事
若狭 正生
自己紹介
若狭 正生(わかさ
@wks

まさお)

• 日本オープン・ウェブ・アソシエーション
理事
• TV系メディア企業で仕事
• html5jスタッフ / html5j TV部 副部長 / OSGeo
財団日本支部 運営委員 / Cod...
バックグラウンド
• ISDN/ADSL時代に動画配信を行う企業など多数
渡り歩く
• Webページ関連のコンサルタントからサーバの
実際の導入、Webコンテンツの制作、Flash制作
やサーバサイドプログラミングなど幅広く活躍
• 他にコミュ...
バックグラウンド
このヘルメットとか
作りました
日本オープン・ウェブ・アソシエーション

• html5jの法人側の組織
• 毎月100人規模の勉強会を開催
• 11/30 に 2000人を10日間で集めてカン
ファレンスを開催
• W3Cや総務省とも連携
アジェンダ
• 前半
– HTML5の歴史/標準化について。
– HTML5の概要を説明。
– HTML5の機能をデモを踏まえて。

• 後半
– 通信技術の変革がおこる?
– 変わり続けるWeb技術
– 僕らが未来に対してできること。
※注意

HTML5というカテゴリから、
ちょっとズレた話が含まれます
HTML5の歴史
2014年に正式勧告を目指している
実はまだ”正式”という形ではない
でも、ちまたではHTML5という単語が溢れ
実際にみなさんが触る事ができる技術
これは何なのだろうか?
Webのざっくりした歴史
ソフトウェア

Web技術

1974

TCP/IP

1989

ティム・バーナーズ=リーによって
WorldWideWebが提案

1991

WorldWideWeb

1999

Flash Player 4...
HTML5の歴史
W3C

WHATWG

WWWに関わる標準化を推進

Apple,Mozilla,Opera,
Googleらベンダーによって設立

1997

HTML4.0 ドラフト

2000

XHTML1.0 ドラフト

2002...
HTML5と標準化の道のり
2000年代にはいくつものWebの技術がブラウザに
プラグインという形で実装され、出ては消えてを
行い淘汰されていった。
ただ、リッチなコンテンツが出るにつれ、URLに
アクセスすればすべての情報が見れるというWeb...
HTML5と標準化の道のり
しかし、Webの標準化団体であるW3Cはリッチな
コンテンツに関しては定義せず、XHTMLなどのセ
マンティックの方向性を目指していた。

これに危惧したブラウザベンダは現実に
そった内容に対して定義してほしいと提案...
HTML5と標準化の道のり
そして、ブラウザベンダーは独自でWHATWGとい
う団体を立ち上げ未来のWebはこうあるべきと検
討し、それを実装していくという行動にでる。

このときに定義していったものがのちの

HTML5
の原型になっていく。
HTML5と標準化の道のり
一方、W3C側は既存のWebを作り替えようと下位
互換性が無いXHTML2.0が失敗に終わっていく。

W3CはWHATWGと連携を図り、
HTML4の発展を共同で策定するという方向
に大きく方向転換
HTML5と標準化の道のり
1. 仕様を検討
2. ブラウザベンダーがベンダープレフィック
ス等をつけ先行実装
3. 仕様を詰める
4. 他のブラウザも実装する
5. 仕様として勧告

仕様が確定したころにはブラウザ実装は完了
HTML5と標準化の道のり
標準化される利点
• 仕様に準拠していればどのようなブラウ
ザや機器でも動作する
• 利用してる技術が突然使えなくなるなど
のリスクが少なくなるため、安心感から
実装が加速する
HTML5 概略
これまでのWebの問題点
• ブラウザの互換性の問題
– 10年も前の技術のIE6が幅をきかせていたり

• 文章の意味付けが不明確
– Tableをレイアウトとして・・など表現力が不足
のため、見た目とタグのちぐはぐが生まれ...
HTML5 概略
目指すもの
• よりセマンティックな

コンテンツプラットフォーム
• よりリッチな

アプリケーションプラットフォーム
HTML5によって変わる構造(前)
コンテンツ
Web技術

アプリ

ブラウザ
OS
HTML5によって変わる構造(後)
コンテンツ
Web技術
アプリ

ブラウザ
OS
HTML5の機能
Semantics
Offline & Storage
Multimedia
3D, Graphics & Effects
Connectivity
Device Access
Performance & Integratio...
Offline & Storage
•
•
•
•
•

Application Cache … オフラインアプリケーション
Web Storage … 簡易易ローカルストレージ
Indexed Database … KVS型のローカルデータベ...
Offline & Storage

https://drive.google.com/
Offline & Storage

http://html5-demos.appspot.com/static/navigator.onLine.html
Multimedia
•
•
•
•

video/audio … 動画/⽤
楽再⽤
WebVTT … 字幕・トラック情報を追加
Web Audio API … ⽤
声処理・合成
HTML Media Capture … メディアの取込
み
Multimedia

http://craftymind.com/factory/html5video/CanvasVideo.html
Multimedia

http://www.htmlfivewow.com/demos/audio-visualizer/index.html
Graphics, 3D & Effects
• Canvas … 2Dグラフィックス
• WebGL … 3Dグラフィックス
• SVG … ベクターグラフィックス
Graphics, 3D & Effects

http://helloracer.com/webgl/
Graphics, 3D & Effects

http://www.eveonline.com/universe/spaceships/curse/
Realtime / Connectivity
• WebSocket … リアルタイム双⽤
方向通信
• Server-Sent Events … サーバープッシュ可能な通信(ロ
ングポーリング/Cometを仕様化)
• Web Messag...
Realtime / Connectivity

http://chrome.com/maze/
Realtime / Connectivity

http://browserquest.mozilla.org/
Realtime / Connectivity

http://webcamtoy.com/ja/
Device Access
•
•
•
•
•
•
•
•

Geolocation API … GPS情報を取得
Web Speech API… ⽤
声⽤
力
Device Orientation …デバイスの向きや傾きを取得
Contact...
Device Access

http://www.mrdoob.com/projects/chromeexperiments/google-gravity/
Device Access

https://www.google.com/intl/ja/chrome/demos/speech.html
Styling (CSS3)
• CSS3 Selectors … :first-child/:nth-child(odd)など、
便利な擬似クラスなどが増えた
• border-radius … ⽤
が丸く!
• text-shadow/bo...
Styling (CSS3)

http://slides.html5rocks.com/#rounded-corners
Styling (CSS3)

http://lea.verou.me/css3patterns/
実装状況
ただし、すべての機能がすべてのブラウザ
で実装されてるとは限りません。

http://caniuse.com/
前半まとめ
• HTML5は実装側からあがってきた現実と
未来の両輪を考えたものである
• 標準化されることでどの環境でも実行で
きるようになり、より使われるようにな
る
• 機能がかなり充実していっているが、現
時点では実装は確認しながら利用...
アジェンダ
• 前半
– HTML5の歴史/標準化について。
– HTML5の概要を説明。
– HTML5の機能をデモを踏まえて。

• 後半
– 通信技術の変革がおこる?
– 変わり続けるWeb技術
– 僕らが未来に対してできること。
通信技術に変革がおこる?
TCP/IPが考えられて40年近く経つが、未だ現役で
昔と変わらない使われ方をしている。Webが進化
しても基盤が古いままという矛盾。

ここまで構築されてしまったネットワーク
網には他のものを流すにはコストがかかる
通信技術に変革がおこる?
• HTTP/1.1 とは?
Browser

Server
つないでいいですか?
いいですよ!
これください。
どうぞ!
届きました!!
では切ります。
通信技術に変革がおこる?
• SPDY
– 1回に1つではなく、1回のコネクション中に複
数データを入れることで、オーバーヘッドを削減

つないでいいですか?
いいですよ!
これとこれとこれと..
どうぞ!
届きました!!
では切ります。
通信技術に変革がおこる?
• Websocket
– 1回つないだらそれを切断せず使い続ける
– チャットのような双方向通信などに利用される
つないでいいですか?

いいですよ!
これどうぞ
これどうぞ
これどうぞ

これどうぞ
終わりました!...
通信技術に変革がおこる?
• WebRTC
– ブラウザ間でP2Pの通信ができる

Server

経由
Browser

Server

直接
Browser

Browser

Browser
変わり続けるWeb技術
1991年にブラウザが出てきてから、ずっと
Web技術=ブラウザ上でURLを叩いてアク
セスするもの

実は、Web技術は
いろんな所で使われ始めています。
アプリケーションとWeb技術
•
•
•
•
•

Windows8アプリ
ChromeApps
FirefoxOS
Tizen
スマートフォンアプリ(PhoneGap等)
and more..
アプリケーションとWeb技術
Windows8アプリ

参考 http://www.atmarkit.co.jp/fdotnet/special/ie10review01/ie10review01_01.html
アプリケーションとWeb技術
FirefoxOS
ネイティブアプリ(例えば
電話アプリ)でさえも
Web技術で作られている。
ゲーム機とWeb技術
• Nintendo Web Framework
• Unity ( WiiU & Playstation & Xbox )
and more..
ゲーム機とWeb技術
•

Nintendo Web Framework

参考 http://www.4gamer.net/games/032/G003263/20130328113/
カーナビとWeb技術
•
•
•
•
•
•

富士通テン
Tizen IVI
Genivi
Webinos
QNX
KDDI研究所
and more..
カーナビとWeb技術
富士通テン

参考 http://www.nikkan.co.jp/news/nkx0420131025beai.html
カーナビとWeb技術
Tizen IVI

参考 https://www.youtube.com/watch?v=HN2qL_meAek
テレビとWeb技術
• Hybridcast
• SmartTV
• OperaTV
and more..
テレビとWeb技術
Sony BRAVIA (Opera TV Store)

参考 http://www.sony-mea.com/TVP-LCD-TV/feature/Sony-Entertainment-Network/498176
テレビとWeb技術
Hybridcast

参考 http://html5experts.jp/yusuke-naka/2810/
電子書籍とWeb技術
• Kindle Cloud Reader
• Kobo Cloud Reader
電子書籍とWeb技術
Web技術が使えるデバイスとならば連動と利便
性を考え利用されている。
例:
PCで10ページまで見たら
スマートフォンで自動的に10ページから読める
(iOS等30%取られる課金システムを回避ためとも)
遠隔操作とWeb技術
• LiveShell
• ガラポンTV
• ChromeCast
遠隔操作とWeb技術
本体にはほぼ操作する部分が存在しない
リアルタイム通信をWebの標準技術の
WebsocketやWebRTCを用いて実装
-> UI部分は容易に作れるWeb画面を使う
-> スマートフォンなどの機器からも操作可能
僕らが未来に対してできること。
ブラウザやWeb技術などは利用するだけで、も
う水のように提供され続けていくもの。

ブラウザを開発する、Web技術を
加速させるためには
実は僕らにできることが沢山あります。
僕らが未来に対してできること。

• Working Group
W3Cが現在策定してる仕様の種がメーリ
ングリストでやりとりされています。誰
でも参加が可能です。
僕らが未来に対してできること。

• Test the Web Forward
W3Cが策定したHTML5の仕様にブラウザ
が準じてるかのテストケースをみんなで
作る
僕らが未来に対してできること。

• html5j 英語部
W3Cが策定したHTML5の仕様を翻訳し公
開していく
まとめ
• Web技術は常に進化を続けている
• ブラウザの枠を越えて、どんなものでも
実行できるようになってきている
• 提供されるものを利用するのではなく、
自分で仕様に参加できたり、貢献するこ
とができる
最後に
ぜひ、Web技術に感心を持ってください!
プログラムが書けるとか、書けないは関係
なく、Webがこうなったらいいな。と心に
貯めていることは外に出して、色々な議論
に参加したりすることが容易です。
「自分が考えた事が未来を変えれる。」
...
Thanks
• @yoshikawa_t
http://www.slideshare.net/yoshikawa_t/html5-27598924

• @komasshu
https://www.youtube.com/watch?v=nX...
Upcoming SlideShare
Loading in …5
×

HTML5から始まる技術革新

1,233 views
1,088 views

Published on

産業技術大学院大学「IT特論(第4学期・正規科目)」で利用したスライドです。

0 Comments
7 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,233
On SlideShare
0
From Embeds
0
Number of Embeds
12
Actions
Shares
0
Downloads
20
Comments
0
Likes
7
Embeds 0
No embeds

No notes for slide

HTML5から始まる技術革新

  1. 1. 産業技術大学院大学「IT特論(第4学期・正規科目)」 HTML5から始まる技術革新 日本オープン・ウェブ・アソシエーション 理事 若狭 正生
  2. 2. 自己紹介 若狭 正生(わかさ @wks まさお) • 日本オープン・ウェブ・アソシエーション 理事 • TV系メディア企業で仕事 • html5jスタッフ / html5j TV部 副部長 / OSGeo 財団日本支部 運営委員 / CodeForJapan コア グループ所属 / アカデミーキャンプ スタッフ
  3. 3. バックグラウンド • ISDN/ADSL時代に動画配信を行う企業など多数 渡り歩く • Webページ関連のコンサルタントからサーバの 実際の導入、Webコンテンツの制作、Flash制作 やサーバサイドプログラミングなど幅広く活躍 • 他にコミュニティ活動を通じ、最先端の情報を 収集している • 趣味は役に立たないくだらないものを作る
  4. 4. バックグラウンド このヘルメットとか 作りました
  5. 5. 日本オープン・ウェブ・アソシエーション • html5jの法人側の組織 • 毎月100人規模の勉強会を開催 • 11/30 に 2000人を10日間で集めてカン ファレンスを開催 • W3Cや総務省とも連携
  6. 6. アジェンダ • 前半 – HTML5の歴史/標準化について。 – HTML5の概要を説明。 – HTML5の機能をデモを踏まえて。 • 後半 – 通信技術の変革がおこる? – 変わり続けるWeb技術 – 僕らが未来に対してできること。
  7. 7. ※注意 HTML5というカテゴリから、 ちょっとズレた話が含まれます
  8. 8. HTML5の歴史 2014年に正式勧告を目指している 実はまだ”正式”という形ではない でも、ちまたではHTML5という単語が溢れ 実際にみなさんが触る事ができる技術 これは何なのだろうか?
  9. 9. Webのざっくりした歴史 ソフトウェア Web技術 1974 TCP/IP 1989 ティム・バーナーズ=リーによって WorldWideWebが提案 1991 WorldWideWeb 1999 Flash Player 4 2000 ActionScript 登場 2001 Internet Explorer 6 2004 Firefox 1 2005 ADSLの浸透 Google Maps 2007 Android / iOS 登場 2008 Google Chrome 1 Google Gears
  10. 10. HTML5の歴史 W3C WHATWG WWWに関わる標準化を推進 Apple,Mozilla,Opera, Googleらベンダーによって設立 1997 HTML4.0 ドラフト 2000 XHTML1.0 ドラフト 2002 XHTML2.0 ドラフト 2004 HTML4の発展を提案→却下 WHATWGの設立 2007 HTML5の共同策定 2008 HTML5 ドラフト 2014 正式勧告(予定)
  11. 11. HTML5と標準化の道のり 2000年代にはいくつものWebの技術がブラウザに プラグインという形で実装され、出ては消えてを 行い淘汰されていった。 ただ、リッチなコンテンツが出るにつれ、URLに アクセスすればすべての情報が見れるというWeb の最大の利点において、矛盾点が増して行く。
  12. 12. HTML5と標準化の道のり しかし、Webの標準化団体であるW3Cはリッチな コンテンツに関しては定義せず、XHTMLなどのセ マンティックの方向性を目指していた。 これに危惧したブラウザベンダは現実に そった内容に対して定義してほしいと提案 するが、 W3Cより却下される
  13. 13. HTML5と標準化の道のり そして、ブラウザベンダーは独自でWHATWGとい う団体を立ち上げ未来のWebはこうあるべきと検 討し、それを実装していくという行動にでる。 このときに定義していったものがのちの HTML5 の原型になっていく。
  14. 14. HTML5と標準化の道のり 一方、W3C側は既存のWebを作り替えようと下位 互換性が無いXHTML2.0が失敗に終わっていく。 W3CはWHATWGと連携を図り、 HTML4の発展を共同で策定するという方向 に大きく方向転換
  15. 15. HTML5と標準化の道のり 1. 仕様を検討 2. ブラウザベンダーがベンダープレフィック ス等をつけ先行実装 3. 仕様を詰める 4. 他のブラウザも実装する 5. 仕様として勧告 仕様が確定したころにはブラウザ実装は完了
  16. 16. HTML5と標準化の道のり 標準化される利点 • 仕様に準拠していればどのようなブラウ ザや機器でも動作する • 利用してる技術が突然使えなくなるなど のリスクが少なくなるため、安心感から 実装が加速する
  17. 17. HTML5 概略 これまでのWebの問題点 • ブラウザの互換性の問題 – 10年も前の技術のIE6が幅をきかせていたり • 文章の意味付けが不明確 – Tableをレイアウトとして・・など表現力が不足 のため、見た目とタグのちぐはぐが生まれる • アプリとして機能不足 – ブラウザ内に保存するにはCookieくらいしかない などサーバに依存しなければいけない
  18. 18. HTML5 概略 目指すもの • よりセマンティックな コンテンツプラットフォーム • よりリッチな アプリケーションプラットフォーム
  19. 19. HTML5によって変わる構造(前) コンテンツ Web技術 アプリ ブラウザ OS
  20. 20. HTML5によって変わる構造(後) コンテンツ Web技術 アプリ ブラウザ OS
  21. 21. HTML5の機能 Semantics Offline & Storage Multimedia 3D, Graphics & Effects Connectivity Device Access Performance & Integration Styling (CSS3)
  22. 22. Offline & Storage • • • • • Application Cache … オフラインアプリケーション Web Storage … 簡易易ローカルストレージ Indexed Database … KVS型のローカルデータベース File APIs … ファイルの読み書き File System API … アプリから利利⽤ 用できるファイ ル領領域 • online/offline events … オン/オフライン状態の把握
  23. 23. Offline & Storage https://drive.google.com/
  24. 24. Offline & Storage http://html5-demos.appspot.com/static/navigator.onLine.html
  25. 25. Multimedia • • • • video/audio … 動画/⽤ 楽再⽤ WebVTT … 字幕・トラック情報を追加 Web Audio API … ⽤ 声処理・合成 HTML Media Capture … メディアの取込 み
  26. 26. Multimedia http://craftymind.com/factory/html5video/CanvasVideo.html
  27. 27. Multimedia http://www.htmlfivewow.com/demos/audio-visualizer/index.html
  28. 28. Graphics, 3D & Effects • Canvas … 2Dグラフィックス • WebGL … 3Dグラフィックス • SVG … ベクターグラフィックス
  29. 29. Graphics, 3D & Effects http://helloracer.com/webgl/
  30. 30. Graphics, 3D & Effects http://www.eveonline.com/universe/spaceships/curse/
  31. 31. Realtime / Connectivity • WebSocket … リアルタイム双⽤ 方向通信 • Server-Sent Events … サーバープッシュ可能な通信(ロ ングポーリング/Cometを仕様化) • Web Messaging … Webページ間のメッセージ交換 • XMLHttpRequest Level2 … クロスドメイン通信やバイ ナリデータが送れるように • Notifications … デスクトップに通知 • WebRTC … ⽤ 声/動画でリアルタイムコミュニケーショ ンを行う
  32. 32. Realtime / Connectivity http://chrome.com/maze/
  33. 33. Realtime / Connectivity http://browserquest.mozilla.org/
  34. 34. Realtime / Connectivity http://webcamtoy.com/ja/
  35. 35. Device Access • • • • • • • • Geolocation API … GPS情報を取得 Web Speech API… ⽤ 声⽤ 力 Device Orientation …デバイスの向きや傾きを取得 Contacts API … アドレス帳へのアクセス Calendar API … カレンダー情報の取得 Battery Status API … バッテリーの状態を取得 Network Information API … 通信環境の情報を取得 USB, Bluetooth など
  36. 36. Device Access http://www.mrdoob.com/projects/chromeexperiments/google-gravity/
  37. 37. Device Access https://www.google.com/intl/ja/chrome/demos/speech.html
  38. 38. Styling (CSS3) • CSS3 Selectors … :first-child/:nth-child(odd)など、 便利な擬似クラスなどが増えた • border-radius … ⽤ が丸く! • text-shadow/box-shadow … 影がつく! • gradient … グラデーション • Webfonts … 外部フォントを扱えるように • Transforms … 変形 • Transitions/Animations … CSSだけでアニメーショ ンが可能
  39. 39. Styling (CSS3) http://slides.html5rocks.com/#rounded-corners
  40. 40. Styling (CSS3) http://lea.verou.me/css3patterns/
  41. 41. 実装状況 ただし、すべての機能がすべてのブラウザ で実装されてるとは限りません。 http://caniuse.com/
  42. 42. 前半まとめ • HTML5は実装側からあがってきた現実と 未来の両輪を考えたものである • 標準化されることでどの環境でも実行で きるようになり、より使われるようにな る • 機能がかなり充実していっているが、現 時点では実装は確認しながら利用せざる を得ない
  43. 43. アジェンダ • 前半 – HTML5の歴史/標準化について。 – HTML5の概要を説明。 – HTML5の機能をデモを踏まえて。 • 後半 – 通信技術の変革がおこる? – 変わり続けるWeb技術 – 僕らが未来に対してできること。
  44. 44. 通信技術に変革がおこる? TCP/IPが考えられて40年近く経つが、未だ現役で 昔と変わらない使われ方をしている。Webが進化 しても基盤が古いままという矛盾。 ここまで構築されてしまったネットワーク 網には他のものを流すにはコストがかかる
  45. 45. 通信技術に変革がおこる? • HTTP/1.1 とは? Browser Server つないでいいですか? いいですよ! これください。 どうぞ! 届きました!! では切ります。
  46. 46. 通信技術に変革がおこる? • SPDY – 1回に1つではなく、1回のコネクション中に複 数データを入れることで、オーバーヘッドを削減 つないでいいですか? いいですよ! これとこれとこれと.. どうぞ! 届きました!! では切ります。
  47. 47. 通信技術に変革がおこる? • Websocket – 1回つないだらそれを切断せず使い続ける – チャットのような双方向通信などに利用される つないでいいですか? いいですよ! これどうぞ これどうぞ これどうぞ これどうぞ 終わりました! では切ります。
  48. 48. 通信技術に変革がおこる? • WebRTC – ブラウザ間でP2Pの通信ができる Server 経由 Browser Server 直接 Browser Browser Browser
  49. 49. 変わり続けるWeb技術 1991年にブラウザが出てきてから、ずっと Web技術=ブラウザ上でURLを叩いてアク セスするもの 実は、Web技術は いろんな所で使われ始めています。
  50. 50. アプリケーションとWeb技術 • • • • • Windows8アプリ ChromeApps FirefoxOS Tizen スマートフォンアプリ(PhoneGap等) and more..
  51. 51. アプリケーションとWeb技術 Windows8アプリ 参考 http://www.atmarkit.co.jp/fdotnet/special/ie10review01/ie10review01_01.html
  52. 52. アプリケーションとWeb技術 FirefoxOS ネイティブアプリ(例えば 電話アプリ)でさえも Web技術で作られている。
  53. 53. ゲーム機とWeb技術 • Nintendo Web Framework • Unity ( WiiU & Playstation & Xbox ) and more..
  54. 54. ゲーム機とWeb技術 • Nintendo Web Framework 参考 http://www.4gamer.net/games/032/G003263/20130328113/
  55. 55. カーナビとWeb技術 • • • • • • 富士通テン Tizen IVI Genivi Webinos QNX KDDI研究所 and more..
  56. 56. カーナビとWeb技術 富士通テン 参考 http://www.nikkan.co.jp/news/nkx0420131025beai.html
  57. 57. カーナビとWeb技術 Tizen IVI 参考 https://www.youtube.com/watch?v=HN2qL_meAek
  58. 58. テレビとWeb技術 • Hybridcast • SmartTV • OperaTV and more..
  59. 59. テレビとWeb技術 Sony BRAVIA (Opera TV Store) 参考 http://www.sony-mea.com/TVP-LCD-TV/feature/Sony-Entertainment-Network/498176
  60. 60. テレビとWeb技術 Hybridcast 参考 http://html5experts.jp/yusuke-naka/2810/
  61. 61. 電子書籍とWeb技術 • Kindle Cloud Reader • Kobo Cloud Reader
  62. 62. 電子書籍とWeb技術 Web技術が使えるデバイスとならば連動と利便 性を考え利用されている。 例: PCで10ページまで見たら スマートフォンで自動的に10ページから読める (iOS等30%取られる課金システムを回避ためとも)
  63. 63. 遠隔操作とWeb技術 • LiveShell • ガラポンTV • ChromeCast
  64. 64. 遠隔操作とWeb技術 本体にはほぼ操作する部分が存在しない リアルタイム通信をWebの標準技術の WebsocketやWebRTCを用いて実装 -> UI部分は容易に作れるWeb画面を使う -> スマートフォンなどの機器からも操作可能
  65. 65. 僕らが未来に対してできること。 ブラウザやWeb技術などは利用するだけで、も う水のように提供され続けていくもの。 ブラウザを開発する、Web技術を 加速させるためには 実は僕らにできることが沢山あります。
  66. 66. 僕らが未来に対してできること。 • Working Group W3Cが現在策定してる仕様の種がメーリ ングリストでやりとりされています。誰 でも参加が可能です。
  67. 67. 僕らが未来に対してできること。 • Test the Web Forward W3Cが策定したHTML5の仕様にブラウザ が準じてるかのテストケースをみんなで 作る
  68. 68. 僕らが未来に対してできること。 • html5j 英語部 W3Cが策定したHTML5の仕様を翻訳し公 開していく
  69. 69. まとめ • Web技術は常に進化を続けている • ブラウザの枠を越えて、どんなものでも 実行できるようになってきている • 提供されるものを利用するのではなく、 自分で仕様に参加できたり、貢献するこ とができる
  70. 70. 最後に ぜひ、Web技術に感心を持ってください! プログラムが書けるとか、書けないは関係 なく、Webがこうなったらいいな。と心に 貯めていることは外に出して、色々な議論 に参加したりすることが容易です。 「自分が考えた事が未来を変えれる。」 それがWeb技術の根幹にあります。
  71. 71. Thanks • @yoshikawa_t http://www.slideshare.net/yoshikawa_t/html5-27598924 • @komasshu https://www.youtube.com/watch?v=nXhEDC2qOLg

×