レポート

脱IE6を果たしたエンタープライズのWebシステム,そしてHTML5 ~「業務システムエンジニアのためのHTML5勉強会#03」活動報告

この記事を読むのに必要な時間:およそ 5 分

レガシーIEで扱われてきたWebシステム,今後の方向性について,デベロッパとIT管理者の2つの観点から,それぞれの専門家に解説いただきました。

村地氏(左⁠⁠,小山田晃浩氏(右)

村地氏(左),小山田氏(右)

IEの技術にロックインされた,Webシステムの問題と改善

デベロッパ視点では,IEのMicrosoft MVPである小山田晃浩氏(株式会社ピクセルグリッド)をお招きし,新しいIEとJavaScriptで動く 最近のWebアプリケーションというテーマで解説していただきました。

小山田氏はまず,新しいIEで動かないWebページの例をいくつか挙げ,WebページがなぜIEのバージョンで縛る必用があるのか,その理由が次の点にあると述べました。

  • Quirks Modeで実装している
  • IE独自拡張の利用に頼っている
  • プラグインの利用に頼っている
  • 不確定要素があり動作保証できない

HTMLドキュメントがどのバージョンのWeb標準にしたがって記述されたかを意味するDOCTYPEは,指定の方法次第では,Quirks Modeと呼ばれる古いIEの動作に合わせてWebページを表示させてしまいます。この動作モードでは,解釈が標準とは異なる動作となり,Webページの相互運用性を低下させます。正しく設定する必要があります。

IEには,ActiveX,VBScript,Data Binding,VMLなど,独自拡張機能があります。そしてその多くは,JavaScriptやdata属性,SVGなど,HTML5で追加された機能で実装可能になりました。要プラグイン技術は,Flash,Javaアプレット,Silverlightなどが挙げられます。そしてこれらもまた,動画ストリーミングなどで依存せざる得ない部分もありますが,多くのことはJavaScriptでも実現可能になりました。

レガシーなIEの独自機能に依存した作りを持つWebページの維持が必要な場合,独自拡張を延命させる「互換モード」という手段が活用できます。例えばIE9では,IE7,IE8のエンジンも持っており,古いIEをほぼ再現させることができます。ただし,エンジンであるTridentのバージョンは変わりますが,JScriptのバージョンは最新が維持されてしまうなど,完全では無いという点で注意が必要です。

画像

デベロッパ視点で見た,これからのWebシステムが向かう先

最近のIEは,JavaScriptの性能が向上しました。また,IE9からはHTML5で追加された新技術をサポートするようになりました。こうした背景から,標準技術だけで,リッチなWebアプリケーションを作る流れが生じました。

標準技術を用いたWebアプリケーションでは,画面をすべてサーバから再読み込みさせる方式とは異なり,Ajaxを用いたJSON形式によりサーバサイドからデータのみを取得し,フロントエンド側のJavaScriptで処理し画面の生成までを行うことで,インタラクティブなUIを実現することが可能となります。これらはすべて,HTML,JavaScriptなどのオープン技術だけで実装されます。jQueryやBackbone.jsなど様々なJSライブラリの力を借りて,実現することができます。

画像

――最後に小山田氏は,⁠フロントエンド(Webのクライアント)では標準の技術を使うべき」と主張しました。

IEの視点から見る,Webシステムの短期的対策

IT管理者視点では,IEのMicrosoft MVPである村地彰氏(株式会社シー・ピー・エス)をお招きし,IT管理者と新しいIEというテーマで解説していただきました。

村地氏は,WindowsとIEのリリースサイクルの変化から,短期的対策・中長期的対策の重要性と具体的な方法について話がありました。

WindowsやIEのリリースサイクルは,近年高速化しています。IE6からIE7は4年10ヶ月も開きがありましたが,IE9からIE10は,僅か1年7ヶ月しか間がありません。これまでMicrosoftが行なってきた10年というサポートライフサイクルにも,見直しが起こる可能性があります。また,Windows/IEのバージョン統一が難しくなり,バージョン間の動作・レイアウトの課題が拡大し,IT管理者はユーザ教育・ユーザサポートコストの増大を想定する必要があるでしょう。

短期的対策では,互換モードや互換性検証の活用が挙げられます。

「互換モード」がどのようなものかは小山田氏から説明がありましたが,その設定方法については,イントラネット ゾーンのサイトは既定で互換モード表示であったり,ユーザに互換表示ボタンのクリック,HTTPヘッダやHTMLドキュメント内のmetaタグで互換表示指定,Microsoftの提供する互換表示リストなど,様々な手段で設定が可能です。ただし,Windows8よりスタート画面のIEからは互換モードが削除されており,この機能の永続性には不安が感じられます。

「互換性検証」では,既存のWebページ/Webアプリケーションの互換性上の問題点を検証します。IEと非互換の部分,改善すべき部分とその改善方法を確認します。検証の方法としては,Compat Inspectorの利用が有益です。具体的には,Compat InspectorをFidlerと呼ばれるプロキシツールを利用してHTMLドキュメント内に挿入し,互換性スコアを確認し改善を図ります。

画像

IEの視点から見る,Webシステムの中長期的対策

中長期的対策では,ベンダー・バージョンロックインの回避,Webの本質に立ち返ることの2つが挙げられます。

「ロックインの回避」とは,Web標準への準拠を指します。ActiveXなどのIE独自拡張を完全に避けることは難しいかもしれませんが,出来る限り利用しない努力をすべきです。HTTPヘッダなどのUser Agent/Browser Versionを利用したWebブラウザの限定化も避けるべきでしょう。IEの独自性を活かすようなHackをするのでなく,独自性を理解し利用を避けるという選択を行うべきです。業務システムでは細かいレイアウトの指定を求めることがありますが,こうした些細な違いを気にし過ぎないことも重要になります。

「Webの本質」は,アプリケーションの開発/展開をスピーディにできたり,業務内容/環境の変化に対応できる,業務の効率化とスピードアップにつながるといった点で,価値を発揮できるところにあります。また,Web標準のメリットには,クライアント選択の柔軟性,デバイス選択の柔軟性,空間の柔軟性が挙げられます。

画像

―――最後に,村地氏もまた小山田氏と同様に,⁠互換表示はあくまで短期的対策であり,Web標準への準拠こそが重要な中長期的対策である」と主張しました。

著者プロフィール

川田寛(かわだひろし)

元NTTグループのSE。現在はピクシブ株式会社にて,テクノロジーで世の中のクリエーターをハッピーにする方法を模索しています。「ふろしき」の愛称で,「html5jパフォーマンス部」「日本Cordovaユーザーグループ」といったコミュニティを立ち上げたり,「東京 Web パフォーマンス」というコアなエンジニア向けの勉強会を主催したり,Webの標準化(W3C)の議論にほんの少しだけ横槍を入れてみたり。

Microsoft MVP 2014/2015受賞。HTML5 Experts.jpエキスパート。Developers Summit(翔泳社)ステアリングコミッティー。「Web標準技術ではじめる,Webのパフォーマンス改善(Software Design 2014年5~7月号)」他,多数の技術雑誌への寄稿も行う。