スマホサイトの表示を確認する9つの方法

スマートフォンの普及により、スマホサイトの必要性が広く認識されるようになり、制作依頼や問い合わせを多く受けるようになりました。

私自身は、iPhoneアプリの開発をしていることから、iPhoneシミュレータがMacにインストールされているので、これを使って、スマホサイトがうまく表示されているか確認することもできます。

しかし、最近はもっぱら、ブラウザの幅を縮小して、スマホサイトの表示を確認しています。これでも特に問題はないようですが、せっかくですので、他に何かスマホサイトの表示を確認する方法はないか、調べてまとめてみました。

Google Chrome ブラウザのデベロッパーツール

メニューバーの「表示」→「開発/管理」→「デベロッパーツール」とクリックし、下半分に表示された右端にある「Show Console」をクリックし、「Device」を選択して「Emulate」をクリックすると、スマホサイト表示で見ることができ、「Reset」をクリックすれば、元の表示に戻ります。

比較的簡単に確認することができて良いのでは思います。

Safari ブラウザのデベロッパーツール

Safariの「環境設定」の「詳細」で「メニューバーに”開発”メニューを表示」にチェックをつけることで、メニューバーの「開発」→「ユーザエージェント」が使えるようになり、スマホサイト表示を確認することができるようなのですが、あいにく私はうまく見ることができませんでした。

iPhoneシミュレータ

Mac App Store より、Xcodeという、iPhoneアプリを開発するための無料ツールをダウンロード、インストールすれば、iPhoneシミュレータでスマホサイトの表示確認をすることができるようになります。

しかし、あくまでもiPhoneアプリ開発のためのツールですので、データ容量も大きいですし、iPhoneシミュレータのアドレスバーにURLを入力することで、スマホサイトを見ることができるようになっていますから、ローカルのHTML、つまりパソコン上で制作中のスマホサイトは見ることができないように思います。

また、Mac専用ですので、Windowsでは使うことはできません。

Android SDK

Android Developers にて、Android SDKという、Androidアプリを開発するための無料ツールをダウンロード、インストールすることで、エミュレータというものでスマホサイトの表示確認をすることができるようになります。MacでもWindowsでも使うことができます。

しかし、私は使っていません。スマホサイトの表示確認をするためだけに、アプリ開発のツール一式をインストールするというのは、データ容量も大きく、ちょっと負担かなという気がするからです。

Mobilizer（モビライザー）

MacでもWindowsでも使うことができる、スマホサイトのプレビューツールです。Adobe Airのインストールが必要ですが、ローカルのHTMLサイトを見ることもできて、便利なように思います。

ただ、ダウンロードしようとしたところ、公式サイトでは「3,043円」と有料で、softnic（ソフトニック）のページでは「無料ダウンロード」となっていて、なんだかちょっとよくわからないので、使うのをやめました。

Responsive Design Testing

http://mattkersley.com/responsive/ のURLにアクセスして、表示を確認したいスマホサイトのURLを入力すると、複数サイズのスマホサイト表示を見ることができます。

ただし、ローカルのHTMLサイトは見ることができないようです。

Responsive Web Design Test Tool – Designmodo

http://designmodo.com/responsive-test/ のURLにアクセスして、表示を確認したいスマホサイトのURLを入力し、ドラッグすることで、色々なサイズでスマホサイト表示を確認することができます。

ただし、これもローカルのHTMLサイトは見ることができないようです。

スマホ閲覧ツール　スマキチ

CommerceDesignさんから提供されている、スマホ閲覧ツールですが、楽天市場出店者向けになっていますので、たしかローカルのHTMLサイトは見れなかったと思います。

しかし、楽天市場で売上を上げるために役立つ情報などが、メルマガで送られてくることがあります。結構いい内容だったと思いますので、楽天市場出店者さんはぜひどうぞ。

いかがでしたでしょうか？とりあえず、インターネットブラウザの幅を、ドラッグして縮めるだけでも、ある程度スマホサイト表示の確認をすることはできますので、ご自分に合った方法でお試しくださいね。