今日の人気記事

スポンサードリンク

Safari 9:開発メニューに「レスポンシブ・デザイン・モード」を追加

Responsibe 01

「OS X El Capitan」と「OS X Yosemite」向けの「Safari 9」では、メニューの「開発」のセクションに「レスポンシブ・デザイン・モード」が追加されています。

スポンサードリンク


iPhoneやiPad、Macでどう見えるかをシミュレートできる

基本的にこの「レスポンシブ・デザイン・モード」は一般の人向けではなく、デベロッパ向けとなりますが、ウェブサイトを運営・管理している人は、様々なデバイスでどう見えるかをチェックできるので便利です。

早速やり方を見ていきたいと思います。まずは、Safariのメニューバーから環境設定を選びます。

Responsibe 02

上のメニューの「詳細」から、一番下にある「メニューバーに”開発”メニューを表示」にチェックボックを入れます。

Responsibe 03

するとメニューバーに「開発」が出てくるので、そこのメニューに「レスポンシブ・デザイン・モードにする」を選びます。

Responsibe 04

このモードでは、「iPhone 4s」〜「iPhone 6 Plus」までのサイズ、「iPad mini 3」「iPad Air 2」のサイズ、Mac向けの解像度「800×600 – 1366×768 – 1920×1080」を選べます。

Responsibe 05

IEやChrome、Fire Foxをシミュレートできたり、Retinaディスプレイのモードも選べるようになっています。

Responsibe 06

細かい部分としては、iPhoneのランドスケープモードや、iPadのSprit viewにも対応していたりするところは便利だと思います。

スポンサードリンク

コメントを書く

*
*
* (公開されません)