WebマーケティングやWebデザイナー関連の仕事をされている方は、Webページ全体のスクリーンショットを撮りたいときが多いのではないでしょうか?
Firefoxなら簡単にWebページ全体のスクリーンショットを撮ることができます!
アドオンも必要ありません。
本記事でご紹介していきます。
Firefoxをダウンロードされていない方は以下ページよりダウンロードできます。
この記事で分かること
FirefoxでWebページ全体のスクリーンショットを撮る方法
Firefoxでスクリーンショットを撮る方法

FirefoxでWebページ全体のスクリーンショットを撮る方法を見ていきましょう。
デスクトップ表示とスマホ表示のスクリーンショットの撮り方をそれぞれご紹介します。
デスクトップ表示を撮る場合
手順は以下の通りです。
▼Mac・Windowsの場合
- アドレスバーの右にある「三点リーダー」をクリック
- 「スクリーンショットを撮る」をクリック
- 「ページ全体を保存」をクリックして「ダウンロード」を始める
まずスクリーンショットを撮りたいWebページに行き、手順1で「三点リーダー」をクリックしてください。
次に手順2で「スクリーンショットを撮る」をクリックします。

スクリーンショットを撮る範囲を決める画面が表示されるので、「ページ全体を保存」をクリックしましょう。

ダウンロードを始めるとWebページ全体のスクリーンショットを撮ることができます。
スマホ表示を撮る場合
基本的にデスクトップ表示を撮る場合と同じ手順を踏みます。
異なる点は、スクリーンショットを撮る前に「スマホ表示」に変更することです。
手順を以下に掲載します。
▼Macの場合
- command + option + I
- デスクトップ表示からスマホ表示に変更
- アドレスバーの右にある「三点リーダー」をクリック
- 「スクリーンショットを撮る」をクリック
- 「ページ全体を保存」をクリックして「ダウンロード」を始める
▼Windowsの場合
- Ctrl + Shift + I
- デスクトップ表示からスマホ表示に変更
- アドレスバーの右にある「三点リーダー」をクリック
- 「スクリーンショットを撮る」をクリック
- 「ページ全体を保存」をクリックして「ダウンロード」を始める
手順1で開発ツールを開きます。
以下のような画面が表示されていたら大丈夫です。

次に手順2でスマホ表示に変更させます。
開発ツールの右側にスマホのアイコンがあるのでクリックしてください。

スマホ表示に変更ができたら、手順3〜手順5と進んでいただくとスマホ表示でWebページ全体のスクリーンショットを撮ることができます。
まとめ
FirefoxでWebページ全体のスクリーンショットを撮る方法をご紹介してきました。
スクリーンショットを撮るだけならChromeとかよりFirefoxの方が簡単です。
Firefoxは直感的に使うこともできるので、ぜひ試してみてください。
私はメインブラウザをChromeにしていますが、Firefoxも一緒に立ち上げておきスクリーンショットを撮る用に使用してます。

Firefoxを使ったことない方も多いのではないでしょうか?
まだダウンロードされていない方はこの機会にぜひ!
コメント