FireFoxで全画面・範囲選択スクリーンショットを撮るには、アドオンはいらなかった

私はアドオン(ブラウザの拡張機能)をあまり使わないようにしています。

なぜかというと、アドオンが増えていくとなんのために入れたのか忘れたり、ブラウザの動作が重たくなりそうな感じがしまして。

そこで、Firefoxでアドオンを使わずにスクリーンショットを撮れる方法はないのか調べました!

やっぱり時間をかけて調べてみると、わかることが多いですね。

ページ全体のスクリーンショットを撮る方法

  1. アドレスバーの・・・をクリックし、「スクリーンショットを撮る」を選択してください。
    アドレスバーの・・・をクリックし、「スクリーンショットを撮る」を選択
  2. 次のような画面が表示されるので、「ページ全体を保存」をクリックする
    「ページ全体を保存」をクリック
  3. 選択できるボタンが3つ表示されます。各ボタンは次のような意味があります。
    選択できるボタンは3つ
    • A:クリップボードにコピー
    • B:スクリーンショットをダウンロード
    • C:簡単な画像加工(トリミングとペンツール)と
      簡単な画像加工(トリミングとペンツール)
      SNSやメール共有・共有リンクURLの作成ができる。また、ブラウザ上にショットして保存される
      SNSやメール共有・共有リンクURLの作成ができる

ショットとは

ショットとは、撮ったスクリーンショットを14日間Firefox上に保存できる機能(BETA版)です。こんな感じで、画像とURLが保存されています。
ショットには画像とURLが保存されている

使いみちは、思いつきませんが…。気に入ったデザインのサイトを保存しておくには便利かもしれません。14日間という期間は短いですが。

スマホで表示したときのページ全体を撮る方法(レスポンシブデザインモード)

レスポンシブデザインモードでスクリーンショットを撮るには、これまで紹介した方法ではできません。別の方法で行う必要があります。

  1. ブラウザ上で右クリック、またはF12キーを押し開発ツールを開いてください。
  2. 開発ツールの右のほうにある携帯のようなアイコンをクリックします。
    開発ツールの右のほうにある携帯のようなアイコンをクリック
  3. レスポンシブデザインモードに切り替わるので、
    「端末が選択されていません」をクリックし、「Apple iPhone 6s」をここでは選択します。そして、上のほうにあるカメラのアイコンを選択しスクリーンショットを撮ります。
    端末を指定しカメラのアイコンを選択してスクリーンショットを撮る
  4. これでスクリーンショットが自動的に保存されました。通常は、ダウンロードフォルダに次のようなファイル名で保存されています。
    ダウンロードフォルダに自動保存される
    ダウンロードフォルダに保存されていない場合は、オプション画面を開き、
    オプション画面を開く
    下のほうにある、ファイルとプログラム > ダウンロードの設定を確認してみてください。
    ダウンロ^どの設定を確認

範囲を指定してスクリーンショットを撮る方法

パソコンの画面を範囲指定して撮るには

  1. アドレスバーの・・・をクリックし、「スクリーンショットを撮る」を選択してください。
    アドレスバーの・・・をクリックし、「スクリーンショットを撮る」を選択
  2. 説明通り、スクリーンショットを撮りたい部分をドラッグするだけで撮れます。
    スクリーンショットを撮りたい部分をドラッグする
  3. またドラッグする前に、画面上のマウスを動かすとHTMLの要素ごと(たぶん?)に簡単に範囲指定できます。この機能はめずらしいんじゃないんでしょうか!見出しや画像だけを撮りたいときに、便利ですね。
    HTMLの要素ごとに範囲指定できる

まとめ

Firefoxでアドオンを使わずに、スクリーンショットを撮る方法をご紹介しました。

「スクリーンショットを撮る」方法はBETA版なので、いつかスマホの画面も撮れるようになるかもしれませんね。