エキスパート紹介
春日井 良隆

マイクロソフトのエバンジェリストが提案する「IE11の歩き方」

2013年の10月17日にWindows 8.1とともにInternet Explorer 11（以下、IE11）がリリースされ、その約一カ月後にはWindows 7向けのIE11のダウンロードが始まりました。今回はそんなIE11の公式情報を整理してみたいと思います。

IEの2つのオフィシャルサイト

IEのユーザ向けのWebサイト

IEのユーザ向けのWebサイト

こちらのWebサイトではIEを使う人=ユーザーを対象に新機能や使い方、サポート情報をお届けしています。ブラウザでタッチが楽しめるContre JourやWindows 95にプリインされていたゲームをWebGLでリメイクしたHoverなど、IE11を体感できるコンテンツにもここからアクセスできます。ちなみにIE11は日本語版を含め全36言語で提供しており、さらに言語パックで59言語に対応しています。

IEデベロッパーセンター

IEデベロッパーセンター

こちらはIEの「開発者向け」のWebサイトです。MSDNデベロッパーセンターと呼ばれています。MSDNとは、Microsoft Developers Networkの略称で、IEを含め、Windowsや.NET、Azureなど、マイクロソフトのすべての開発者向けの情報は、このMSDNに集約されています。

IEデベロッパーセンターでは、IEの開発に関するあらゆる情報が網羅されています。たとえば、「開発者向けガイド」では、IE11、IE10、Xbox版IEのHTML5やCSS3、JavaScript、DOMといった仕様、互換性、F12 開発者ツールといったカテゴリ別に技術解説をしています。「互換性クックブック」では、旧バージョンからの変更点を中心に解説。IE11の互換性の変更点を確認したいときにはこのクックブックがお勧めです。旧バージョンのIEの技術仕様については「情報インデックス」から辿ることができます。

Windows 8では、モダンUIと呼ぶタッチ操作に最適化された新しいUIとデスクトップと呼ぶマウス&キーボードの操作を前提に設計された、これまでのWindowsのUIを踏襲する2つのUIを切り替えられるようになっています。IEもそれぞれに最適化されたUIを備えていますが、機能上の相違点があります（レンダリングエンジンは共通なので、HTMLやCSS、JavaScriptの挙動は全く同じです）。共通点や相違点については「IEの2つの閲覧エクスペリエンスを理解する」で詳しく解説されています。

左がデスクトップIE、右がモダンIE。モダン版は全画面表示がデフォルト

左がデスクトップIE、右がモダンIE。モダン版は全画面表示がデフォルト

その他、このIEデベロッパーセンターからは、ユーザ向けのWebサイトからアクセスできるプロモーションコンテンツの技術的な解説や標準仕様の検証結果をレポートするTesting Center、IE9から搭載された「ピン留め」の機能や実装方法、APIのリファレンスといった技術情報にもアクセスできます。

IEに関連する重要な4つのサイト

modern.IE

modern.IE

IEデベロッパーセンターのトップページからも直接飛べるこのサイトは、制作したWebページのWeb標準技術への対応や旧バージョンのIEとの互換性の問題点を自動的に検出してくれるサービスです。DOCTYPE宣言やjQueryのようなライブラリーのバージョン、CSSのベンダープリフィックスの付け忘れなどを指摘してくれます。

modern.IEのソースコードはGitHubで公開されているので、自社のシステムに組み込んでお使いいただく事もできるようになっています。さらにこのmodern.IEからは、Mac OS X、Linux、Windows 用の仮想マシンがダウンロードできるので、Mac OS XでWindows 7+IE10の検証環境を構築すると行ったことが可能になります。

modern.IEの詳細は同僚の物江が解説していますので、ご興味のある方は「OSの種別を問わず、無償でできる！modern.IE「4つ+1つ」のWebページ検証方法」をご覧ください。

仮想マシンのダウンロード

仮想マシンのダウンロード

Internet Explorer Test Drive

Internet Explorer Test Drive

HTML5と呼ばれる技術で実際にどのような表現が可能なのか？どのような機能を実装できるのか？マイクロソフトでは、それを実感頂くために様々なサンプルコンテンツをご提供しています。ブラウザのパフォーマンスを比較できるベンチマーク用のコンテンツも豊富に用意されてます。

HTML5 LABS

HTML5 LABS

このHTML5 LABSは2012年の春に設立された「Microsoft Open Technologies」が運営しているサイトで、マイクロソフトが検証している最新のHTML5の仕様に関する見解やプロトタイプを公開しています。過去にはWebSocketsやIndexedDB、現在はWebRTCに力を入れています。

マイクロソフトが提案し、W3Cにワーキンググループが作られたPointer Events（タッチ、ペン、マウスをPointerとして抽象化し、Eventを定義する仕様）もここからWebKit向けのプロトタイプがダウンロードできるようになっています。

Internet Explorer 10 のアクセシビリティ

Internet Explorer 10 のアクセシビリティ

マイクロソフトのアクセシビリティチームが運営するアクセシビリティ サイトでは、WindowsやOffice、IEなどのアクセシビリティについてご紹介しています。

ブログとSNS

「IEBlog 日本語」はマイクロソフト本社のIE開発チームが発信しているブログで、英語で投稿されてから数週間で、日本語を含めた7言語に翻訳される仕組みになっています。最新の開発状況箱のブログをご覧ください。

「Internet Explorer ブログ (日本語版)」は、HTML5Experts.jpメンバーであり、日本マイクロソフトでIEのデベロッパーマーケティングを担当する春日井と物江が主に書いているブログです。日本のイベント情報は、このブログとこの後ご紹介するSNSでご案内しています。

「Japan IE Support Team Blog」は、日本のIEサポートチームが書いているブログです。ユーザや開発者のみなさまからサポートチームに寄せられる質問を中心に取り上げています。

マイクロソフト本社と日本マイクロソフトが運営しているTwitterとFacebookは次の通りです。各国のIEチームも独自のSNSを持っていますので、興味のある方は検索してみて下さい。マイクロソフト・シンガポールは、マイクロソフト・台湾が生んだSilverlightの公式キャラ藍澤 光（あいざわ ひかる）の従兄弟という設定で、藍澤 祈（あいざわ いのり）というIEのキャラクターをFacebookページで展開しています。

最後に、html5jえんぷら部・部長の川田寛さんが、ものすごい勢いでご自身のブログ「ふろしき.js – 実用的なWeb技術を発信」で、IE11の、とくに業務システムでのIEについて情報発信をされています。SI目線でとても詳しく丁寧に解説されていますので、エンタープライズに関わる方にはお勧めです。

また、IE10とIE11で使えるHTML5仕様をざっと掴みたい場合は、HTML5Experts.jpエキスパートでもある羽田野太巳さんが書かれている「Internet Explorerで使えるHTML5の新機能」がお勧めです。

関連記事

  1. Windows 10の2つのWebブラウザ、Microsoft EdgeとInternet Explorer 11
  2. VR、AR、MR……各領域のプロフェッショナルが語るxR技術の最先端──Webの未来を語ろう 2018
  3. Microsoftの本気をみた！新しいWebブラウザ「Microsoft Edge」にかける思いとは？
  4. MS変革の立役者ナデラCEOが日本に来た！なんかマイクロソフトカッコいいぞ！─de:code 2016基調…
  5. de:codeで澤円さんが伝えたかった「エンジニアに必要なマネジメント」の真意とは？
'; js_seriesContent.className = "js_seriesContent"; js_seriesContent.innerHTML = js_seriestitle.innerHTML; js_seriesContent.appendChild(js_serieslist_ul); if ( js_parent.lastChild == js_superior ) { js_parent.appendChild(js_seriesContent); } else { js_parent.insertBefore(js_seriesContent, js_superior.nextSibling); } if (js_serieslist_li_length > 5) { document.getElementsByClassName('moveToSeriesTop')[0].style.display = 'block'; document.getElementsByClassName('moveToSeriesTop')[0].href = document.getElementsByClassName('seriesmeta')[0].getElementsByTagName('a')[0].href; } })(this, this.document); // ソーシャルボタンをクリックされたらgaに送信 var elements, i; elements = document.querySelectorAll('.sns-buttons > li > a.facebook-btn-icon-link'); for (i = 0; i < elements.length; i++) { elements[i].addEventListener('click', function() { ga('send', 'social', 'Facebook', 'like', '/ykasugai/4176/'); }, false); } elements = document.querySelectorAll('.sns-buttons > li > a.twitter-btn-icon-link'); for (i = 0; i < elements.length; i++) { elements[i].addEventListener('click', function() { ga('send', 'social', 'Twitter', 'tweet', '/ykasugai/4176/'); }, false); } elements = document.querySelectorAll('.sns-buttons > li > a.google-plus-btn-icon'); for (i = 0; i < elements.length; i++) { elements[i].addEventListener('click', function() { ga('send', 'social', 'Google+', '+1', '/ykasugai/4176/'); }, false); } elements = document.querySelectorAll('.sns-buttons > li > a.hatena-btn-icon'); for (i = 0; i < elements.length; i++) { elements[i].addEventListener('click', function() { ga('send', 'social', 'Hatebu', 'bookmark', '/ykasugai/4176/'); }, false); } elements = document.querySelectorAll('.sns-buttons > li > a.pocket-btn-icon'); for (i = 0; i < elements.length; i++) { elements[i].addEventListener('click', function() { ga('send', 'social', 'Pocket', 'bookmark', '/ykasugai/4176/'); }, false); }

週間PVランキング

  1. シグナリングサーバーを動かそう ーWebRTC入門2016
  2. 初心者でもわかる・できる！Arduinoを使った初めての電子工作実践
  3. 壁を越えろ！WebRTCでNAT/Firewallを越えて通信しよう
  4. Firebaseで作る簡単リアルタイムウェブアプリケーション（前編）
  5. Promiseで簡単！JavaScript非同期処理入門【前編】

新着記事

  1. 進化するWeb ～Progressive Web Appsの実装と応用～(de:code2018より)
  2. メルカリのフロントエンドチームが、どんな開発体制で技術選定しているのか聞いてきた！
  3. 2020年のプログラミング教育必修化で、未来はどう変わる？―教育現場の現状と課題・教材・義務教育のビジョンetc.
  4. 「改めまして、Progressive Web Appsと申します」── Web UXの新たな基準を考える
  5. AIファースト時代のSEOはどうなる？―辻正浩さんに“SEOに効く”Web制作でのポイントを聞いてみた！
HTML5Experts Works
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