Webページのソースコードを見る方法

このWebページってどんなhtmlなんだろ？とか、自分のWebページのhtmlを確認したいというケースがあります。
そんなとき、Webページのソースコードを確認する方法をお伝えします。

※Firefox、Google Chrome、Microsoft Edge共に、同じ方法で確認可能です。

Webページのソースコードは、ブラウザ上で確認できます。

(1) まずはソースを確認したいWebページをブラウザで表示します。

(2) ページ上でマウスの右ボタンを押してメニュー開き、「ソースの表示」を選択します。

※ブラウザによって表示される内容が異なります。

(3) 新規タブが開き、Webページのソースコードが表示されます。

表示されたソースコードは、いくつかの方法で保存できます。

メモ帳に貼り付ける

(1) Ctrl+Aでソースコードを選択状態にします。

(2) Ctrl+Cを押し、選択したソースをクリップボードにコピーします。

(3) メモ帳などを開き、Ctrl+Vでクリップボードから貼り付けます。

(4) メモ帳などの保存機能で、ソースコードを保存します。

ブラウザから直接保存する

(1) ソースコードが表示されているタブ上で右ボタンを押しメニューを表示します。

(2) 表示したメニューから次の項目を選択します。

Firefox：「名前を付けてページを保存」
Google Chrome：「名前を付けて保存」
Microsoft Edge：「名前を付けて保存」

(3) 保存先とファイル名を指定する画面が表示されるので、指定して「保存」を押します。

Webページの内容を変更しても、ブラウザのキャッシュが働いているため、以前のソースコードが表示されます。

キャッシュが更新されるまで待てば新しいコードが表示されますが、それでは遅すぎます。

すぐに確認したいときは、ソースコードが表示されているタブでスーパーリロードします。

スーパーリロードの方法は、次のページを読んでみてください。
■ブラウザのキャッシュを無効にしてWebページを表示する方法

そもそもWebページの内容が変わっていないというときも、スーパーリロードしてみてください！