デベロッパーツールの表示方法

パソコン

MacのSafariでデベロッパーツール(Webインスペクタなど)を表示する方法

普段はChromeをメインブラウザにしているんですが、ここ最近はSafariもよく使うようになってきました。そんな時にSafariでもWebインスペクタやソースコードを表示したいと思ったんですが、表示方法がイマイチ分かりづらい印象だったのでメモがてらご紹介します。

Safariの環境設定から開発メニューを表示

デベロッパーツールを表示させるやり方はSafariの環境設定から可能です。

上部メニューから「Safari」→「環境設定…」を開きます。ショートカットキー「command + ,」でも開くことができます。

Safariの環境設定を開く

続いてタブメニューから「詳細」を選択して、下にある「メニューバーに”開発”メニューを表示」にチェックを入れます。

開発メニューを表示させる

すると、先ほどまで上部メニューになかった「開発」が表示されるようになりました。

開発

あとは開発メニューからWebインスペクタを表示させたりすることができます。WebインスペクタのショートカットキーはChromeと同じで「command + option + I」になります。

そんなわけで、SafariでもChromeみたいにデベロッパーツールを使いたいという方は、普段から開発メニューを表示させておくのがよさそうです。

関連記事

  1. ColorQuest

    パソコン

    Macのディスプレイ(画面)上のRGB値や色の名前を表示してくれるアプリ「ColorQuest」

    ColorQuestというMacのアプリがとても便利だったのでインスト…

  2. パソコン

    Macの起動時にアプリケーションを復元させない方法

    Macの起動時にアプリケーションを復元させない方法です。アプリのウィン…

  3. パソコン

    Macのシリアル番号を調べるための確認方法

    自分が使っているMacのシリアル番号を知りたい時ってありますよね。そん…

  4. MacのBluetooth表示名やコンピュータ名を変更

    パソコン

    MacのBluetoothの表示名やコンピュータ名を変更する設定方法

    MacをBluetoothで接続する際に表示名が気になることがあります…

  5. テキストエディットで検索した文字を置き換える

    パソコン

    Macのテキストエディットで検索した文字を置き換えるやり方

    前回、Macのテキストエディットで特定の文字を検索するやり方をご紹介し…

  6. パソコン

    Macのあらゆるアプリのショートカットの一覧を表示させることができる「CheatSheet」

    これめちゃくちゃ便利ですね。なんで今まで入れてなかったんだろう。Mac…

最近の記事

  1. スタンスミス(EDIFICE/IENA別注)
  2. WI-1000XM2
  3. mill オイルヒーター
  4. Anker PowerWave 10 Pad & Stand セット

アーカイブ

PAGE TOP