iPhoneとMacを繋げて簡単にFirebugをする方法（簡単Webインスペクタ）

これは知りませんでした。IOS6からでしょうか？

iPhoneサイトを制作するときに、実機での確認と修正って面倒ですよね。
いつもは、iWebInspectorを利用して、Xcodeを利用して、mac上でまずは確認していたんですが、実際の実機でも確認できたらいいなと思っていました。


それが、実はiPhoneをMacにUSBでつなぐとデフォでできたというのを知らなかったです。

Firebugとかデベロッパーツールとかでやる、ソースをいじって要素を見たり、消したり増やしたりするいわゆるWebインスペクタ。これがとても簡単にできたんです。

Webインスペクタのやり方

まずは、iPhoneとMacをUSBで接続

iPhoneのSafariの設定から詳細をクリック

WebインスペクタをONにする

MacのSafari（最新）の開発タブ を見ると、○○のiPhoneというのが表示され、iPhoneのSafariで今開いているサイトも表示されて選択できる。

※開発タブが無い人は、Safariの「環境設定」>「詳細」> 「メニューバーに”開発”メニューを表示」をクリック。

クリックするとFirebugとかデベロッパーツールみたいな例の画面が登場します。Webインスペクタです。

要素を選んで編集することができます

要素を選ぶと、iPhone上で選択することができます。

要素を消すと、iPhone上で要素を消すことができます。

これは簡単にiOSのチェックができますね！