タブ単位でスマートデバイスの表示確認ができるChrome拡張機能 [MobileLayouter] - SEMHACKs

タブ単位でスマートデバイスの表示確認ができるChrome拡張機能 [MobileLayouter]

      2015/08/16

medium_8157096919

スマートフォンの個人所有率が過半数を超えているそうです。
リスティング広告においても、スマートフォンやタブレットにおける掲載は重要度が増すばかりですね。

スマートフォン所有率、過半数超えに~女性の所有率が男性をわずかに上回る【VRI調査】 (1/1):MarkeZine(マーケジン)


掲載先はスマートフォンやタブレットの回数は増えていますが、当然私たちのリスティング広告に関する業務は効率性を考えてもPC中心でしょう。
実際に、スマートデバイスで掲載状況を確認することがもっとも大事ですが、ちょっと確認してみる程度では以前紹介したようなPCでブラウザの拡張機能などを利用してWebページが携帯・スマートフォン・タブレットでどのように表示されるのか、ブラウザ上で手軽に確認したいですよね。

以前紹介した機能では、2つの不満点がありました。1つ目は、使用した際の表示形式が実際とは大きく異なる(横幅がブラウザ幅に伸びた状態で表示)、2つ目は機能を使用すると、ブラウザで開いているタブすべてに反映されてしまうという点です。

今回は、この2つの問題をクリアしているChromeの拡張機能『MobileLayouter』をご紹介します。

Chrome ウェブストア - MobileLayouter

userAgentを偽装して携帯・スマートフォン用のWebページを表示するツールです。
実機調査に基づいた画面のサイズに合わせて、Webページのサイズを調整します。

主な機能

①user-Agent偽装
一覧から端末を選択するとその端末のUA(UserAgent)に偽装しWebページを表示します。タブ毎に偽装が可能です。
②サイズ調整
一覧から選択した端末の画面サイズ通りにコンテンツの幅・高さを調整します。
③端末の縦・横切り替え
縦横切り替えアイコンをクリックすると画面を縦状態/横状態に切り替えることができます。

タブ毎なのが特に便利です!別にブラウザを立ち上げずに済むし、他のタブで作業をしようとしたらスマホ表示なってしまったなんてこともありません。
また、実際のデバイス表示に近いサイズで調整されるのでイメージがしやすいです。また、縦横で表示のされ方が異なるケースがあるので、これに対応しえいるのも素敵すぎます。
2013/04/22時点でスマートフォン291機種、タブレット37機種と豊富に対応しているんですね。

詳しい解説は、公式紹介ページがありましたので、ご参考ください。
https://www.x-fit.jp/tips/188

まとめと注意

これらの機能は、あくまでUserAgentを偽装するツールなので、実機での結果と異なる場合があります。ですので、実機での確認は必須です。

簡易的に確認するのであれば、非常に便利なツールですね。

プッシュ通知で更新を受取る

Facebookであとでみる

 - スマートデバイス, 便利ツール