エミュレーターや実機で検証の前にWindows Phoneの検証にIE9が非常に役立ちます。IE9の開発者ツールでユーザーエージェントをWindows Phoneに指定すればIE9でスマートフォン向けのサイトの検証等ができます。
スマートフォンサイト作成でPCのブラウザでユーザーエージェントを変えて検証するというテはよく使うかと思います。スマートフォンサイトだとiOSとAndroidが中心なので、私はよくSafariを使用します。Safariの開発者メニューは非常に便利ですよね。IE9の開発者ツールはそれに近いです。
ちなみに、Safariの開発者メニューに関しては下記のエントリーが参考になります。
Safariの開発者メニューでスマートフォン開発[to-R]
iOSやAndroidの場合は、Webkitなのでよいのですが、Windows Phoneの場合はそうもいきません。CSS3の対応度がiOSやAndroid比べても低いですし、JavaScriptの挙動も多少は異なったするからです。
しかし、幸いにもWindows Phoneは、IE9ベースとなるためIE9で表示・動作されれば問題ないとみてよいかと思いますので、Windows Phoneの検証時には、[IE9]→[Windows Phoneエミュレーター]→[実機]の順で行なっています。
開発者メニューの表示は、「F12」を押すか、下記図のようにメニューから「開発者メニュー」を選択して表示します。
ユーザーエージェントを変更するには、下記の手順を行います。
[ツール]→[ユーザーエージェントの文字列を変更]→[カスタム]
そうすると下記図のようなボックスが表示されます。
その入力欄にWindows Phoneのユーザエージェント（auからでているIS12T参照）は下記になるので、下記の文字列を「ユーザーエージェントの文字列」に入力します。
Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0; FujitsuToshibaMobileCommun; IS12T; KDDI)
先ほど、入力したものが表示されます
こいつをクリックするとWindows Phoneのユーザエージェントに切り替わります。 開発者メニューすべてが使えますので、CSSやJavaScriptのデバッグを行いやすくなり、効率も上がります。
コメントする