どうも、webマーケ研究者宮地です。

先日Safariでページのソースを確認したかった時に、「右クリックでデベロッパーツールが表示されない!」という事態に陥りました(普段はChromeで確認しているため)。

同じように初めてSafariでデベロッパーツールを触りたい方が迷わないように、この記事ではSafariでデベロッパーツールを表示させる方法を紹介します。

Safariでデベロッパーツールを表示させる方法

Safariでデベロッパーツールを表示させていきます。

 

まずは、メニューバーからSafari>環境設定と開きます。

環境設定の画像

次に、詳細をクリックし、一番下にある「メニューバーに”開発”メニューを表示」にチェックを入れます。

メニューバーに開発が追加画像

メニューバーに「開発」が追加されました。これにて完了です。

あとはChromeでデベロッパーツール(検証)を開くように、Safari上で右クリックして「要素の詳細を表示」をクリックすると、デベロッパーツールを利用することができます。

ソース表示画像

これ以降は、常にSafariでデベロッパーツールを右クリックから使えるようになります。

 

Safariでもデベロッパーツールで表示確認を

パソコンをマウスで操作する男性

ブラウザごとの表示確認は、Webマーケターとしては必須なところ(怠るな俺)。

しっかりとSafariでも確認していきましょう。

【この記事を読んだ方にオススメ】

 

おすすめの記事