スマホやタブレットでのレシポンシブデザインの確認ができるソフト 『Responsivize』

スマホやタブレットでの

レシポンシブデザインの表示確認が

できる便利なソフト。

Web制作者には非常に便利です。

Responsivize ダウンロードはこちらから

ダウンロードとインストール

上記リンク先ページを開き

OSに合わせてクリックして

ファイルをダウンロードします。

ダウンロードしたファイルを解凍すると

実行ファイルが展開されますので

起動します。

そのままNextをクリックします。

チェックをするとデスクトップに

ショートカットを作成します。

Nextをクリックします。

Installをクリックします。

これでインストールは完了です。

使い方

ソフトが起動するとこんな画面が

表示されます。

スマホやタブレット、PCやカスタムサイズで

表示確認が出来ます。

スマホで開いてみました。

各主要なスマホで一画面で

画面確認ができます。

微妙な表示幅の違いに時々苦しみますが、

こうやって違いを比較してみる事が出来るのは

非常に便利です。

先日に公開したWebサービス

MissionViewerのGridモードを表示して

画面に並べてみました。

表示幅が微妙に違うのが分かります。

タブレットで表示してみました。

Chromeのデベロッパーでも同様の

機能はありますが、こうやって

画面を並べて比較までは出来ないので

便利です。

PCでも表示確認をしてみました。

様々な画面サイズの確認ができます。

 

また用意されていない解像度も

自由にカスタムできる機能もあります。

今の時代、スマホからタブレット、PCなど

CSS等で全て対応しなければならないので

レスポンシブデザインは必須です。

大変な時代ですが、こういうツールがあれば

非常に助かります。

Web制作時に便利なソフトです。