IE11とPer Monitor DPI

Windows 8.1になって、モニターごとにDPIを設定できるようになりました。といっても、あるモニターにXdpi、別のモニターにはYdpiという指定はできないようです。Windows 8.1では「すべての項目のサイズを変更する」に設けられた「小さくする」から「大きくする」を大雑把に選ぶスライダーで、DPIを設定するようになりました(図1)。この設定を変更するとシステムが自動的にモニターごとにDPIを割り当てます。


図1:Windows 8.1の「すべての項目のサイズを変更する」(DPIの設定)

私は1920×1080のモニターを持ったノートPCに、1980×1080の外部モニターをつないで使っていますが、Windows 8.1にしたところノートPCのモニターは120dpi(125%)、外部モニターは96dpi(100%)という設定になりました。

さて、Windows 8.1のIE11はPer Monitor DPIに対応しており、ウィンドウが存在するモニターのDPI設定が反映されます。具体的にはデフォルトのズーム倍率に表れます。例えば、96dpiのモニターにIE11のウィンドウが表示されている場合では、デフォルトのズーム倍率は100%ですが、120dpiのモニターに移動すると125%になります。試していませんが、144dpiのモニターに移動すると150%に変化するはずです。気になるのは複数のモニターにまたがったウィンドウがどうなるのかということですが、手元で試した限り*1では、ウィンドウの領域がもっとも多く存在しているモニターのDPIが使われるようです。

これにより、DPIが違うモニターを使っている環境では、IE11でRWDなサイトを閲覧しているときにウィンドウを別のモニターに動かすとレイアウトが変わる、ということが起こりえます。

実際に、マウリッツハイス美術館展のサイトIE11で表示したときのスクリーンショットを示します。図2では、IE11のウィンドウ(の領域の半分以上)は96dpiのモニターにいます。この時のデフォルトのズーム倍率は100%で、PCなどでの閲覧を意識したレイアウトになっています。図3では120dpiのモニターに移動しています。単にウインドウを移動させただけですが、120dpiのモニターに移動したIE11のデフォルトのズーム倍率は125%に変化しました。この結果、画面はスマートフォンなどでの閲覧を意識したレイアウトに変わりました。


図2:96dpiのモニター上のIE11マウリッツハイス美術館展のサイトを表示(f:id:takenspc:20131022003546p


図3:120dpiのモニター上のIE11マウリッツハイス美術館展のサイトを表示(f:id:takenspc:20131022003537p)

さすがに最近では、マウリッツハイス美術館展のサイトのようにドラスティックにレイアウトが変わるサイトは多くないでしょうが、注意したいところです。

*1:モニターを左右に並べて、ウィンドウを行ったり来たりしてどうなるかを試しました