おはようございます、なべやすです。
ブログ記事を作成していると、WEBページ全体（縦長）のスクリーンショット（フルスクリーンショット）を使いたくなるときがあります。
Windows標準機能のスクリーンショットでは、PCモニターに表示されている範囲までしか保存できませんので、画面スクロールが必要な縦長のスクリーンショットを撮る（保存）ことができません。
何となくできそうだと思いながらも、やり方がわからず使わない機能の一つではないでしょうか？
当記事では、Chrome拡張機能およびWEBブラウザのChromeとEdgeを使い、WEBページ全体のスクリーンショット（フルスクリーンショット）を撮って保存する方法をご紹介いたします。
※当記事では、Windows10搭載PCを使い説明をしております。
- WEBページ全体のスクリーンショットを撮る方法
- 各ツールのメリット・デメリット
- おすすめのスクリーンショットツール
- Chrome拡張機能を使ってWEBページ全体のスクリーンショットを保存する方法
- Chromeを使ってWEBページ全体のスクリーンショットを保存する方法
- Edgeを使ってWEBページ全体のスクリーンショットを保存する方法
- それぞれのメリット・デメリット
- 最後に
Chrome拡張機能を使ってWEBページ全体のスクリーンショットを保存する方法
WEBページ全体のスクリーンショット（フルスクリーンショット）を保存する方法の中では、簡単で無難な方法といえるChrome拡張機能。
WEBブラウザがGoogleのChromeに限定されてしまいますが、簡単にWEBページ全体のスクリーンショットを保存することができるのでおすすめです。
スクリーンショットを保存する流れ
- STEP1：Chrome拡張機能追加（インストール）
- STEP2：WEBページ全体をスクリーンショット
- STEP3：画像ファイルを保存
- STEP4：スクリーンショット完了
ChromeウェブストアからChrome拡張機能（GoFullPage）を追加（インストール）します。
GoFullPage - Full Page Screen Capture - Chrome ウェブストア
スクリーンショットが完了すると以下の画面が表示されますので、右上（赤マル部分）をクリックすると保存することができます。
画像ファイルとしてだけでなくPDFファイルにて保存することも可能です。
Chromeを使ってWEBページ全体のスクリーンショットを保存する方法
GoFullPageのようなChrome拡張機能を使わなくても、ブラウザのデベロッパーツールを使ってWEBページ全体のスクリーンショットを撮ることができます。
以下は、Windows10搭載のPCでGoogleのWEBブラウザChromeを使い、WEBページ全体のスクリーンショットを撮る方法です。
スクリーンショットを保存する流れ
- STEP1：Chromeのデベロッパーツールを開く
- STEP2：WEBページ全体をスクリーンショット
- STEP4：スクリーンショット完了
Chromeでスクリーンショットを撮りたいサイトを開き、ブラウザの右上（赤マル部分）にある①【Chromeの設定】をクリックし、②【その他ツール】から③【デベロッパツール】へと移動します。
①【Chromeの設定】→②【その他ツール】→③【デベロッパツール】
❶次に下の画像にある赤マル部分をクリックします。
❷次に下の画像にある①をクリックし、開いたウィンドウの中から②の【Capture full size screenshot】をクリックすれば、WEBページ全体のスクリーンショットが撮れます。（撮った画像はそのまま自動的に保存されます。）
❸ダウンロードされた画像ファイルを開くと、以下のようにフルスクリーンショットが保存されております。
Windows10搭載PCであれば、以下の操作でもスクリーンショットを撮ることが可能です。
①【Ctrl+Shift+I】→②【Ctrl+Shift+P】 →③【「fullと入力」→Enter】
Edgeを使ってWEBページ全体のスクリーンショットを保存する方法
マイクロソフトのWEBブラウザEdgeでも、Chromeと同じように拡張機能などを使わず、WEBページ全体のスクリーンショットを撮ることができます。
以下は、WindowsPCでマイクロソフトのWEBブラウザEdgeを使い、WEBページ全体のスクリーンショットを撮る方法です。
スクリーンショットを保存する流れ
- STEP1：EdgeのWEBキャプチャを開く
- STEP2：WEBページ全体をスクリーンショット
- STEP4：スクリーンショット完了
❶Edgeでスクリーンショットを撮りたいサイトを開き、ブラウザの右上（赤マル部分）にある【···】をクリックします。
❷次に開いた設定画面の中から【WEBキャプチャ】をクリックします。
①【···】→②【WEBキャプチャ】
❶【WEBキャプチャ】の画面が表示されたら【ページ全体をキャプチャ】をクリックします。
❷WEBキャプチャの画面にある赤マル部分の【保存】をクリックすれば、WEBページ全体のスクリーンショットが保存できます。
❹ダウンロードされた画像ファイルを開くと、以下のようにフルスクリーンショットが保存されております。
Windows搭載PCであれば以下の操作でもスクリーンショットを撮ることが可能です。
①【Ctrl+Shift+S】→②【ページ全体をキャプチャ】 →③【保存】
それぞれのメリット・デメリット
当記事で紹介しているWEBページ全体のスクリーンショットを撮る方法は、ブラウザの拡張機能を使う方法と使わない方法の2種類になりますが、それぞれメリット・デメリットがあります。
| メリット | デメリット | |
|---|---|---|
| 拡張機能 | 簡単に撮れる、保存形式を選べる、簡単な加工・編集ができる | インストールが必要、英語表記 |
| Chrome | インストール不要 | やや難しい、保存先を選べない、保存形式を選べない |
| Edge | 簡単に撮れる、インストール不要 | 保存先を選べない、保存形式を選べない |
Chrome拡張機能を使う方法
WEBページ全体のスクリーンショットを簡単に撮って保存するには、Chrome拡張機能を使うことが手っ取り早いです。
保存形式も画像（PNGまたはJPG）だけでなくPDFを選択できたりする点は、拡張機能ならではと言えます。
他にも撮ったスクリーンショットの加工や編集ができたりと、追加（インストール）したメリットを感じる機能を使うことができます。
拡張機能を追加（インストール）しなければならないことや英語表記な点がデメリットとも言えますが、その分、簡単にスクリーンショットが撮れて保存できるメリットは大きいです。
Chromeで撮る方法
拡張機能と比べて、スクリーンショットを撮るのが少し難しい（めんどう）です。
保存先も選択できず、スクリーンショットが終わると自動的に保存されてしまいます。
ただし、慣れてしまえば問題ない程度のものだと思います。
ブラウザの標準機能を使うので、端末を選ばずスクリーンショットを撮ることができる点は便利です。
他にも余計な機能を追加（インストール）しなくて良い点は大きなメリットと言えます。
Edgeで撮る方法
Chromeと同じくブラウザの標準機能を使うので、余計な機能を追加（インストール）しなくて良い点は大きなメリットです。
それだけでなく、同じブラウザであるChromeと比べても使い方が簡単で、手軽に使える点がとてもいいです。
ブラウザの標準機能でありながら、Chrome拡張機能にも引けを取らない使いやすさと言えます。
デメリットを上げるとすれば、Chromeと同じくスクリーンショットの保存先が選べない（自動保存）ことやファイル形式が画像のみとなっていて選べない点です。
ただし、そのことを感じさせないほど、使い勝手の良さがあります。
最後に
ブログに限らずビジネスにも応用が効きそうなWEBページ全体のスクリーンショットは、その方法を知っておいてムダになることはありません。
当記事でご紹介させていただいた方法の中では、Edgeの標準機能を使ってスクリーンショットを撮る方法が、インストール不要で使い方も簡単なのでおすすめです。
Firefox（ファイアーフォックス）など、他のブラウザでも同じような機能が使えるようですので、お使いのブラウザを一度確認してみてはいかがでしょうか。
最後まで読んでいただき、ありがとうございました。
