フリーソフトコミュ ~国内・海外の無料アプリ紹介~

【まとめ】スマホやタブレットでのサイト表示チェックに役立つオンラインサービス5選

スポンサーリンク

resolutioncheck_mini当ブログもそうですが、最近はあらゆるサイトがスマートフォン表示やタブレット端末での表示に最適化されるようになってきました。

表示の切り替えは、解像度で判断するレスポンシブ・ウェブ・デザインタイプや、ブラウザのUser-Agentで切り替えている場合など様々ですが、いちいち手持ちのスマホで表示をチェックすることが面倒だったり、そもそもサイトのテンプレートをデザインしている段階ではローカルのサーバー環境でしか動作確認できない状態にあったりします。

今回は、そんなときに役立つ解像度によってフレキシブルにリサイズするレスポンシブ・ウェブ・デザイン対応のサイトのレイアウトチェックに役立つオンラインサービスをピックアップしてみました。

1. iPhone 5 Simulator

iphone5simulator
タイトルがそのままですが、iPhone 5 のフレームのディスプレイ(解像度)に指定したURLをナビゲート表示してくれるシミュレーター。

iPhone自体を含めた全体的なレイアウトのチェックに役立ちます。

iPhone 5 Simulator
iPhone 4版もあります。
iPhone 4版のシミュレーターはこちら

2. Viewport resizer

viewportresizer
こちらはオンラインサービスというより、Javascriptでの解像度別チェックスクリプト。

Click or Bookmarklet」リンクをブックマークバーにドラッグ&ドロップしてブックマークに追加し、チェックしたいURLを開いている状態で、このブックマークレットを呼び出すと以下のようにあらゆるデバイス別で表示をチェックできます。
viewportresizer2リロードせずに、Android端末、iPhone、iPadなどのタブレット端末のサイズに切り替えたり、デバイスの表示を縦・横に切り替えられるほか、解像度を自由に指定することも可能。

とても便利です。

Viewport resizer

3. Screenfly

screenfly
URLを指定して、iPhone 4/5, Galaxy, OptimusなどのAndroid端末、タブレット端末別の解像度で表示をチェックできるサービス。

縦・横表示の切り替えや、プロキシ接続での表示チェックも行えます。

Screenfly

4. ViewLikeUs

viewlikeus
指定したウェブページの、ノートPC(10~15.6インチ)、デスクトップPC(19~24インチ)、iPhone 3/4/5, Nexus S, Galaxy S3の表示チェックが行えます。

ViewLikeUs

5. TestSize.com

testsizecom
240 x 320ピクセル~1920 x 1024ピクセルの一般的なアスペクト比別での表示チェック、または指定した解像度での表示チェックが可能。

キーボードの「+」、「-」キーでズームイン/アウトなどホットキーに対応。

TestSize.com

URL :
TRACKBACK URL :

LEAVE A REPLY

*
DigiPress

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

COMMENT ON FACEBOOK

Return Top
QR Code Business Card