iPhoneで表示しているページをMacでデバッグできるSafariのWebインスペクタ

@kasumiiです。こんにちは。

SafariのWebインスペクタは、iPhoneで表示しているページをMacから確認できる便利な方法です。

iOS 6の頃からできるっぽいので今さら感ありますが、忘れないようにメモメモ。

まず最初に、iPhoneをケーブルでMacに繋いでおきます。

iPhoneの「設定」→「Safari」→「詳細」の画面で、Webインスペクタをオンに。

これは初回のみやればOKです。

MacのSafariを起動し、「環境設定」→「一般」タブ内の「メニューバーに開発メニューを表示」にチェックを入れます。

MacのSafariで、「開発」メニューからiPhoneを選択すると、iPhoneのSafariで表示しているウェブページの一覧が表示されます。

あとは、デバッグしたいページを選択するだけでOK！

Webインスペクタが使えるようになるので、デバッグしやすいです！

iPhoneとMacさえあれば、特に他のツールをインストールしなくてもすぐに使えるのがいいですねーヽ(*´ω｀*)ノ