レスポンシブ・デザインで作ったウェブサイトのテストをできる便利なウェブアプリをご紹介。実機テストの前段階のちょっとしたテストには便利そうです。
「responsivepx」というウェブアプリで、ブラウザのウィンドウサイズを変更しなくても、いろいろなサイズでウェブサイトをテストできます。サイズの数値を1px単位でインタラクティブに変更できるので、どこでレイアウトが崩れるかなど細かいチェックができるのが嬉しいです。
ここが便利！
- ブラウザのウィンドウサイズを変更しなくて良い。
- サイズの数値を1px単位でインタラクティブに変更できるので、より細かいレイアウトチェックができる。
※ちなみに数値のテキストボックスにカーソルを置いて、上下キーで数値を変更できました (Mac Google Chrome 14.0.825.0 dev) - URLのコピペでウィンドウサイズとURLを指定したページをチームで共有できる。
たとえばこんな具合に → iPhondeサイズでのチェックをお願いします！
ドロップダウンで代表的なブレイクポイントを指定できたら便利なですが。。。GitHubでソースを公開しているようなので、Forkを作るのもありかもしれません。
2011年7月23日に公開され、2012年4月28日に更新された記事です。
About the author
「明日のウェブ制作に役立つアイディア」をテーマにこのブログを書いています。アメリカの大学を卒業後、ボストン近郊のウェブ制作会社に勤務。帰国後、東京のウェブ制作会社に勤務した後、ウェブ担当者として日英バイリンガルのサイト運営に携わる。詳しくはこちら。
ウェブ制作・ディレクション、ビデオを含むコンテンツ制作のお手伝い、執筆・翻訳のご依頼など、お気軽にご相談ください。いずれも日本語と英語で対応可能です。まずは、Mastodon @rriver@vivaldi.net 、Twitter @rriver 、またはFacebook までご連絡ください。