Panda Noir

JavaScript の限界を究めるブログです。

iPhoneとmacとの連携が便利…かも!

前にGoogle ChromeでiPhone版のデザインを確認する方法という記事を書きました。
しかし、それに匹敵するかもしれない(個人的にはChromeのほうがよかったですが)ものがありました。
その名も「webインスペクタ」です。

webインスペクタの導入方法

まず、macSafariを起動し、「設定>詳細」にある「メニューバーに"開発"メニューを表示」にチェックを入れます。
次にiOS6iPhone(もしくはiPad。説明のため以下はiPhoneで統一しますがiPadでもできます)の「設定>Safari」の「webインスペクタ」をONにします。
IMG_0818.PNG
最後にケーブルでmaciPhoneをつなぎます。
これで準備OKです。

やりかた

maciPhoneをつなぐと、macSafariのメニューバーの「開発」で自分のiPhoneの名前がでます。
そこの中の項目をクリックすると、webインスペクタが開かれます。
ぱっとみ普通です。
しかし、画面がiPhoneの方です。
うーん、なんか説明がいまいちですね。でもやると一発でわかります。
iPhone版のサイトのデザインをいじったりするのがとても楽になります。

わたしはケーブルをつかわないChromeの方が好きです。そんなにかわらないですし。
利点はケーブルでつなぎかえるだけでiPadiPhoneのサイトが一瞬でかえれることですかね。
結局どちらもにたような感じです。みなさんはどちらがすきですか?