レスポンシブデザインのコーディング案件があったので、デバイス毎のテストツールについてまとめようと思います。

Responsive Design Testing

デバイスサイズは主要サイズ(240,320,480,768)は用意されています。一度に主要サイズをチェックできるので、ざっと確認したい時には使用します。

 

 

Responsivator

こちらはサイズの変更ができるのでとても便利です。ダウンロードして解凍すればすぐに使えます。

 

1. Responsivator ダウンロード

右中にある「DownLoad ZIP」をクリックしてダウンロードします。

 

2. Responsivator 解凍

index.htmlにアクセスします。

 

3. Responsivator 表示確認

URLを入力後「RESPONSIVATE!」をクリックするとデバイスサイズ毎の表示の確認ができます。デバイスサイズは、「customize」をクリックすると自分で設定できます。