Hatena::Groupsubtech

ういはるかぜの化学

Thursday, December 12, 2013

Internet Explorer 9/10で__defineGetter__, __defineSetter__ が存在しない 01:01 Internet Explorer 9/10で__defineGetter__, __defineSetter__ が存在しない - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorer 9/10で__defineGetter__, __defineSetter__ が存在しない - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 201312日目です。

ECMAScript 5th Editionにはオブジェクトのプロパティのゲッターとセッターを定義するためのObject.definePropertyというメソッドがあり、Internet Explorerは9からこのメソッドに対応しています。

このObject.definePropertyというものが標準になる前にほかのブラウザで先行実装されていた Object.prototype.__defineGetter__と__defineSetter__ という同じくゲッターとセッターを定義するメソッドがあったのですが9と10には実装されていません。ところが11になってそれを期待する実装が世の中には一定数あるせいなのか実装されたようです。

というわけで__defineGetter__と__defineSetter__を必要とする何かをInternet Explorer 910で動かしたくなることありますよね?ってお話です。

動かすためのshim

以下のようなコードを突っ込んであげれば__defineGetter__と__defineSetter__を利用できるようになります。簡単ですね。

やってることは__defineGetter__,__defineSetter__でdefinePropertyを呼び出しているだけです。

if (!Object.prototype.__defineGetter__) {
    Object.defineProperty(Object.prototype, '__defineGetter__', {
        enumerable: false,
        value: function (sprop, func) {
            var propDesc = Object.getOwnPropertyDescriptor(this) || {};
            propDesc.configurable = true;
            propDesc.get = func;
            Object.defineProperty(this, sprop, propDesc);
        }
    });
}
if (!Object.prototype.__defineSetter__) {
    Object.defineProperty(Object.prototype, '__defineSetter__', {
        enumerable: false,
        value: function (sprop, func) {
            var propDesc = Object.getOwnPropertyDescriptor(this) || {};
            propDesc.configurable = true;
            propDesc.set = func;
            Object.defineProperty(this, sprop, propDesc);
        }
    });
}
トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131212

Wednesday, December 11, 2013

Internet Explorer for Windows PhoneのWebサイトの優先設定とF12開発者ツールのプロファイル 02:13 Internet Explorer for Windows PhoneのWebサイトの優先設定とF12開発者ツールのプロファイル - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorer for Windows PhoneのWebサイトの優先設定とF12開発者ツールのプロファイル - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 201311日目です。

Internet Explorer for Windows Phoneの設定「Webサイトの優先設定」とは

Windows Phone 8版のInternet Explorerの設定には「Webサイトの優先設定」という項目があります。これは一体何なのかちょっと気になったので調べてみました。

f:id:mayuki:20131212021133p:image

結論から言えばこれはUser-Agentが普通のデスクトップのようなものになるだけっぽい、でした。

モバイル用サイト
Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; ARM; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 620)
デスクトップ用サイト
Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0; ARM; Touch; WPDesktop)

User-Agentを一般的なInternet Explorer 10を装うことでアクセスできる範囲を広げるための設定というのだということのようです。

viewportの設定が変わるとかそういうのは見たところなさそうなので、リクエストに関連するものとみてよさそうですね。

Internet Explorer 11のF12開発者ツールにある「エミュレーション」の「プロファイル」

ところでInternet Explorer 11のF12開発者ツールにある「エミュレーション」に「プロファイル」という設定項目があり、そこにはWindows Phoneという項目が用意されています。

f:id:mayuki:20131212021132p:image

これもまた一体なにかしら?と思ったのでちょっと調べてみました。

調べてみた結果、おおざっぱにいえば以下のような部分が変わります。

  • User-Agentが自動でWindows Phoneになる
  • meta要素によるviewport指定がきくようになる
    • 例えば width=300px であるとか width=device-width という指定がきく(device-widthだと文字サイズもスケールする)
    • width=300pxと指定するとhtml要素が300px相当になる
    • 画面サイズ(高さも含めて)は別な解像度の設定が反映される
  • -ms-text-size-adjust プロパティがきくようになる
    • 文字サイズだけ拡大するプロパティ

つまりどういうことかといえばこれはWindows Phone側にある設定がユーザー向けなのとは違って、Windows Phone 8向けのコンテンツを作るときにレイアウトの参考にできるという開発者向けのエミュレーション設定なのです。

まとめ

というわけでユーザーがPC版を要求する必要もなくなるよう、F12のエミュレーション設定でWindows PhoneでもアクセスできるWebサイトを増やしていきましょう…。-webkit-だけしか書いてないとかやめましょう…。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131211

Tuesday, December 10, 2013

Flip ahead (ページフリップ)を使う、実装する Flip ahead (ページフリップ)を使う、実装する - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Flip ahead (ページフリップ)を使う、実装する - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 201310日目です。

Internet Explorer 10からFlip ahead(ページフリップ)という機能がつきましたのでその紹介を。

Flip ahead (ページフリップ)とは

Internet Explorerを起動して使ってると「ページフリップを有効にしますか?」みたいなメッセージが出てお前は何を言っているのかと思った人も多そうな気がします。

Flip aheadというのはどういう機能かというと新しいUIInternet Explorerで使える機能で、サイト側で「次のページのURL」をブラウザに教えることでフリップ(指ではじく操作)して次のページに遷移できる機能です。

新しいUIInternet Explorerではブラウザの戻る/進むがフリップ操作でできるようになっていますが、通常「進む」は一度見て戻った場合にしか使えません。そこでこのFlip aheadを使うとまだ見ていない次のページも進むと同じ操作で進めるというわけです(挙動的には「次へ」が使えるようになるだけなので一応マウスでも操作できます)。

これが何が嬉しいかというとどんどんめくっていくような感覚でブラウズできるようになるのがよいところです。Tumblrのテンプレートに組み込んでみたやつBingGoogleといったところで試せます。

うまく動かないときは設定を確認

もしかしたら設定が無効になっているかもしれません。その時はチャームからInternet Explorerの「設定」の「プライバシー」からページフリップを項目を有効にしてください。

Internet Explorer 11でのFlip ahead

さらにInternet Explorer 11ではFlip aheadで指定されている次のページはプリレンダリングの対象ともなるようになっているため、さらに体感的にめくる感触が良くなっています。

じつは昨日の先読みの話は今回の前振りとして用意したわけでした。

実装方法

さてそんな便利そうなFlip aheadですがいい感じで勝手にやってくれるわけはなく、ページコンテンツ側での対応が必要になります。必要にはなるのですがいたって簡単です。次のようなlink要素を追加するだけで独自拡張でもありません。

<link rel="next" href="http://www.example.com/" />

これを書くだけでプリレンダリングまでやってくれます。簡単ですね。

ちなみにrel="prev"で前のページのURLも指定することができます。

まとめ

Flip aheadはページ分割されているコンテンツなどでは有用ですし、組み込みも簡単かつ悪影響も考えにくいので是非組み込んでみてはいかがでしょうか。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131210

Monday, December 09, 2013

サイトを先読みに対応させる 01:29 サイトを先読みに対応させる - ういはるかぜの化学 を含むブックマーク はてなブックマーク - サイトを先読みに対応させる - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の9日目です。

今日は開発者向けのお話です。Internet Explorer 11から対応したGoogle Chromeなども以前から対応しているサイトの先読みの機能についての話です。

サイトの先読みって何?

そもそもサイトの先読みというのは現在表示しているページの先をあらかじめ読み込んでおくことでブラウジングの体感速度を上げる手法です。

例えば検索エンジンで検索結果の上位ページはクリックされる可能性が高いリンクです。つまり現在見ているページ(=検索結果)から遷移する先がある程度予想できます。ということは検索結果をユーザーが見ているうちにリンク先を裏側で読み込んでおけば検索結果からリンク先へ飛んだ際にすぐさま表示できるわけです。

例えばBing(英語版)だと検索結果の一番目のサイトを先読み/プリレンダリングするといったことが行われています。

f:id:mayuki:20131210012748p:image:w640

"Windows Azure"で検索した結果の一番目にポインターをホバーするとツールチップに「Preloading …」と出てきて先読みしていることがわかります。バックグラウンドでの先読みが完了していればクリックしての遷移がとても速くなります。

先読みの方法

リンク先をあらかじめ読み込んでおくと言ってもいくつか方法があります。Internet Explorer 11では以下の方法に対応しています。

DNS解決をあらかじめ行う(dns-prefetch)
DNSの名前解決をバックグラウンドで行うことで次に遷移するときにDNS解決の時間を短縮する
リソースを先読みする(prefetch)
リソースを先読みしてキャッシュに格納しておくことでリソースの読み込みを早くする
ページをプリレンダリングする(prerender)
ページ丸ごとバックグラウンドで読み込んでレンダリングしておくことで高速に遷移できるようにする(上のBingはこれです)

先読みの指示の仕方

先読みの方法が3つあることがわかったので実際にブラウザにどう指示すれば先読みしてくれるのか?というお話です。

DNS解決をあらかじめ行う(dns-prefetch)

DNS解決をあらかじめ行っておくこと(DNSプリフェッチ)で何が嬉しいかというと、リンク先に遷移しようとしたときやリソースを取得しようとしたときにはじめてDNS解決行われることによる無駄な時間を減らすことができます。

DNSプリフェッチをブラウザに指示するには以下のようなlink要素を記述します。

<link rel="dns-prefetch" href="http://www.example.com/" />

こうすることで www.example.comIPアドレスをあらかじめキャッシュするようになります。

リソースを先読みする(prefetch)

リソースの先読みは後から差し込まれる画像などを先読みしておくことでキャッシュしておくというものです。

リソースの先読みをブラウザに指示するには以下のようなlink要素を記述します。

<link rel="prefetch" href="http://www.example.com/" />
ページをプリレンダリングする(prerender)

ページのプリレンダリングはリソースのダウンロードに加えてレンダリングも完了させておくという先読みの中でも最強の先読みともいえます。

プリレンダリングしてほしい旨をブラウザに指示するには以下のようなlink要素を記述します。

<link rel="prerender" href="http://www.example.com/" />

実に簡単ですね。こうすると裏側で指定されたURLを取得してレンダリングします。

ちなみにInternet Explorer 11ではJavaScriptからlink要素を差し込んでも認識するようです(Bingはそうしてた)。

プリレンダリングの注意点と制限

プリレンダリングはバックグラウンドでレンダリングしておくという挙動のため単純な先読みよりもセンシティブな挙動となります。そのためいくつかの制限やページ制作の注意点があります。

なお前提としてプリレンダリングを指示する側のページでは一つのページしかプリレンダリングを指示できません。

実はno titleに書いてありますがざっと説明します。

プリレンダリングできる条件

指定されたURLのページがプリレンダリングできる条件として最低限以下のものを満たしている必要があります。

  • 従量制ネットワークの場合にはプランによって決まる(プランの詳細は謎。ConnectionCost.Conservativeだとダメとかかも)
  • 対象のURLがファイルのダウンロードとならないこと
  • 対象のURLhttp スキームまたは https スキームであること
  • 対象のURLはトップレベルのドキュメントであり、iframeではないこと
  • link要素を含むページが表示状態であり、フォアグラウンドなタブ(選択状態)であり最小化されていないこと
プリレンダリングが一時停止される場合

さらに以下の条件を満たさない場合にはレンダリングは途中で停止されます。つまり以下の条件に当たった瞬間にそこでプリレンダリングは一時停止するということのようです。

  • プリレンダリング対象のページ中で何らかのUI通知が発生した場合
    • alertやウィンドウを開いたり、何らかの通知が発生したり
  • プリレンダリング対象のページ中のvideo要素またはaudio要素でメディアが自動的に再生された場合
    • autoplay属性とか
  • プリレンダリング対象の履歴が変更される場合
    • window.historyが更新されるようなナビゲーションが発生したり
プリレンダリングされたページが破棄される場合

プリレンダリングされたページも以下のような特定の条件を満たすとその状態が破棄されます。

  • プリレンダリングしたページを5分以内に表示しなかった場合
  • ユーザーが別なページを開いた場合
  • ユーザーが別なタブに切り替えた場合
  • JavaScriptによって別なプリレンダリング対象を指定したlink要素が差し込まれた場合
  • プリレンダリング対象ページを読み込み中にエラー(404とか)が発生した場合
プリレンダリングによる副作用

プリレンダリングは裏側でページの実行が行われるのでいくつか副作用が発生します。特にJavaScriptによる処理が動いてしまうので注意が必要です。

  • ActiveX コントロールはユーザーがページを表示した瞬間に使えるようになる
    • そのためreadyStateで利用できるかどうか確認する
  • ページが表示されたときにアニメーションが動作しないことがある
    • プリレンダリング中にアニメーションが発動して完了してしまうと何も起きなくなる
  • タイマーが予期しない結果となることがある
    • 多分Interval通りにこないとかそういうこと
  • CookieやIndexedDB, Web Storageによるデータの保持はそのまま維持されます

ドキュメントにはloadまでに起こる問題といった書かれ方をしているので、ページのloadイベントまでは普通に実行されそこで一時停止するものと考えられます。

なのでDOMContentLoadedで行った処理はそのまま反映されてしまう可能性がありますので注意が必要です。

まとめ

ページの先読みはユーザーの行動を概ね予測できる場合にはとても強力に動作します。

ページのロードにかかる時間は当然同じわけですが、ユーザーのインタラクションを待ってから遷移するのと非同期でバックグラウンドで取りに行って用意しておくのでは体感には大きな差が出ますのでうまく使えば大変効果的ではないでしょうか。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131209

Sunday, December 08, 2013

Internet Explorerでタブの同期ができるのは最大何台? 01:16 Internet Explorerでタブの同期ができるのは最大何台? - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorerでタブの同期ができるのは最大何台? - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の8日目です。

Windows 8.1Internet Explorer 11MicrosoftアカウントでWindowsにサインインしているときに別なコンピューターで開いているタブを同期するという機能があります。

ちょっと話は変わってWindows 8.1ではWindowsストアに紐づけられるコンピューターは81台ということになっています。とするとInternet Explorerで同期できるのも81台ぐらいなのかしら?と思ったりするわけです。

何台同期できるの?

というわけでひたすらWindowsをセットアップしまくって同期しまくってみました。が、結論から言うと、あまりにも手間がかかる(初回セットアップ+同期待ちの時間がかかる)ので限界に到達できていないのでわかりません…。

f:id:mayuki:20131209010630p:image:w640

とはいえとりあえず40台ほど同期できるのは確認できました。普通なら困らないですね。引き続き調べていきたいところですね…。

同期しまくってわかったこと

同期しまくっていていくつか気付いたことがありました。

Windows ServerにはMicrosoftアカウントでのサインインはできない

最初はWindows AzureWindows Server 2012 R2を100台ぐらい展開してひたすらサインインしていけばいけると思っていたのですがまさかのMicrosoftアカウント紐づけ機能がないという罠でした。

そのため一つ一つセットアップしていくという予想以上に時間のかかる展開に…。

同期のユーザー識別はSIDかなにかっぽい

同期のユーザー識別にはSIDを使っているような雰囲気があります。というのはどういうことかというと、今回最初にある程度Windows 8.1をセットアップした状態でSysprepで一般化という複数コンピュータへの展開のための初期化をするということをしました。

で、最初Sysprepする前にMicrosoftアカウントでユーザーを作っておいて、セットアップしたのちサインインすればと思ってやってみたのですがどうにもおかしな状態になりました。

タブが同期されないのもそうなのですが、スタートも吹き飛んでしまったので完全に同じユーザーで不整合が起きて残念なことが起きるようです。たぶんこれはHyper-VVMwareParallelsとか仮想マシンとして複数差分イメージを作っていて使っている場合とかにも起きると思うので注意が必要です。

無人インストールにMicrosoftアカウントでの紐づけはない

無人インストール時にユーザーを作れますが、ドメインアカウントやローカルアカウントは作れてもMicrosoftアカウントでの紐づけまでやる方法は用意されていません。まあ当たり前ですね。

たまに同期したものが消える

同期していたコンピューターの項目がたまに消えます。何か理由があるのかなと思いつつ謎です。スクリーンショットを見ていただければわかりますが50台ぐらいまで起動していますが40個しか同期した項目がありません。

おまけ: どうやったのか

ちなみにどうやったのかというと以下のような手順です。

  • Hyper-VWindowsのOOBE直前の仮想マシンを作る(WindowsセットアップしてSysprep)
  • 新しい仮想マシンを作って差分ディスクにする
  • その時点で一度スナップショットをとる
  • 起動してセットアップ&Microsoftアカウントでサインイン
  • タブを開いて同期されるまで待つ(ほかの仮想マシンで確認する)
  • 同期されたらスナップショットを適用してセットアップに戻って以下略

というわけで同期は数分間隔なので時間が超かかるのでした…。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131208

Saturday, December 07, 2013

Internet Explorerの互換表示リスト 2013 23:58 Internet Explorerの互換表示リスト 2013 - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorerの互換表示リスト 2013 - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の7日目です。7日目です。

IEには8以降で互換表示(IE7モードやIE8モード、IE9モードなど)があり、アクセスしたサイトで自動的に発動できるよう対象ドメインをリスト化したXMLがあります(コピペ。

2年ちょっと前にInternet Explorerの互換表示リスト - ういはるかぜの化学 - subtechというエントリを書いてて、そのころはWindows 8がDeveloper PreviewだったのでInternet Explorer 10もまだPreviewでした。ということで2013年12月というかInternet Explorer 11での互換表示リストを見て、何となく内容を想像してみることにします。

Internet Explorer 11の互換表示リストの固定のURLは見当たらなかったのでレジストリのHKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\BrowserEmulationからURLを拾ってきました。

https://iecvlist.microsoft.com/IE11/1375395130872/iecompatviewlist.xml

<?xml version="1.0" encoding="utf-8" ?>
<iecompatlistdescription>
    <version>1152921505002015225</version>
    <ttl>1</ttl>
    <ua id="Chrome 19">Mozilla/5.0 (Windows NT 6.2) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.52 Safari/536.5</ua>
    <ua id="Chrome 28">Mozilla/5.0 (Windows NT 6.2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36</ua>
    <ua id="FireFox 12">Mozilla/5.0 (Windows NT 6.2; rv:12.0) Gecko/20100101 Firefox/12.0</ua>
    <ua id="FireFox Token">Mozilla/5.0 ($PLATFORM; Trident/7.0; rv:11.0) like Gecko/20100101 Firefox/12.0</ua>
    <ua id="FireFox 22 Token">Mozilla/5.0 ($PLATFORM; Trident/7.0; rv:11.0) like Gecko/20100101 Firefox/22.0</ua>
    <ua id="IE 10">Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)</ua>
    <ua id="IE9Win7">Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0)</ua>
    <ua id="IE10 Trident 7.0 Token">Mozilla/5.0 (compatible; MSIE 10.0; $PLATFORM; Trident/7.0)</ua>
    <ua id="IE10 Trident 6.0 Token">Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)</ua>
    <ua id="IE11">Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko</ua>
    <f12ua category="desktop" name="Internet Explorer 10">Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)</f12ua>
    <f12ua category="desktop" name="Internet Explorer 9">Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0)</f12ua>
    <f12ua category="desktop" name="Internet Explorer 8">Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0)</f12ua>
    <f12ua category="desktop" name="Internet Explorer 7">Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0)</f12ua>
    <f12ua category="desktop" name="Internet Explorer 6">Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)</f12ua>
    <f12ua category="non-desktop" name="IE10 - Windows Phone 8">Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch)</f12ua>
    <f12ua category="non-desktop" name="IE9 - Windows Phone 7">Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0)</f12ua>
    <f12ua category="non-desktop" name="IE - Xbox One">Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0; Xbox; Xbox One)</f12ua>
    <f12ua category="non-desktop" name="IE - Xbox 360">Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0; Xbox)</f12ua>
    <f12ua category="other" name="Google Chrome">Mozilla/5.0 (Windows NT 6.2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36</f12ua>
    <f12ua category="other" name="Mozilla Firefox">Mozilla/5.0 (Windows NT 6.2; rv:12.0) Gecko/20100101 Firefox/23.0</f12ua>
    <f12ua category="other" name="Opera">Mozilla/5.0 (Windows NT 6.2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36 OPR/15.0.1147.153</f12ua>
    <f12ua category="other" name="Apple Safari (iPad)">Mozilla/5.0 (iPad; CPU OS 6_0 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10A5355d Safari/8536.25</f12ua>
    <f12ua category="other" name="Bing Bot">Mozilla/5.0 (compatible; bingbot/2.0; +http://www.bing.com/bingbot.htm)</f12ua>
    <domain docMode="EmulateIE7" versionVector="7" uaString="7" featureSwitch="overrideXUACompatible:false">example.com</domain>
    <domain docMode="EmulateIE7" versionVector="7" uaString="7" featureSwitch="requiresActiveX:true">example.com</domain>
    <domain docMode="IE9">example.com</domain>
    <domain featureSwitch="createElementWithMarkup:false">example.com</domain>
    <domain uaString="Firefox Token">example.com</domain>
    <domain>example.com
        <path docMode="EmulateIE10" versionVector="10" uaString="IE 10">/p</path>
    </domain>
    <domain>example.com
        <path uaString="IE 10">/Bugs</path>
    </domain>
    <domain>example.com</domain>
    <gpu vendorId="0x8086" deviceId="0x0046" startMatchInclusive="8.15.0010.2104" endMatchExclusive="8.15.0010.2142" umdFilename="igd10umd64.dll" />
    <gpu vendorId="0x8086" deviceId="0x2E93" startMatchInclusive="8.15.10.2202" endMatchExclusive="8.15.10.2203" Os="OS_Vista" />
    <gpu vendorId="0x8086" deviceId="0xA011" startMatchInclusive="8.14.10.1929" endMatchExclusive="8.14.10.2230" />
    <gpu vendorId="0x8086" deviceId="0xA011" subSysId="0x83ac1043" startMatchInclusive="8.14.10.2230" endMatchExclusive="8.14.10.2231" />
    <RequiresActiveX>
        <domain>example.com</domain>
    </RequiresActiveX>
    <GDITextMetrics>
        <domain exclude="true">example.com
            <path>/path/to/page</path>
        </domain>
    </GDITextMetrics>
    <NoFlash>
        <domain>example.com
            <platform>arm</platform>
        </domain>
        <domain>example.com</domain>
    </NoFlash>
    <BFCache>
        <domain>example.com</domain>
    </BFCache>
    <EnableUTF8QS>
        <domain>example.com</domain>
    </EnableUTF8QS>
    <NoPrerender>
    </NoPrerender>
    <EPMCompatMode>
        <domain>example.com</domain>
    </EPMCompatMode>
    <DisableEPMNotification>
        <domain>www.example.com</domain>
    </DisableEPMNotification>
</iecompatlistdescription>

おお…Internet Explorer 9のころからすごい変わってますね。基本的にはiecompatlistdescription要素の下にいろいろ並んでいる形になっています。

<ua id="IE 10">Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)</ua>

ua要素は下のほうで定義されている、このドメインではどのUser-Agentを装ってアクセスするかというもので使われるUser-Agentの定義です。Chrome 19とかFirefox 22とかありますね。

と思ったのですけど実際アクセスするとUser-Agentも変わっておらず使われている雰囲気がないので謎です。

<f12ua category="desktop" name="Internet Explorer 10">Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)</f12ua>

f12ua要素はF12開発者ツールでテスト用に偽装するためのUser-Agentのリストです。

category属性は desktop, non-desktop, other という値をとるようですがなんに使われているのか謎です(プロファイルが変わるわけではないみたい)。

ちなみにIE - Xbox Oneというのがありますね。Internet Explorer 10相当だということが見て取れます。

<domain docMode="EmulateIE7" versionVector="7" uaString="7" featureSwitch="overrideXUACompatible:false">example.com</domain>

domain要素でfeatureSwitch="overrideXUACompatible:false"というのがあるパターン。

overrideXUACompatible:falseというのが新しいです。みる感じこれはX-UA-Compatibleを無視するための指定のような気がします(あるいは逆かもしれない…)。

gpu要素

gpu要素はどうも互換性のないディスプレイドライバの列挙のような感じです。

その中にはベンダーID、バージョン(範囲)からファイル名といったものが指定されています。

<gpu vendorId="0x8086" deviceId="0x0046" startMatchInclusive="8.15.0010.2104" endMatchExclusive="8.15.0010.2142" umdFilename="igd10umd64.dll" />
    <gpu vendorId="0x8086" deviceId="0x2E93" startMatchInclusive="8.15.10.2202" endMatchExclusive="8.15.10.2203" Os="OS_Vista" />

GDITextMetrics要素

GDITextMetrics要素はたぶんInternet Explorer 9からのDirectWriteのテキストメトリクスGDI互換に戻す指定だと思われます。

NoFlash要素

NoFlash要素はFlashを動作させないようにする指定のようです。特にdomain要素にplatform要素があり、armと指定されていることからARMデバイスでFlashを動かしたくないというようなものがあるようです。

BFCache要素

BFCache要素は多分ですがBack Forward Cache、つまり戻るキャッシュの制御だと思われます。

戻るキャッシュというのはページで戻るボタンを押してもJavaScriptの状態が保持されていたりするアレです。それを無効にする(のか有効にするのか…)ための要素だと思われます。

EnableUTF8QS要素

EnableUTF8QS要素はEnable UTF-8 Query Stringの略で、多分クエリストリングをUTF-8にするかどうかの指定だと思います。が、これもまたここに指定があると有効なのか無効なのかは謎です。

NoPrerender要素

NoPrerender要素はプリレンダリングを無効にする指定のようです。つまりprerenderの対象として指定されているドメインのURLがあってもプリレンダリングしない、ということのような気がします。

EPMCompatMode要素

EPMCompatMode要素はEnhanced Protected Modeの互換モードってことのようですがよくわかりません。が、まあきっとEPM有効だと何か動かないサイトに対する指定だということは予想がつきます。

DisableEPMNotification要素

DisableEPMNotification要素はEPMの通知を無効にするってことでしょうか…割と謎です。しかもこれ、www.windowsphone.comしか指定がないという。

まとめ

互換表示リストもバージョンを負うことにだんだん複雑というか項目が増えてきてなかなか味わい深いですね。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131207

Friday, December 06, 2013

Internet Explorerの環境依存トラブルの原因を探る 14:01 Internet Explorerの環境依存トラブルの原因を探る - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorerの環境依存トラブルの原因を探る - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の6日目です。

ちょうど電話番号が載っているサイトをIE10で見ると真っ暗になったりフリーズする!? | 東京上野のWeb制作会社LIGというエントリがちょっと話題になっていました。どうも電話番号的な文字列が含まれているとハングアップするバグがある!!という話ですが、以下の理由からInternet Explorerのバグというより何らかの外的要因(環境依存)の予感がしています。

  • Internet Explorer 10には電話番号を認識する機能はない(Windows 8.111にはあります)
  • ごく単純なHTMLで止まってしまう(らしい)
  • ごく一部のコンピューターでのみで再現する(大多数は再現しない)
  • 「ドキュメントモードをIE7標準にすると電話番号が消える」

特に最後のは何かしらが電話番号的な文字列を探して加工しているような感じの挙動に見えます。

問題の出どころと試してみること

実際にブラウザに影響を与える外的要因となるのは以下のようなものがあるのでこのあたりを疑っていきます。

  • アドオン
    • ツールバー
    • Browser Helper Object(目に見えないブラウザ拡張)
  • 外部プロセスからの干渉
  • ディスプレイドライバ周り

問題は外的な要因によるものと仮定して原因を探るには以下のような方法があります。

  • アドオンをすべて無効にして起動する
  • Internet Explorerの設定をリセットする
  • GPUアクセラレーションをオフにしてみる
  • 別なユーザーなどで起動してみる等

例の問題はコンテンツのレンダリングによるものというよりはコンテンツそのものに干渉しようとした何かが問題となっている雰囲気があるのでGPUアクセラレーションをオフにするとかでは解決しない気がしますね。

アドオンをすべて無効にして起動する

まず最初に試してみるべきはアドオンを完全無効化した状態で起動してみることです。アドオンを無効にするにはアドオンの管理画面からぽちぽちやるのではなくInternet Explorerをアドオンなしモードで起動するのが漏れもなく簡単です。

Windows 7/Vista

スタートメニューでInternet Explorerを検索すると「Internet Explorer (アドオンなし)」という項目が見つかるのでそれで起動します。

Windows 8

ファイル名を指定して実行やコマンドプロンプトから iexplore.exe -extoff とオプションを指定して起動します。

f:id:mayuki:20131207135333p:image

※スクリーンショットはInternet Explorer 11

この状態ではInternet Explorerはアドオンが無効となっています。これで問題が発生するかどうかを確認します。

もし問題が発生しないのであれば問題の原因はアドオンにあることになるのでアドオンの管理から一つ一つしらみつぶししていくことになります。

Internet Explorerの設定をリセットする

アドオンを無効にしてもやはり問題が発生する、そんなときはInternet Explorerの設定をリセットします。リセットするとすべての設定はデフォルトに戻り、アドオンはすべて無効化されます。なおユーザーのデーター(お気に入りとかパスワードとか履歴とか)は残ります。

リセットはインターネットオプションの「詳細設定」から「リセット」をクリックすることで実行できます。

f:id:mayuki:20131207135500p:image

それでも問題が起こる…

ここまで来ると問題を見つけるのはかなり難しくなります。アドオン以外で怪しいものとすると、GPUや外部プロセスといったあたりになります。

GPUアクセラレーションをオフにする

色々なサイトでちょこちょこ固まったりクラッシュするという場合にはGPUアクセラレーションを疑ってみるのも解決になるかもしれません。

まずはドライバの更新がないか確認してみます。特にない場合にはGPUアクセラレーションをオフにするのを試してみます。

GPUアクセラレーションをオフにするにはインターネットオプションの詳細設定から「GPU レンダリングでなく、ソフトウェア レンダリングを使用する」のチェックを入れることでGPUを使わなくなります(当然パフォーマンスが落ちます)。なおチェックを付けられないときはそもそもGPUを利用していません。

f:id:mayuki:20131207135335p:image

それ以外で問題を引き起こすもの

外部のアプリケーションから干渉を受けている場合、なかなか問題の原因を見つけようにも見つけにくいので結構お手上げ状態になります。あのアプリが実はページの内容を見張っていた!とか探すのが難しいです。

それでもできるいくつかの試せることとして以下のようなものがあります。

  • 管理者として実行してみる
    • 管理者として実行することでInternet Explorerが昇格した状態になり、一般プロセスからの干渉を受けなくなります。ただし問題を引き起こしているプロセスが昇格していたりシステム権限だったりすると効果はありません。
  • 別なユーザーで起動してみる
    • 何らかのソフトウェアが影響を与えている場合には別なユーザーとして実行してみるのも手ではありますが、結局のところコンピュータに入っているものは同じなので全ユーザーで実行されていたらお手上げです。

この辺を試してちゃんと動くとすればそれはやはり外部から影響を受けているとみてよいでしょう。

まとめ

あの環境では起こるのに他のほとんどの環境では起こらないというときはまずInternet Explorerそのもののバグというよりは環境依存の問題のほうが高くなります。逆に大多数の環境で再現するのであればInternet Explorerのバグ、と考えても大丈夫だと思います。

またアドオンは知らないうちに仕込まれていたりするので一度無効にして起動してみるというのは覚えておいて損はないと思います。

おまけ: (超上級者向け)IEDiagCmd.exeでレポートを出して眺める

Program Files\Internet Explorerにiediagcmd.exeという実行ファイルがありまして、これを実行すると診断情報を詰め込んだIEDiag.cabというものを吐きだしてくれます。

この中にはアドオン情報などが入ったXMLやログファイルが詰め込まれているのですが、残念なことにビューアーがない(Platform Preview時代とかはあった)のでエクストリーム生XML閲覧となります。

誰かこれのビューアーを作ってくれないですかねー。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131206

Thursday, December 05, 2013

Internet Explorerのちょっと便利な機能 03:45 Internet Explorerのちょっと便利な機能 - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorerのちょっと便利な機能 - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の5日目です。

今日はInternet Explorerであまり知られてそうで知られていないちょっと便利に使える機能を紹介します。

クリップボードの文字列で検索する、URLを開く

Google ChromeなどではクリップボードにあるURLをアドレスバーに貼り付けるとともに移動ということができるのですが、デスクトップ用のInternet Explorerではアドレスバーに貼り付けて移動というのはなかったりします。

そのかわりクリップボードの内容で開くというメニューがコンテキストメニューとショートカットキーで用意されています。

f:id:mayuki:20131206033920p:image

URLまたは検索したい文字列をクリップボードにコピーした状態でコンテキストメニューを表示するとコピーしたアドレスに移動(コピーした文字列で検索)という項目が選べ、移動できます。また、Ctrl+Shift+Lを押すことでもその機能を発動できます。

ちなみにあえて「デスクトップ用の」と書いたのはいわゆる新しいUIInternet Explorerにはちゃんと貼り付けて移動が用意されているためです。

f:id:mayuki:20131206033921p:image

右クリックまたはタップアンドホールドするとコンテキストメニューが表示されて選択できます。

アクセラレーターを使う

デスクトップ版のInternet Explorerにはアクセラレーターと呼ばれる簡易的な拡張が用意されています。

例えば…

  • 選択した文字列を検索する
  • 選択した文字列を翻訳する
  • ページを送る

などなどがコンテキストメニューから実行できる便利ツールです。

f:id:mayuki:20131206033922p:image

これらを利用するには…

といった方法で追加することができます。他にもはてなブックマークのアクセラレーターもあったりするのでどうぞご利用ください。

実体は単なるHTMLが呼び出されるだけなので作ることができますので我こそはという方は作ってみるとよいのではないでしょうか。まあ新しいUIのほうでは動かないですけど…。

no title

ActiveX フィルター

ActiveX フィルターという機能がInternet Explorer 9から追加されました。

これは何かというとActiveXを利用を許可しないようにする機能です。ActiveXつまりページ内プラグイン的なものを動作させたくないと思っている場合には役に立ちます。

例えば、Flashを見たくない(意図的に)、プラグインによる脆弱性が不安、何か変なプラグインがアクティブ化されてパフォーマンスが落ちるのが嫌などなどそういう時に使えます。

ActiveXフィルターはメニューのセーフティーの中にActiveX フィルターという項目があるのでそれを選択するだけとオン/オフは実に簡単です。

最近はFlashコンテンツも減ってきたのでActiveXフィルターオンで使っていて、どうしても必要な時だけ解除するという使い方でも結構いけるのでオススメです。

新しいセッション

「新しいセッション」は割と知られていない機能ですが、セッションCookieを引き継がず新しいウィンドウを開く機能です。

セッションCookieはブラウザが起動している間のみ有効なCookieで、例えばはてなにログインするときに「次回から入力を省略する」というチェックを外すとログイン状態はセッションCookieで保持され、ブラウザを閉じるとログアウトされた状態になります。

「新しいセッション」を実行するとセッションCookieを引き継がずに新しく開くことができるため、複数ログインに利用できたりといった使い方ができます。ただし永続的なCookieは引き継がれてしまうので使えないこともあります。

この機能はAltキーを押すことで表示されるファイルメニューから発動できます。

f:id:mayuki:20131206033923p:image

まとめ

というわけでメジャーなようなマイナーな機能を紹介してみました。ActiveXフィルターとかアクセラレーターはそれなりにオススメですし、コピーしたURLを開くのもわかりにくいですけど便利です。

時間がないので内容がだいぶ雑くなってるのではないかとかなんとか…。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131205

Wednesday, December 04, 2013

modern.ieをつかう 01:50 modern.ieをつかう - ういはるかぜの化学 を含むブックマーク はてなブックマーク - modern.ieをつかう - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の4日目です。

modern.ieというのはMicrosoftが運営しているモダンなInternet Explorerやほかのブラウザとの相互運用性を担保したモダンなWeb開発するための手助けをしてくれるサイトです。

このサイトでは技術文章的なコンテンツやリンク誘導以外に以下のようなコンテンツを提供しています。

  • Webページの互換性問題を診断するスキャナー
  • Internet Explorerの入った仮想マシンのイメージのダウンロード

Webページの互換性問題を診断するスキャナー

WebページのURLを入力するとWebページをスキャンしてブラウザ間での互換性問題やInternet Explorerの互換性の問題などをチェックして報告してくれるツールです。

コードスキャンのページから利用できます。

f:id:mayuki:20131205014602p:image:w640

URLを入力して実行すると問題となりそうなポイントを探り出して報告してくれます。また報告の中では理由と対処方法がかかれています。

f:id:mayuki:20131205014600p:image:w320 f:id:mayuki:20131205014601p:image:w320

ちなみにこのスキャナーはnode.jsで動くソースコードとして公開されているのでローカル環境でも利用できます(Apache Licenseです)。

https://github.com/InternetExplorer/modern.IE-static-code-scan

Internet Explorerの入った仮想マシンのイメージのダウンロード

Internet Explorerの入ったWindows仮想マシンのイメージをダウンロードして開発・テスト目的に利用することができます。なんと無料です。

http://www.modern.ie/ja/virtualization-tools#downloads

とくにすごいのがそのイメージの対応プラットフォームの数です。以下のバリエーションの通りWindowsのみならずMacLinuxでも使えるように各種イメージが用意されています。

さらにそれぞれイメージはOSInternet Explorerの組み合わせで用意されています(ものによってはなかったりしますが)。

開発時におおよそ必要そうなバリエーションがありますね。

この用意されたバージョンの中から必要なバージョンのイメージをダウンロードして普段使っている仮想化ソフトウェアで利用することで開発・テストすることができます。

まとめ

というわけでmodern.ieをちょっと紹介してみました。特にVMイメージのダウンロードはだいぶ捗るのでご存じない方は是非利用するとよいのではないかと思います。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131204

Tuesday, December 03, 2013

Internet Explorer 6への開発対応で便利なツール 04:57 Internet Explorer 6への開発対応で便利なツール - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorer 6への開発対応で便利なツール - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の3日目です。

最近は随分と減ってきてはいますがいわゆるIE6対応という10年前のInternet Explorerに対応する羽目になることがWeb開発者の方であればあったりします。今のバージョンが11なので5世代も前のバージョンです。利用できる技術の差やバグなど色々と大変です。

そんなIE6対応がなかなか厳しい理由として、今ではなくてはならないF12開発者ツールのようなものがついていないためデバッグに手間取るというところがあります。そこでIE6で利用できる便利なツールを紹介します。

Firebug Lite

Firebug Liteはあの一世を風靡したFirebugの簡易バージョンです。

no title

もしかしたら今ではFirebugの存在を知らない人もいるかも…。Firebugについて簡単に説明するとFirefoxWeb開発用のアドインで、Google ChromeのデベロッパーツールやInternet ExplorerのF12開発者ツールのご先祖様というかそれらはFirebugがあるから生まれたといっても過言ではないといった存在です。

昔はページをマークアップする際にFirebugを使うと捗るのでFirefoxを立ち上げるとかよく聞いたものです。

f:id:mayuki:20131204044947p:image:w640

※スクリーンショットはInternet Explorer 7です

それはそれとしてFirebug LiteはおおざっぱにいえばFirebugのインスペクタ部分だけ切り出してブックマークレットで起動できるようにしたものという感じのツールです。そして何よりFirefox以外で動きます。具体的にはIE6+, Firefox, Opera, Safari and ChromeということでなんとIE6で動きます。便利!

レイアウト上の問題解決の手助けになることがまれにありますので覚えておいて損はないかと思います。

使い方はStable channelbookmarkletがブックマークレットになっているのでお気に入りに入れておき、対象のページで発動すればおっけーです。

Microsoft Script Debugger

HTMLというかスタイルの問題解決にはFirebug Liteが使えるのでよかったよかったという話ですがFirebug LiteにはスクリプトデバッガはついていませんのでJavaScriptのデバッグはまるで捗りません。そこでMicrosoft Script Debuggerです。

Error 404 - Not Found

Script DebuggerはActive Scriptをホストしているアプリのスクリプトをデバッグするツールです。要するにJScriptとかVBScriptをデバッグするためのツールです。これを使ってIEにアタッチできます。

正直使い勝手は最悪ですがとりあえずステップ実行できるのでまあないよりはマシではないでしょうか。可能であればScript EditorとかVisual Studioを使ったほうがよいと思います。

使い方

まずダウンロードセンターからscd10jp.exeというセットアップファイルをダウンロードします。そしてダウンロードしたら実行してインストールします。

インストール後、Script Debuggerを起動する前にInternet Explorerのオプションから「詳細設定」タブの「スクリプトのデバッグを使用しない (Internet Explorer)」のチェックを外しておきます。

チェックが外れた状態になったら一度Internet Explorerを開きなおしてScript Debuggerを起動します。起動する方法ですがショートカットなどは作られないのでインストールされたフォルダ(インストール時に聞かれますが既定ではProgram FilesのMicrosoft Script Debugger)にあるmsscrdbg.exeを直接実行します。

f:id:mayuki:20131204044948p:image

するとどうすればいいのかわからないMicrosoft Script Debuggerというウィンドウが開きます。と、ここで一度Internet Explorerに戻ってデバッグしたいページを開いておきます。

ページを開いたらMicrosoft Script Debuggerというウィンドウの「表示」から「実行中のドキュメント」という項目を選択します。そうすると「実行中のドキュメント」というウィンドウが開きます。

f:id:mayuki:20131204044949p:image

で、デバッグしたいスクリプトに以下のようなdebuggerステートメントを埋め込みます。

debugger;

あるいは次のステートメントで中断というボタンをクリックします。

その状態でリロードするとドキュメントが開かれて停止しますので後は「実行中のドキュメント」からファイルを開いてブレークポイントを設置したりステップ実行したりすればよいでしょう。ちなみにリロードするとブレークポイントは吹き飛びますので最悪です。

f:id:mayuki:20131204044950p:image

これでデバッグがはかどる…かもしれません。

しかしウォッチウィンドウとかもないのでやっぱりできればScript EditorとかVisual Studioを使ったほうがよいと思いますね…あれ…もしかしてこれ別に便利じゃない…?

まとめ

このように開発ツールも全然ないのでInternet Explorer 9以下ははやく捨てましょう。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131203

Monday, December 02, 2013

デスクトップと新しいUIInternet Explorerで行き来する 01:42 デスクトップと新しいUIのInternet Explorerで行き来する - ういはるかぜの化学 を含むブックマーク はてなブックマーク - デスクトップと新しいUIのInternet Explorerで行き来する - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の2日目です。

今日もちょっとしたTipsです。Windows 8/8.1のInternet Explorerにはご存じの通り2つのモードが存在しています。一つは従来のデスクトップで開かれるもの、もう一つは新しいUIで開かれるものです。

普段使っているとそんなに必要はないのですが「新しいUIのブラウザで見ていたけどこれからデスクトップを使う作業するのでデスクトップで見たい」「デスクトップで見ていたけどタブレットとして持ち運ぶので新しいUIで見たい」といった感じで切り替えたくなることがありますよね。ということで切り替え方をご紹介します。

新しいUIとデスクトップのブラウザの呼び方

と、その前。2つのモードがあるわけですがそれぞれの呼び方は以下のように呼ばれていたりします。

基本的にデスクトップのInternet Explorerは「デスクトップの」とつけて呼んで、何もつけない場合には自動的に新しいUIのほうを指す、ということにしたいようです。

ついでに新しいUIのほうにImmersive Browserという呼び方があります。Immersiveというのは没入型のことでいわゆるMetro styleや新しいUI(Windows Store apps)は内部的にずっと以前からImmersive なんとかと呼ばれていてちらほら残っていたりします。たとえばno titleとか。

まあImmersiveなんとかは基本的に出てこない言葉なのですがあとで突然出てきます。要するにImmersive なんとかは新しいUI(Windows Store apps)のことだと覚えておけばよいです。

新しいUIで見ているページをデスクトップで開く

新しいUIで見ているページをデスクトップで開くにはアプリバーのページツール(スパナアイコン)から「デスクトップで表示」を選択するだけです。これでデスクトップ側で開かれます。

f:id:mayuki:20131203013609p:image

デスクトップで見ているページを新しいUIで開く

反対にデスクトップで見ているページを新しいUI側で開くということもWindows 8.1というかInternet Explorer 11からできるようになりました。逆を言えば10の頃はできませんでした。具体的に開くにはどうすればいいのかというと2つの方法があります。

一つ目はタブのコンテキストメニューから「Immersive ブラウザーで開く」を選択することです。これを選択するとそのタブで表示しているページをImmersiveブラウザー、つまり新しいUIInternet Explorerで開くことができます。ちなみに日本語版でも本当に「Immersive ブラウザーで開く」と書いてあります。

f:id:mayuki:20131203013610p:image

もう一つはファイルメニューに「Immersive ブラウザーで開く」があるのでそちらを選択する方法もあります。機能はタブのコンテキストメニューのものと同じです。

f:id:mayuki:20131203013611p:image

新しいUIとデスクトップでのCookieの共有

新しいUIとデスクトップでのCookieの共有に関しては若干の条件があります。

まずセッションCookieに関しては特に問題なく共有されます。

もう一つ永続的なCookieに関しては「新しいUIとデスクトップでセキュリティコンテキストまたはEPM(拡張保護モード)の有効状態が同じであれば共有」されるという微妙な制限があります。

Windows 8(!=8.1)、つまりInternet Explorer 10のころですと「新しいUIはEPM(拡張保護モード)が有効で、デスクトップは既定でEPM無効」がデフォルトのため共有状態がいまいちでしたが、8.1のInternet Explorer 11から「デスクトップもEPMが既定で有効」となり、8(IE10)よりシームレスに共有されるようになりました。

まとめ

タブレットと卓上でちょこちょこ行ったり来たりに便利なのでぜひ覚えておくといざというときに役立つと思います。

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131202

Sunday, December 01, 2013

Internet Explorer 11のタブとウィンドウをつかう 11:25 Internet Explorer 11のタブとウィンドウをつかう - ういはるかぜの化学 を含むブックマーク はてなブックマーク - Internet Explorer 11のタブとウィンドウをつかう - ういはるかぜの化学

このエントリーはInternet Explorer Advent Calendar 2013の1日目です。

最初のあたりは簡単なTipsがいいかなということでInternet Explorer 11の新しいUIのほうでタブとウィンドウの使いこなしをちょっとご紹介します。

タブ(とアドレスバー)を常に表示する

特に何も設定していない新しいUIInternet Explorerではページの読み込みが終わるとタブとアドレスバーが隠れるようになっています。そのためタブを操作するにはアプリバーの呼び出しジェスチャーや右クリックをして再表示してあげる必要があります。

そのような操作がわずらわしく感じるであるとか常にタブの一覧やアドレスバーを表示しておきたい、といった場合には設定のオプションから「常にアドレスバーとタブを表示します」というオプションを有効にすることでタブが常に表示されるようになります。

f:id:mayuki:20131201040040p:image

f:id:mayuki:20131201040041p:image

ちなみにタブの並び替えには対応していないようです。ざんねん。

タブはウィンドウあたり100個まで開くことができることになっています。そのうち利用されていないタブは自動的にアンロードされる(iOSAndroidのブラウザと同じですね)のでメモリを使いすぎることはないでしょう。

Grouping together the navigation and tabs provides better control, with support for up to 100 open tabs per window.

What's New in Internet Explorer 11

ウィンドウを開く

Internet Explorer 11からタブとは別に新しいウィンドウを開くことができるようになりました。ウィンドウを開くどういうことができるのかというと画面分割で複数のページを並べることができます。捗りますね。

f:id:mayuki:20131201040042p:image:w640

ページを新しいウィンドウで開くには下記の方法があります。

  • タブを右クリックまたは長押しして新しいウィンドウとして開きなおす
  • リンクを右クリックまたは長押しして新しいウィンドウで開く
  • Shiftを押しながらリンクをクリックして新しいウィンドウで開く

ちなみに解像度とスケーリングモードによっては3つのウィンドウを並べることもできます。便利ですね。

f:id:mayuki:20131201040043p:image:w640

デスクトップ版のはなし

ちなみにInternet Explorer 9のころからですが、タブやメニューアイコンのあたりを右クリックするとタブをアドレスバーと同列ではなく一段下に並べるということができるようになっています。

f:id:mayuki:20131201114215p:image

f:id:mayuki:20131201114216p:image

トラックバック - http://subtech.g.hatena.ne.jp/mayuki/20131201