HTML5の今とこれから
13 likes9,576 views
WEBディレクターと企画担当者の方向けに行った「HTML5の今とこれから」という発表スライドを整理したものです。
HTML5の今とこれから
- 8. 2012年12月17日ついに勧告候補に。 仕様作りはほぼ 終わりましたよ。 みんな使ってみてネ First Public Working Draft Working Draft Last Call Candidate Recommendation Rroposed Recommendation Recommendation HTML5は仕様が完成 （正確にはHTML5とCanvas 2D context） 2008年1月 2012年12月 HTML5タグの仕様は、2012年の12月17日によう やく勧告候補という段階にいきました。 「勧告候補」とは、仕様づくりがいったん終了した 状態。広くみんなに利用を呼びかけて何か不具合が あったら教えてね、という段階です。 英語ではcandidate Recommendationといい、 CRと略されたりします。 この段階までくると大幅な変更はもうないと言われ ていて、安心して使えるようになったな、という感 覚です。 （追記） とはいえ2013年4月には、<main>タグが追加され るという比較的大きな変更がありました・・。
- 9. なぜ注目されるのか
- 10. 2008年1月 HTML5草案発表 2008年7月 iPhone3G発売 ジョブズ 「Flashをサポートしないから HTML5でやってね」 きっかけはiPhone(？) HTML5って？ 2004年 Web application 1.0発表（WHATWG) ざわざわ ざわざわ HTML5が注目されるようになった理由は 諸説ありますが、やはり大きなきっかけは iPhoneの登場なのかなと思います。 iPhoneが発売された際、アップル社の故ス ティーブ・ジョブズは「iPhoneではFlash をサポートしない。動画などのコンテンツ はHTML5を使って欲しい」といった趣旨 のコメントを出しました。 これまで動画含めリッチなコンテンツは Flashで作るというのが当たり前になって いたので衝撃が走りました。 そのときに「で、HTML5っていったいな に？」と注目されていきました。
- 11. WEBサイトをつくるための技術だったHTML CSS Javascriptが アプリケーションを作れるくらいに進化 WEBサイトを超えて WEBサイト アプリケーション これまでのHTMLは、動きのないWEBペー ジを作るための言語でした。 HTML5になってもっとも大きな変化は、 その用途が変化したというところです。 ゲームや普段パソコンにインストールして 使っているような、アプリやソフトウェア と言われているものまで作れるように進化 したものがHTML5です。
- 14. HTML5でサイト制作
- 16. HTML5に強いブラウザ98％ ブラウザシェア(日本) PC スマートフォン IE7 : 4% IE8 : 22% IE9 : 20% 2%1% 45% 52% iOS Android Opera 他 HTML5に強いブラウザ50% 2013年2月 ブラウザシェア HTML5のさまざまな機能 は、実はPC用サイトでは、 まだそれほど使えません。 ブラウザのシェアでIE8と9が 大きな勢力を持っており、こ のIE8と9はHTML５の機能に ほとんど対応していないため です。 一方、スマートフォンでは、 iPhoneのsafariとAndroidの Browserで98%のシェアを わけあっています。 これらの2つのブラウザは HTML5にある程度対応して いるため、HTML5はスマー トフォンサイトで主に利用さ れています。
- 18. アプリ化機能たちは限定的 Drag & Drop Canvas Videoタグ Web Storage 【現状でも限定的に使える機能例】 HTML5をつかってPC用のアプリを作っていくのはま だ時期尚早と言えそうです。 さきほども言ったとおり、HTML5に対応していない ブラウザがシェアの半分を占めているためです。 IE8や9が根強く残っているうちは、いくつかの機能 しか使えません。 IE10からは本格利用OK！ 現在の最新バージョンであるIE10 はHTML5をサポートしていま す。 IE8,9が少数派になり、IE10以降 が大きなシェアをもつようになっ て、ようやくアプリ化機能が安心 して使えるようになります。 予想としては2年後くらいになる のかなと思っています。
- 20. スマホアプリ開発
- 22. いまのスマホアプリは ネイティブアプリ Objective-C Java C# Vidual Basic それぞれの端末で、別々の言語 スマートフォン用のアプリを作る際、 現状では、OSによって別々の言語でそ れぞれ作る必要があります。 例えば、iPhoneはObjective-Cという 言語をつかってアプリを作らなくては いけませんし、Android用にはJavaを 使って、Windows Phone用にはC#な どの言語を使ってアプリを開発しなく てはいけません。 これらの端末でアプリが使えるように するには、１つのアプリを提供するの にも、３つの言語でそれぞれ作ること になります。
- 25. ネイティブのような機能 ・Application Cache ・Web storage ・Device API たとえば上記の機能をつかえば、 HTML5アプリでもネイティブのような体 験が提供できる。 オフラインでも 動いちゃう！ カメラやセンサー などを使えちゃう！ HTML5アプリで、ネイティブアプリのような アプリを作ることができるのでしょうか？ HTML5アプリとはブラウザ上で動くプログラ ムなので、ネイティブアプリのようにiPhone の傾きを使った機能が使えなかったり、電波 の届かないところでは画面が消えてしまったり するのではないか？と思う方もいます。 しかし、一般的に思われている以上にHTML5 ではいろいろなことができます。 たとえば、Application Cache（アプリケー ションキャッシュ）や、Web storage（ウェ ブストレージ）といったHTML5の機能を使う ことで、オフラインでも動くアプリが作れま すし、Device APIを使うことで、iPhoneのセ ンサーを使ったアプリをつくることができま す。工夫次第でネイティブアプリと同様のユー ザー体験を提供することができるのです。
- 29. ネイティブアプリ Objective-C Java C# Vidual Basic それぞれの端末用に開発スキルが必要 HTML5アプリ HTML+CSS+Javascript 1つの言語でOK（低コスト） 独自に配布しないといけない ネイティブに比べて遅い ○ バージョンアップや変更も簡単○ 決済・広告配信等の機能を時前で用意 デバイス固有の機能が統一されていない 内容に制限がない○ ストアを通じて配布できる レスポンスが良い バージョンアップや変更に時間がかかる 決済機能がついている デバイス固有の機能 内容の審査がある（主にiPhone） ○ ○ ○ ○ ネイティブアプリとHTML5 アプリのメリット・デメリッ トを整理してみました。 現時点で、それぞれ一長一短 あり、どちらが優っていると は言えませんので、アプリの 種類やビジネスモデルに応じ て開発方法が選択されていま す。 HTML5で現状もっとも問題 視されているのは、「ネイ ティブに比べて遅い」という ことです。 特に多くのグラフィックを動 かすゲームなどのアプリでは 問題となっています。
- 34. これからのHTML5
- 37. HTML5ベースのモバイルOS TIZEN OS TIZEN（タイゼン）というOSの搭載された端末が 2013年にドコモから発売されます。この端末では、最 初からHTML5アプリの利用を前提として作られてお り、HTML5で開発されたアプリを手軽にインストール し、ネイティブアプリのように使うことができるよう になっています。 スマートフォンのアプリを、iOSやAndroidのように閉 じられたものにするのではなく、オープンに自由に開 発・配布・インストールできるようにしよう、という 考え方に多くの企業が賛同しているようです。 他にもFirefox OSやubuntu touchなど、モバイルOS 第3極と呼ばれる競争も起き始めています。 HTML5アプリが盛り上がるに連れて、どこかのタイミ ングでiPhoneやAndroidでもHTML5アプリが簡単に インストールできるような仕組みに変化するのではな いかと、僕は考えています。