Chromeでデバイスごとの画面サイズチェックできるWindow Resizer。

ChromeユーザーでなおかつWEBデザイナーであれば、この機能拡張は必須でしょう。レスポンシブをチェックするのに「Window Resizer」が便利です。

Chromeでも各種デバイスのチェックが可能だが。。。

Chromeにもデフォルトでデベロッパーツールから各種デバイスでの表示のチェックが可能ですが、表示もモタツクし操作しづらい。

拡張機能、Window Resizerをインストール。

そこでWindow ResizerをChromeにインストールしましょう。
まずはChromeを立ち上げ、Window Resizerのインストールのページへ。

「＋CHROMEに追加」をクリック

「Window Resizerを追加しますか？」というダイアログが出てきますので、拡張機能を追加をクリック。

Window Resizerが追加されました。右上のWindow Resizer（NEWアイコン）をクリック。

「BETAバージョンにトライしてみて」っつうアラートが出てきますが、無視して「OK, got it!」をクリック。

すると各デバイスに切り替えるナビゲーションがでてきます。下の方にある「Edit presets」をクリックしてみましょう。

ここにAdd new resolutionを追加しておくことも可能です。よく使うサイズは予め登録しておきましょう。

 

コメント

プロフィール

bbpはWEBデザインと輸出入の仕事をしてます。趣味程度のブログです。キュレーションへの投稿、ページのいいねとシェアに喜びます。