Macの任意のブラウザで要素を調査する方法

ウェブページのソースコードが気になったことはありませんか？Macのネイティブブラウザを含むほぼすべてのブラウザには、それを確認できる機能があります。それは「要素を調査」と呼ばれます。

「要素を調査」では、HTML、CSS、JavaScriptのウェブページコードを確認できるだけでなく、変更することもできます。これにより、開発者はこの機能を使用してウェブページやウェブアプリケーションをテストできますが、ユーザーは自分のパーソナルブラウザのフォントを変更するためにも使用できます。

Macの任意のブラウザで「要素を調査」を使用する方法とコードの変更を開始する方法を学ぶには、以下の手順を確認してください。

MacのSafariおよびその他のブラウザで要素を調査する方法

「要素を調査」機能の使用は、macOSで使用可能なすべてのWebブラウザで同じです。数回クリックするだけでアクティブ化できます。例外はSafariで、使用する前に「要素を調査」を有効にする必要があります。別のセクションで有効にする方法を説明しています。

しかし、一般的にMacのお気に入りのブラウザで「要素を調査」を使用する場合（または有効にした後）：

目的のブラウザを開き、調査したいウェブページに移動します。
Controlキーを押しながら（右クリック）、ウェブページ上の任意の場所をクリックし、コンテキストメニューから調査または要素を調査を選択します。キーボードショートカットCmd + Shift + Cを使用することもできます。
インスペクターツールが開き、ウェブページのソースコードが表示されます。必要に応じてコードを読み取ったり変更したりします。たとえば、Safariのウェブページを編集して、テキストや画像をいじることができます。
インスペクターツールを閉じるには、Xボタンをクリックします。

Safariで「要素を調査」を有効にする方法

MacのSafariで「要素を調査」機能を有効にするには、開発メニューをアクティブにする必要があります。これを行うには、

Safariを開き、メニューバーからSafari > 設定に移動するか、キーボードでCmd + ,を押します。
詳細タブに進みます。
メニューバーに開発メニューを表示のボックスにチェックを入れます。

Safariを使用しているときに、開発メニューがトップメニューに表示され、コンテキストメニューからMacで「要素を調査」にアクセスできるようになります。

ブラウザで「要素を調査」を使用するタイミング

開発者は「要素を調査」を使用して、ウェブページやウェブアプリケーションのレイアウトの変更を試したり、さまざまなブラウザのユーザーの機能をテストしたりできます。しかし、通常のユーザーも使用できます。

ウェブページのフォントが読みづらい場合や、気に入らない色になっている場合は、「要素を調査」を使用して変更し、ページをより読みやすくしたり、見やすくしたりすることができます。また、「要素を調査」を使用してウェブページのヘッダーを変更し、友達を驚かせることもできます。

「要素を調査」は、Macと使用している特定のブラウザでのみ変更されます。そのため、Webサイトをすばやく変更して自分の好みに合わせたいときはいつでも使用してください。

「要素を調査」：ユーザーエクスペリエンスを向上させる機能

Macで「要素を調査」を使用する方法を知っていると、ウェブページの使用がより効率的かつ快適になります。書式設定の問題をすばやく修正し、開発者がバグを修正できるようにします。

このガイドが機能を活用するのに役立つことを願っています。次回、Safariやその他のブラウザでウェブページに問題が発生したときには、解決策があることを知ってください。

FAQ

Q：MacのPDFで「要素を調査」を使用するにはどうすればよいですか？

MacのPDFで「要素を調査」を使用する方法は非常に簡単です。プレビューアプリでPDFを開き、情報アイコンをクリックします。ここでは、ファイルサイズ、コンテンツ作成者など、さまざまな側面にアクセスできます。

Q：Macで右クリックせずにインスペクター要素を使用するにはどうすればよいですか？

トラックパッドをタップせずにインスペクター要素を使用するのは非常に簡単です。command + option + Iを同時に押すだけです。そうすると、インスペクター要素ウィンドウが画面の下部に表示されます。右クリックの方法と同じ方法で閉じることができます。デバイスのその他の機能には、他の多くのMacキーボードショートカットを使用することもできます。

Q：インスペクター要素はすべてのウィンドウで自動的に開きますか？

いいえ。インスペクター要素ウィンドウは、現在使用しているタブでのみ開きます。別のタブで機能を使用したい場合は、そのタブに移動し、最初に行ったのと同じ手順を実行する必要があります。

パソコンの友達