連載

2013年1月10日

2013年、Webがこうなったら面白い：UXClip（16）

今年は「HTML5仕様に何％準拠！」なんて宣伝文句をベンダ側が提示してくるようになるかもしれない

LINE

Hatena

　新年、あけましておめでとうございます。

　HTML5開発者コミュニティ、html5j.orgを運営している白石俊平です。

　この記事では、「2013年、Webがこうなったら面白い」というテーマで、今年のWebがどう変わっていくか、予想めいたことを執筆する機会をいただきました。タイトルに「面白い」と含まれていることからもお分かりの通り、真剣に業界を予想してみるというものでもなく、少し力を抜いた雰囲気で、発展の著しいWebの未来をあれこれ述べてみたいと思います。どうか読者のみなさんも、リラックスしてお読みください。

　とはいえ、現在のWebは広く深く、3次元的に発展している状況で、どのような切り口で述べるべきか悩みました。悩んだ挙句、ここでは以下の3つの切り口から見ていきたいと思います。

注目に値する最先端仕様
プラットフォームとしてのWeb
Web制作・開発はどう変わるか

注目に値する最先端仕様

HTML5の仕様策定完了とその影響は？

　現在のWebは、W3Cで策定されている仕様と、（ブラウザ）ベンダたちの実装が、追いかけっこしながら進化している状況だといってよいでしょう。しかしどれほど実装が先行しようとも、それが仕様として標準化されなければ、その技術は広く利用されない（≒ 存在しない）のが2010年代のWeb業界です。従って、Webの未来を占う上では、まず仕様の動向を探るのが最も近道でしょう。

　仕様といえば、HTML5の仕様策定が完了したことが昨年末の大ニュースでした（アナウンスされたのは12日17日でしたが、いま振り返ると12月25日にしてくれれば、「W3Cからのクリスマスプレゼントだ！」などとさらに評判になったでしょうね）。

　この「仕様策定完了」というニュース、厳密にいうとHTML5仕様とCanvas 2D Contextが「勧告候補」（CR: Candidate Recommendation）というステータスに到達したということです。W3Cの定義では、このステータスに到達すると、「仕様が固まったから実装してみてね」と広く呼び掛けるという意味を持っています。

　なので、ブラウザベンダたちにとっては、今年はHTML5仕様を厳密に実装することが最優先になるのかもしれません（HTML5のCRが、ブラウザベンダにとってどれほどの重要性を持っているかは知りませんが）。いままでは、サードパーティ製のテスト（例えばCan I Use）によってしか実装度合いが測られて来ませんでしたが、今後は「HTML5仕様に何％準拠！」なんて宣伝文句をベンダ側が提示してくるかもしれませんね。

　また仕様が固まったからといって、進化がそこでいったんストップするわけではありません。

　すでに、次期バージョンであるHTML5.1とCanvas 2D Context Level2の仕様書は公開されていますし、「エクステンション」という形で既存仕様を拡張するという手段も模索されています。具体的には最初の拡張仕様として、「文書のメインコンテンツ」を表し、一文書中に一回しか使用できない、main要素についての仕様書が公式に公開されました。

　HTML5仕様が2014年の勧告に向けて成熟する中、新しい機能の取り込みについても活発に行われるのは間違いなく、今年もその動向が注目されます。

その他、注目すべき仕様は盛りだくさん

　また、HTML5以外の仕様にも、注目を要するものがいくつもあります。

　WebRTCは、「Webアプリでビデオ会議を可能にする」技術だといえば分かりやすいでしょう。具体的には、カメラやマイクからのメディアデータ取り込み、およびP2Pによるバイナリデータの送受信が仕様の中心となります。

　WebRTCは、昨年8月に仕様のドラフトが初公開された後、ブラウザベンダによる実装が活発に進められています。今年中にはP2P機能も含めた実装が利用可能になるでしょう。ビジネスとしての活用事例が登場するのはもう少し先になるでしょうが、技術者としては注目しておきたいところです。

　Webアプリ間の連携だけではなく、ホームネットワーク内での活用も目されてきたWeb Intentsは、残念ながら仕様自体が問題を抱えていると判断され、Google Chromeからも実装が削られてしまいました（そこら辺については、小松健作さんのブログ記事が詳しいです）。しかし、ホームネットワーク上でのWeb技術仕様はこれからも活発に模索され続けるでしょうし、引き続き「熱い」分野であることは間違いないでしょう。

　Webアプリによる3D表現を可能にするWebGLは、IE以外のブラウザで実装が進められています。現在WebGLの普及の足かせになっているのは、「IEで使えない」ことと「モバイルで使えない」「これらで使えるようになったとしても、非対応ブラウザのシェアが非常に大きい」ことだと思われます。こうした足かせが今年中に外れるとは思えませんが、来るべき「3D Web」の時代に向けて、準備を整えておくことは重要でしょう。

　また、CSS3の進化からも目が離せません。新しいレイアウト方法としてはFlexboxやGrid Layout、Webページのマスク処理を可能にするCSS Exclusions、要素を超えたコンテンツの流し込みを可能にするCSS Regionsなど、これまでのCSSスタイリングの常識を覆すような仕様が数多く存在します。今年は、こうしたCSSの新機能が次々にブラウザによって実装されるでしょうから、新たなWebデザイン手法の模索が世界中で行われる1年になるのは間違いありません。

プラットフォームとしてのWeb

　昨年から、従来OSが担ってきたような「アプリケーションプラットフォーム」のレイヤを、Web技術によって置き換えようとする動きがとても活発になってきました。あまりに活発で、その広がりのスピードに仕様策定が追い付いていないのが現実でしょう。

　まず、オペレーティングシステムとしてのWeb技術の活用です。この分野で、筆者にとって特に興味深いのは、Google Chrome（OS）とFirefox OSの動きです。

　Google Chrome（OS）は、かなり以前から自身を単なる「ブラウザ」ではなく、アプリケーションをインストール可能な「プラットフォーム」として位置付けていました。しかし当初は、「Webアプリへのショートカットを、Chromeに『インストール』できる」ことを重視していたようです（「Chromeアプリって、Webページのブックマークと何が違うの？」という疑問を抱いていたのは、筆者だけではないはずです）。

　そんなChromeでしたが、昨年からは明らかに「パッケージ型アプリ」へと比重を移したようです。ここでいうパッケージ型アプリとは、HTML/CSS/JavaScript/画像など、自身が必要とするリソースをすべてzipアーカイブし、インストール後はオフラインでも起動可能なアプリケーションを指します。

　そうした方向転換に伴い、アプリケーションが満たさねばならないセキュリティ要件の厳格化や、Chrome上でのみ利用可能な独自のAPIをすさまじい速度で実装しています。

　対してMozillaは、以前から「WebAPI」としてさまざまなAPIを独自に提案していましたが、現在システムアプリケーションズ・ワーキンググループで、それらを次々に標準化の俎上に上げています。筆者はW3C内の動きはよく知らないのですが、そうした「システム系」APIの標準化については、Mozillaがかなり主導している印象を受けます。

　筆者としては、Googleが独自のAPIを大量に投入し始めたころ、それによってWebプラットフォームの断片化が引き起こされてしまうのではないかと、少し危ぶんだのを覚えています。しかし、システム系APIの標準化を精力的に進めているMozillaの動きが、そうした断片化の問題に対する一筋の光明にも思えています（それにGoogleも、プラットフォームの断片化を促進させるような愚を働く企業とはとても思えませんが）。

Web制作・開発はどう変わるか

　さて、Web技術が激しく進化し、その適用範囲を広げる中、筆者らエンジニアがWebページを作っていく手法にはどのような変化が訪れるでしょうか。

ツール／フレームワーク

　昨年1年を思い返すと、JavaScriptを活用したWebページが爆発的に進んだ年といえるでしょう。従来のFlashが担ってきた埋め込みコンテンツをHTML5で実装するのは普通になりました。また、パララックススクロールという手法が流行したことからも分かる通り、Webページを全画面JavaScriptでリッチ化するのも、珍しいことではなくなりました。JavaScriptに関する初心者向けの書籍が市場にあふれていることからも、それは明らかです。

　今年もそうした傾向はさらに続くことでしょうが、同時に、「JavaScriptを知らなくてもリッチなページを作れる」ことをウリにしたツールやフレームワークが、今年は一層活発にリリースされることでしょう。

　例えばAdobeは、昨年9月にEdge Toolsをリリースしており、アニメーションを構築するためのIDEである「Edge Animate」、昨今のWebエンジニアが望んでいる「軽くて」「Web開発に特化した」エディタである「Edge Code」などを含んでいます。また、アニメーションやグラフィックプログラミングを容易にする「CreateJS」や、モバイル向けUIフレームワーク「jQuery Mobile」、Web技術を用いてモバイル向けネイティブアプリを作成できる「PhoneGap」などのフレームワーク開発も強く支援しています。ツールやフレームワークに関しては、たくさんのベンダが製品をリリースするでしょうが、Webデザイナから圧倒的に支持されているAdobeが、まずは市場をリードしていくのは間違いないように思えます。

全てのWebページが「アプリケーション」に近づいていく

　WebページがJavaScriptでどんどんリッチになっていくと、次第に「Webページ」は「アプリケーション」と区別が付かなくなっていきます。

　そうなると、「単一ページアプリケーション」として構成されるWebサイトも増えてくるでしょう（「単一ページアプリケーション」とは、複数ページから構成されているように見えて、実際は1つのDOMに読み込まれているようなWebサイトです）。

　こうした動きは、URLをJavaScriptから自由に操作できるHistory APIをサポートするブラウザが広まっていること、jQuery Mobileや各種のMVCフレームワークが、単一ページアプリケーションを想定していることによって加速しています。ページ全体をリフレッシュする場合と比べて、ユーザビリティに優れる場合が多いですし、サイト全体に渡るJavaScriptプログラミングなどは、かえって楽になる場合が多いものです。

　とはいえ、単一ページアプリケーションには、DOMの肥大化を防ぐ工夫やSEOとの親和性、トラッキングコードとの兼ね合いなど、考慮しなくてはならない問題がいくつもあります。

　こうした問題に対する対処が世界中で議論されつつ、今年は単一ページから成るWebサイトをさまざまなシーンで見掛けるようになるのは間違いないでしょう。

Webサイトのオフライン化

　また、Webサイトのオフライン化も、今年大きな流れになるのは間違いありません。オフライン化することのメリット（オフラインでも閲覧可能、キャッシュを利用するため読み込みが速い、サーバの負荷を軽減できる、等）がだんだん浸透しており、海外でもWebサイトのオフライン化を扱うトピックが増えてきました。昨年末、「オフラインファースト」という記事が海外では話題になったことからも、それがうかがえます。

　余談ですが、筆者は2007年に「Google Gears」という、オフラインWebアプリケーションを実現する技術についての書籍を上梓して以来、ずっとオフラインWebについては注目していました。

　何年も何年も、「はやるか？」と期待しては裏切られてきていまして……、2013年という年には、とても期待しています（そしてまた裏切られたりして……）。

モバイルアプリ開発でも、Web技術が活躍

　また、モバイルアプリを開発する技術として、Web技術が活用されるシーンも増えていくでしょう。

　こうした「ハイブリッドアプリ」の分野では、昨年Facebookが「HTML5に賭けたのは失敗だった」との見解を発表したことから、ネガティブな印象が広まってしまいました（その後、Sencha Touchというフレームワークの開発元が、「Facebookアプリが遅かったのはHTML5のせいじゃない」ことを実証するためのデモアプリを作ったりしていますが）。

　しかし、Web技術での開発は「開発者の調達のしやすさ」「マルチプラットフォーム性」という、明らかなコスト上のメリットがあります。PhoneGapをはじめとしたハイブリッド型のアプローチはもちろん、Titanium Mobileなどの動向にも注目です。

Webエンジニアを支援するコミュニティ活動もより活発に

　最後に少し毛色の違う話を。

　ここまで述べたように、Web技術は今年もその進化を止めることはないでしょう。つまり、「学ばねばならないこと」がどんどん増えていくということです。こうした、「常に学び続けていかなければならない」という悩みを少しでも和らげているのが、大小さまざまのコミュニティや勉強会であることは間違いないでしょう。筆者が主催しているhtml5j.orgも、そうしたコミュニティ活動の1つです。

　html5j.orgは、「Googleの準公式コミュニティ」というブランドイメージも手伝ってか、幸いなことに5,000人以上の参加者数を得ており、昨年は初めて大規模なカンファレンスを主催することができました。

　そして今年のhtml5j.orgは、「壁を超える」ことをテーマにしつつ、より活発な活動をしていきたいと考えています。

　html5jが超える壁とは、例えば「Webデザイナとデベロッパの間にある『壁』」だったり、「首都圏と地方の間にある『壁』」などです。

　その手始めに、まずは2月、九州で開催されるイベントに協力することにしました。2月9日は福岡の「HTML5 Curnival Fukuoka」、10日は宮崎の「HTML5カンファレンス宮崎 2013」の主催に加わっています。普段は東京でしかなかなか見掛けることのできない、かなり豪華なスピーカー陣を揃える予定ですので、九州に在住の方はぜひ参加をご検討ください！また、まだアイデアのレベルではありますが、Webデザイナ向けの活動も活発にしていく予定です。どうかご期待ください。

　html5j.orgは、「世界で一番Webコミュニティが活発な国、日本」というビジョンを掲げています。このビジョンを実現するにあたり、html5jは日本中のWebコミュニティをつなげることのできる「コミュニティのハブ」を目指しています。Webコミュニティを運営している方々、@Shumpeiまでお気軽にお問い合わせください。

白石俊平（@Shumpei）

Google API Expert（HTML5）

HTML5開発者コミュニティ「html5-developers-jp」管理人

株式会社オープンウェブ・テクノロジー代表

HTML5関連でいろいろ活動中。いまはHTML5をビジネスに活用すべく、日々奮闘中です。第1弾サービス、「DaVinciPad」は順調に稼働中。趣味は子どもたちと遊ぶこと

「UX Clip」バックナンバー