SafariのWebインスペクタって何?【iPhone】

[PR] 本ページで紹介しているECサイトやメーカーなどから購入実績などに基づいて手数料を受領する場合があります。

Safari


設定アプリの【Safari】→【詳細】に「Webインスペクタ」という機能があることをご存知でしょうか。

iPhoneを使っていて気付くことはまずない機能ですが、何に使うものなのでしょうか。

目次

開発者向けのツール

iPhoneのSafariで読み込んだページをMacから調査できる機能です。

たとえばウェブページの制作を行う際、実際にiPhoneでどのように表示されるか・動作するかを調べる際に使います。

使い方は以下の通りです。

まず設定アプリの【Safari】→【詳細】を開き、【Webインスペクタ】をオンにします。それからSafariでウェブページを表示しましょう。

Safari


次にiPhoneとMacをケーブルでつなぎます。

lightning


MacでSafariを起動。画面上の【Safari】メニューの【環境設定】を開き、【詳細】タブの【メニューバーに”開発”メニューを表示】にチェックを入れます。

Safari


画面上の【開発】メニューを開き、【iPhone】を選択。サブメニューから先ほど開いたウェブページを選びましょう。

Safari


【開発】メニューの【iPhone】は、iPhoneに設定した名前によって表示が異なります。

Webインスペクタで出来ること

ウェブページのソースや、構成しているファイルをチェックできます。たとえばソースで要素の上にカーソルを置くと・・・

Safari


対応する要素がiPhoneのSafariで強調されます。

Safari


ソースは編集でき、その結果はiPhoneのSafariでリアルタイムに表示。この編集は一時的なもので、エラーの解消やデザインの検討などに使います。

このほかにもたくさんの機能があるので、興味がある方はぜひ1度お試しください。

注意点:Macから丸見え

MacとiPhoneをケーブルに繋ぎ、接続先のMacを信頼していると、このWebインスペクタを使えば、MacからiPhoneのSafariで表示しているページが見えてしまいます。

必要なければ、設定アプリの【Safari】→【詳細】で【Webインスペクタ】をオフにしましょう。

Safari


「信頼」については、以下のページでご紹介しています。
iPhone充電時に現れる「信頼しますか」って何?

最新情報はAppBankアプリで!

もっとiPhoneを楽しむための情報がたくさんつまっていますので、ぜひお試しください!

AppBank ・販売元: APPBANK INC.
・掲載時のDL価格: 無料
・カテゴリ: 仕事効率化
・容量: 10.5 MB
・バージョン: 1.0.3
よかったらシェアしてね!
  • URLをコピーしました!

新着記事

マックスむらいの最新ドッキリ動画

目次