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

スマホやタブレットでの

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

できる便利なソフト。

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

responsivize13

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

目次

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

responsivize1

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

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

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

responsivize2

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

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

起動します。

responsivize3

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

responsivize4

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

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

Nextをクリックします。

responsivize5

Installをクリックします。

responsivize6

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

使い方

responsivize7

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

表示されます。

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

表示確認が出来ます。

responsivize8

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

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

画面確認ができます。

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

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

非常に便利です。

responsivize9

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

MissionViewerのGridモードを表示して

画面に並べてみました。

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

responsivize10

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

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

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

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

便利です。

responsivize11

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

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

 

responsivize12

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

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

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

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

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

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

非常に助かります。

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

よかったらシェアしてください!
  • URLをコピーしました!

コメント

コメントする

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

目次