その web サイト、その web アプリを最新の ie11 に対応しよう

Post on 02-Jul-2015

5.572 Views

Category:

Technology

7 Downloads

Preview:

Click to see full reader

DESCRIPTION

Microsoft Conference 2014 でのセッションスライドです。 古い Internet Exolorer 向けに作られた Web コンテンツを Web 標準に準拠した Internet Explorer 11 用に移行する手順と方法について紹介します。

TRANSCRIPT

The Microsoft Conference 2014

ROOM C

Web Internet Explorer 11

Internet Explorer Web

The Microsoft Conference 2014

企業のニーズ

Web~新旧アプリ対応をめぐるジレンマ~

既存資産との互換性 最新の Web 標準への対応

現行の Web アプリ 新規構築するWeb アプリ

Web 標準への対応パフォーマンスの向上セキュリティの強化

信頼性の向上

既存アプリの有効活用テスト費用の削減アップグレードに伴う作業の軽減

Internet Explorer

~それまでの機能を強化し、できなかったことが可能に~

Web /HTML5

Internet Explorer

2016 1 12 Windows OSInternet Explorer

Windows Internet Explorer 延長サポート終了

Windows Vista SP2Internet Explorer 9

2017年 4 月 11 日

Windows Server 2008 SP2

2020年 1 月 14 日Windows 7 SP1Internet Explorer 11

Windows Server 2008 R2 SP1

Windows 8.1 Internet Explorer 11

2023年 1 月 10 日Windows Server 2012 Internet Explorer 10

Windows Server 2012 R2 Internet Explorer 11

The Microsoft Conference 2014

Internet Explorer

Internet Explorer 7

Internet Explorer 8

Internet Explorer 9

Internet Explorer 10

Internet Explorer 11

Internet Explorer 6

Windows XP

Windows Vista Windows 7

Windows 8 Windows 8.1

既存資産の情報収集

優先順位付け 計画と実施

業務担当者、利用者、開発者からの聞き取り

販売店、開発元に問い合わせ

• ビジネスインパクト

• 利用範囲

• 利用者数

1. 重要ではない

2. あると便利

3. 必要(クリティカルではない)

4. 重要

5. ミッションクリティカル

• 暫定的な対応• 後方互換機能

• 仮想化

• 中長期的な対応• 修正

• 新規開発

インベントリ優先順位づけ

プラン/

実行

既存資産の情報収集

優先順位付け 計画と実施

業務担当者、利用者、開発者からの聞き取り

販売店、開発元に問い合わせ

• ビジネスインパクト

• 利用範囲

• 利用者数

1. 重要ではない

2. あると便利

3. 必要(クリティカルではない)

4. 重要

5. ミッションクリティカル

• 暫定的な対応• 後方互換機能

• 仮想化

• 中長期的な対応• 修正

• 新規開発

優先順位づけ

プラン/

実行

既存資産の情報収集

優先順位付け 計画と実施

業務担当者、利用者、開発者からの聞き取り

販売店、開発元に問い合わせ

• ビジネスインパクト

• 利用範囲

• 利用者数

1. 重要ではない

2. あると便利

3. 必要(クリティカルではない)

4. 重要

5. ミッションクリティカル

• 暫定的な対応• 後方互換機能

• 仮想化

• 中長期的な対応• 修正

• 新規開発

プラン/

実行

既存資産の情報収集

優先順位付け 計画と実施

業務担当者、利用者、開発者からの聞き取り

販売店、開発元に問い合わせ

• ビジネスインパクト

• 利用範囲

• 利用者数

1. 重要ではない

2. あると便利

3. 必要(クリティカルではない)

4. 重要

5. ミッションクリティカル

• 暫定的な対応• 後方互換機能

• 仮想化

• 中長期的な対応• 修正

• 新規開発

実施決定

トリアージ

影響調査

切り分け

判断

トリアージ

影響の度合い (レベル)分け例)a. 実運用に支障(データが入力/視認できない等)

b. 入力/視認は可能であるものの意図しない動作が発生

c. わずかなレイアウトの崩れなど

実施決定

トリアージ

影響調査

切り分け

判断

新しい IE に対応できるものできないものの切り分け

◆対応できない場合は理由を明らかに例)a. 予算/工数がかかりすぎる

b. 他社の作ったパッケージ

c. その他 (ActiveX、Java ランタイム、etc..)

実施決定

トリアージ

影響調査

切り分け

判断 対応させるサイト/させないサイトを決定

実施

決定

方法

優先順位

トリアージ

切り分け

判断

決定

マイグレーション方法の決定

◆ソースの編集が可能a. 新しい IE 向けに

Web サイトを修正b. IE の後方互換機能を使用

◆ソースの編集が不可a. 作り直しb. 仮想環境で旧い Windows

& 古い IEで運用c. 廃棄

影響調査

実施

決定トリアージ

切り分け

判断

方法

優先順位

どの順序で作業をすすめるか

例)a. 必要性の高い

b. 影響が少ない

c. 複数の方法の組み合わせ

影響調査

決定 実施トリアージ

切り分け

判断

方法

優先順位

アップデート

後方互換

仮想化

影響調査

実施

アップデート

後方互換

仮想化

Compat Inspector

F12

Fiddler

modern.IE

最新 IE に対応

そのまま使用

Hyper-V

(VDI)

WindowsXP Mode, MED-V(Windows 7 )

そのまま使用

The Microsoft Conference 2014

Internet Explorer

Web

Internet Explorer

(※) Internet Explorer 11

~以前のバージョンの描画ルールで表示~

設定値 IE8 IE9 IE10 IE11

EmulateIE10 〇

10 〇

EmulateIE9 〇 〇

9 〇 〇 〇

EmulateIE8 〇 〇 〇 〇

8 〇 〇 〇 〇

EmulateIE7 〇 〇 〇 〇

7 〇 〇 〇 〇

5 〇 〇 〇 〇

edge 〇 〇 〇 〇

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” "http://www.w3.org/TR/html4/loose.dtd">

~Internet Explorer 6 ~

(Standard) • HTML 4.01 DOCTYPE

• HTML 4.0 「Strict」

(Quirks) • DOCTYPE

• HTML

~ Internet Explorer 11 上で Internet Explorer 8 をエミュレート~

エンタープライズモード

HKLM¥SOFTWARE¥Policies¥Microsoft¥Internet Explorer¥Main

¥EnterpriseMode

[ツール] メニューを有効化: “Enable” = “” または“{URL}{:ポート}”

XML サイトリストを有効化: “SiteList” = “{ファイルパスまたはURL}”

~使いやすいグループポリシーとレジストリキー~

• メニュー[ツール] – [エンタープライズモード] を選択

• エンタープライズモードの IE Web サイトリストを使用

The Microsoft Conference 2014

DEMOInternet Explorer 11

2016 年1 月 12 日

2020 年1 月 14 日

2023 年1 月 10 日

Windows Vista

Windows 7

Windows 8

Windows 8.1

2017 年4 月 11 日

InternetExplorer 7

Enterprise mode (IE8)

Enterprise mode (IE8)

InternetExplorer 8

The Microsoft Conference 2014

Compat Inspector

<script src="http://ie.microsoft.com/TestDrive/HTML5/CompatInspector/inspector.js"></script>

• Proxy HTTP

Fiddler

•http://fiddler2.com/

The Microsoft Conference 2014

DEMOCompat Inspector

Fiddler

| modern.IE

http://modern.ie/

| modern.IE

The Microsoft Conference 2014

DEMO

2013

UI

詳しくは Visual Studio ブースで!

| modern.IE

• Compat Inspector

• Fiddler• F12

InternetExplorer

monoe‘s blog

de:code 2014 セッションDE-016 資料

http://bit.ly/de-016

© 2014 Microsoft Corporation. All rights reserved. Microsoft, Windows and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

top related