Chromeのスクリーンショット方法！ページ全体を画面キャプチャするには？

Webサイトを閲覧しているとき、「ページ全体」をキャプチャしたい、「ある任意の領域（選択領域）」をキャプチャしたい、「画面全体（表示領域）」をキャプチャしたいと様々な場合があります。この記事では、主にGoogle Chromeを使用した「ページ全体」のスクリーンショット（キャプチャされた画像）を保存する方法を説明します。

Google Chromeの画面キャプチャ方法は大きく分けて2種類あります。
 

• Chromeのデベロッパーツールを使う方法
• Chromeの拡張機能を使う方法

デベロッパーツールとはGoogle Chromeに付属しているWeb作成やデバックに便利なツールのセットです。このツールの中に画面キャプチャする機能があります。Chromeのデベロッパーツールを使ったページ全体の画面キャプチャには、デベロッパーツールの「Capture full size screenshot」を使います。

ページ全体を画面キャプチャするために、まずはデベロッパーツールを起動します。このツールは、Chromeの①「設定」アイコンをクリックしてメニューを開き、②「その他のツール」、③「デベロッパーツール」の順番で選択すれば起動できます。

Chromeのデベロッパーツールは、次のショートカットでも起動できます。

• 「F12」キー（Windows）
• 「cntl」+「shift」+「i」（Windows）
• 「Command」+「Option」+「i」（Mac）

起動したデベロッパーツールから「Capture full size screenshot」を実行します。デベロッパーツールの④「デバイスモード」アイコン、⑤「設定」アイコンをクリックすると、⑥「Capture full size screenshot」がありますので、これをクリックすれば実行できます。

「Capture full size scrennshot」を実行すれば、スクリーンショットがローカルフォルダへ保存されます。

デベロッパーツールによる画面キャプチャは、Google Chromeのバージョン59から対応しています。該当するアイコンが見つからない場合はChromeを最新版にアップデートしてみてください。バージョンは、Chromeの「設定」アイコンからメニューを開いて「ヘルプ」、「Google Chromeについて」と選択すれば確認できます。
 

また、表示デバイスやキャプチャ範囲を切り替える場合、表示がずれて正確にキャプチャできない場合があります。この場合は、「F5」キーなどで一度ページを更新してください。1ページが長すぎる場合も注意が必要なようです。

デベロッパーツールを使用すればページ全体のスクリーンショットをキャプチャできますが、ショートカットを使っても数ステップあり、頻繁に使う場合には不便です。こんな時は拡張機能が便利です。Google Chromeにも画面キャプチャの拡張機能があります。

Google Chromeの拡張機能については、次の記事を参考として紹介します。拡張機能のインストール方法がわかりやすく説明されています。

スクリーンショットをキャプチャできるChromeの拡張機能を9つ紹介します。

Awesome Screenshotは画面キャプチャに加えてスクリーンショット編集もできる拡張機能です。Chromeツールバーの①「Awesme Screenshot」アイコンからメニューを開いて、②「Capture entire page」を選択するだけでスクリーンショットをキャプチャできます。「Ctrl」+「Shift」+「E」のショートカットでも画面キャプチャすることもできます。

スクリーンショットの編集ができるので、必要な場合は編集して、③「Done」をクリックします。