高解像度でスクリーンショットを撮る方法―Firefoxでのやり方

ブラウザで表示した画像を高解像度でスクリーンショットで保存し、印刷物に利用したい（論文の図に一部を使いたい場合など）ことがあります。今回はFirefoxのブラウザで、開発者ツール（Developer Tools)をつかってスクショする方法を簡単に紹介します。（Chormeでも同様にできます）
スクリーンキャプチャするには、ブラウザの機能拡張でスクショを撮るものがあって簡単そうですが、いくつかダウンロードして試したところなんとなくネットに情報を送信しているような気がして怖いのでやめにしました。今回紹介する方法は、ブラウザ自体の備え付けの方法ならその点は安心ですね。

やり方は以下のとおりです。ChatGPT の出力をもとに記載することにします。

Firefox Developer Tools を使用する

Developer Tools を開く
- Windows/Linux: Ctrl + Shift + I
- Mac: Cmd + Opt + I
レスポンシブデザインモードを有効化
- 開いた開発者ツールの右上にあるデバイスアイコン（スマホとタブレットの形）をクリックするか、Ctrl + Shift + M（Macでは Cmd + Opt + M）を押します。
解像度の設定
- ２．で有効化したレスポンシブデザインモードの画面上部に、解像度を入力するフィールドがあります。カメラのアイコンのある行の左のほうを見てください。一番左にキャプチャディバイスのエミュレーションモードのプルダウンがあります。スマホのGalaxyとかiphone, あるいはiPadなどが選べます。お好みのディバイスがこのリストにない場合は、プルダウンメニューの一番下にある「リストを編集」をクリックします。新しい画面が開いて、より多くの端末がリストアップされます。下のほうには、ノートPCとかテレビのディスプレイも選べるので、好きなものを選んでみてください。お好みのものがなければ右上にある、「カスタム端末を追加」をクリックして自分の好きな解像度（例: 1920×1080 や 3840×2160）を指定します。その際に解像度だけでなく、その右にある端末ピクセル比（DPR：Device Pixcel Ratio)を指定します。３とか４にするとキャプチャした画像を拡大してもなめらかで、印刷物に利用できるような高解像度の画像がキャプチャできます。はじめからあるディバイスモードでキャプチャして、拡大したらギザギザの画像になった場合などはDPRを設定しなおしてみてください。設定できないときはカスタム端末を追加でDPRを指定するのが簡単です。画像のサイズが大きくなるので、DPRを10とかにするのはお勧めしません。
スクリーンショットを撮る
- 画面右上の「カメラ」アイコンをクリックします。または、コンテキストメニュー（右クリック）から「スクリーンショットを撮る」を選びます。これでお好みの解像度と、DPRの画像が簡単にキャプチャできます。試してみてください。大変便利です。