レスポンシブデザインの簡単な確認方法

レスポンシブデザインのテストツール

Webサイトへアクセスするデバイスは、スマートフォン、タブレット、PCなど、非常に多様化してきており、
レスポンシブWebデザインが重要になってきています。
対応デバイスが増えるということは、それに伴ってテストも大変になるということです。

そこで今回は、Webサイト作成の際に「iPad２だとどう見えるんだろう」といったケースで簡単に確認できるツール、
designmodo.com/responsive-testを紹介します。

使い方は簡単です。ここへアクセスし、
画面上部のテキストボックスに、対象のURLを記述しましょう。(http://localhostとかでもOK)
そして、画面右のドロップダウンメニューから「iPad」とか「15" Macbook Pro」とかの対象デバイスを選択すれば、
そのデバイスでどう見えるか確認することができます。

また、確認したいデバイスがメニューに載っていない場合でも、自分でサイズ入力すれば表示することが可能です。

参考サイトなど

• designmodo.com/responsive-test: http://designmodo.com/responsive-test/