HTML5でWebの世界も変わる。IE11とWindows 8.1が対応する技術「HTML5 Conference2013」

マイクロソフト春日井良隆氏のセッションテーマは「HTML5とIE11とWindows 8.1」。セッション冒頭、春日井氏は日常的に使用しているITデバイスを披露露。ソニー VAIO Tap 20のほか、iPadmini、Surface、Kindle Paperwhite、そしてiPhoneというデバイスを、用途別に使いこなしているという。

春日井さん

HTML5とJavaScriptという標準技術にWindowsは対応

「こういうデバイスの使い方は特別なことではなく、今後一般化する」と春日井氏は語り、今世の中で起こっていることを次のようにまとめた。

  1. デバイスの多様化
  2. タッチインターフェイス
  3. ローカルからクラウドへ

そして「デバイスの多様化で期待されている技術がHTML5である」という。デバイスはPCとタブレット、スマートフォンと3つに大きく分かれるが、OSもPCはWindows 8やMac、Linux、タブレットはWindows 8とiOSやAndroid、スマートフォンはiOSやAndroid、WindowsPhoneのほか、Tizen、Firefox OSなどのリリースが予定されている。このような状況だからこそ「HTML5の存在感が出てきている。これは特に今日のセッションで強調したいこと」と春日井氏は力強く語った。

このような状況下で、WindowsとHTML5とどのように関係にあるか。HTML5の特徴の3本柱は「セマンティック」と「互換性」「Webアプリ」だが、第二の互換性においては、マイクロソフトは「IE9でSameMarkupというコンセプトを打ち出した。これはブラウザーによって、あるいは、ブラウザーのバージョンによって、異なるマークアップをする必要はないという今の我々の開発姿勢だ」と春日井氏は言う。

第三のWebアプリについても、Windows 8のアプリは、「HTML5とJavaScriptという標準技術で作れるようになっている」と春日井氏。当然、jQueryのようなJavaScriptライブラリーはそのまま使えるのだという。Objective-CとXCodeの知識が必要になるiOSアプリ、JavaとEclipseが必要になるAndoridアプリの開発と較べ、敷居はぐっと下がるだろう。

また最近ではTitaniumやPhoneGap、CreateJSなどのクロスプラットフォームフレームワークが非常に注目を集めている。これらのフレームワークで使う技術はいずれもHTMLとJavaScript。このようにWindowsアプリは特別な知識を身につける必要はないというわけだ。Windows 8では「WinJS.xhr」というというWebコンテンツを呼び出す関数が用意されており、これを使えば簡単にWeb上のコンテンツをダウンロードしてアプリから利用できるようになるという。

とはいえ、これまでJavaやC++などで開発してきた人にとって、JavaScriptと言う言語が持つゆるさが好きではないという人もいるだろう。そんな人にお勧めの技術があるとして春日井氏が紹介したのは、「aulJS」というJavaScriptを生成する中間言語だ。altJSにも複数あり、「TypeScriptはC♯を開発した人が開発した中間言語。同言語を紹介したサイト(http://www.typescriptlang.org/)に行くとJavaScriptとのコーディングの違いを体験でき、サンプルも手に入る」と言う。この際に試してみるものお勧めだ。

Web系開発ツールとしても有効な「Visual Studio」

次に春日井氏が取り上げたのが「Visual Studio」である。「Visual StudioはWindowsの開発ツールというイメージが強いが、Webアプリの開発する上で非常に効果的なツールになっている」と春日井氏。

それを証明するためデモを実施。例えば<video>というタグの後では次の設定内容はほぼ決まっている。Visual Studioではタブを2回押すことで、予想変換のように想定されたプログラム内容が勝手に表示されるようになっている。

CSSのカラー設定も「非常に効率的になる」と春日井氏はデモを実施。カラーパレットから指定することはもちろん、スポイトで直接色を抜き取り指定することができる。
「和文フォントが出ないという弱点はあるが、コーディングの作業を効率化する機能がかなり入っている。Visual Studio Expressというフリー版もあるので、ぜひ一度、試してほしい」(春日井氏)

IE11は「Touch」「WebGL」「MPEG-DASH」「Encripte Media Extension」サポート

最後に春日井氏が説明したのはIEについて。「IEではJavaScriptの処理のスピードの高速化を図っている。IE10と比べてもIE11では処理時間は高速化されている。他のブラウザと比較しても処理時間は短い」

最新のIE11では「Touch」「WebGL」「MPEG-DASH」「Encripte Media Extension」という4つのWeb標準をサポートしている。これからのデバイスはタッチも使えばマウスやペンも使うため、Pointerという概念でまとめてAPIをつくっている。「pointer events」を使って実装することで、マルチタッチが可能になる。「この仕様を検討するワーキンググループがW3Cに設立された」と春日井氏。

次の「WebGL」とは3Dの表現がブラウザの中でできるという技術だ。「3Dはエンタメのコンテンツだけに必要な技術ではない。例えばCADのデータをブラウザの中で表現することができるようになる。ビジネスの世界でも使える」 残りの2つの技術については、http://ie.microsoft.com/testdrive/HTML5/eme/で紹介されているので、こちらを見てほしい。

WebRTCなど注目技術への対応はどうなっているのかなども気になるところだ。しかし、それは「IEというブラウザが抱えるユーザー層が大きく影響している」という。というのもIEはエンタープライズのお客さまが多いのはもちろん、いわゆるブラウザというと青いeのマークという風に覚えているITにそれほど詳しくない一般ユーザーが多いこと。

そのため、安定している仕様、セキュリティ面で不安のない仕様を実装することに気を配っているというのである。IE9でWebSocketに対応しなかったのもそれが理由だったと春日井氏は明かす。とはいえ「当然、研究、検証はしており、その成果はHTML5LABSで発表している。ここでOKが出ればIEに実装していくことになる」とのこと。新しいHTML5への対応については、HTML5 LABS(http://html5labs.interoperabilitybridges.com/)をで紹介されているので、ぜひチェックしてほしい。

読み上げ機能や音声認識機能を標準で実装

そのほかにも最新のIEでは強化・改善された機能がある。第一にアクセスビリティの強化だ。読み上げ機能や音声認識機能を標準で実装。マイクを使えば音声だけで検索することもできるという。第二はF12開発者ツールも用意していること。F12キーを押すだけで日本語化された開発者ツールが起動する。「ここにいる開発者の方にぜひ使って欲しい」と春日井氏。

第三はIE11からドキュメントモードは非推奨となっており、Edgeモードという最新のレンダリングエンジンが優先されるようになったこと。条件付コメントはただのコメントとなる。「ブラウザのバージョンを指定したい場合は、メタタグを使って指定する」こととなると、その指定の仕方を紹介した。

自分の書いたコードに不安がある場合は、正しいかどうか、チェックするサイトをマイクロソフトでは用意しているという。それが「modarn.IE(http://loc.modern.ie/ja)」である。春日井氏は同サイトでも紹介されている「Brouser Stack」という有償のサービスについて説明した。「Brouser Stack」Web上で仮想環境をエミュレートするサービスで、例えばiOS6のSafari6でレンダリングするとどうなる、WindowsXPのIE10でレンダリングするとどうなる、という見え方がわかるというサービスだ。「互換性のチェックなどに使えるので便利。3カ月間は無料で使えるので、試してほしい」

セッションの終了の間際に春日井氏はキネクトのデモを実施。「体のジェスチャーで操作ができる時代ももうすぐ。Webは何かを見るためではなく何かをするためのプラットフォームになる」と春日井氏。デザインはもちろん、使い方も変わっていかざるを得ない。開発者も変わっていくときにきているのかもしれない。

(レポート:中村仁美/撮影:串田幸江)

【講演資料・セッション映像】

Powered byNTT Communications

tag list

アクセシビリティ イベント エンタープライズ デザイン ハイブリッド パフォーマンス ブラウザ プログラミング マークアップ モバイル 海外 高速化 Angular2 AngularJS Chrome Cordova CSS de:code ECMAScript Edge Firefox Google Google I/O 2014 HTML5 Conference 2013 html5j IoT JavaScript Microsoft Node.js Polymer Progressive Web Apps React Safari SkyWay TypeScript UI UX W3C W3C仕様 Webアプリ Web Components WebGL WebRTC WebSocket WebVR