縦長のWebページ全体をキャプチャして画像として保存する4つの方法

Web ページ全体をキャプチャする主な方法は以下の 4 つです。

• キャプチャ専用アプリを使う
• オンラインサービスを使う
• ブラウザ標準機能（デベロッパーツール）を使う
• ブラウザ拡張機能（アドオン）を使う

いずれも操作は簡単なので、ご自分の環境に合わせて最適な方法を選択してみてください。

なかにはキャプチャ後に簡単な画像編集加工までできるツールもあるので、資料作成やデザインサンプルの紹介などで重宝すると思います。

キャプチャ専用アプリ

PriScVista

「PriScVista」はマウスカーソルも同時にキャプチャできる、Windows 専用高機能ツールです。Web ページ全体のキャプチャは、Chrome デベロッパーツールの自動操作によって行われます。

キャプチャした画像の編集を選択すると、デフォルトで Windows10 アプリ「切り取り ＆ スケッチ」が開きます（設定で変更可）。

できるだけ不要なソフト・アドオンを追加せず、Windows 機能だけで処理したい場合は便利です。

Screenpresso

「Screenpresso」は Windows 専用の高機能キャプチャツールで、静止画ではなく動画の撮影も可能です。Web ページ全体のキャプチャは、Chrome 拡張機能を介して行われます。

Naifix で掲載しているキャプチャ画像の大半は、この Screenpresso を使って撮影・加工しています。

ただ、Screenpresso の拡張機能でキャプチャすると上部固定メニューなどが正常に撮影できないため、全体のキャプチャは後述する別の Chrome 拡張機能（Fireshot）を使用しています。

オンラインサービス

webtopdf

オンラインツール「webtopdf」は、URL を指定するだけで Web ページ全体をキャプチャしてくれます。

キャプチャは 1 枚の画像ではなく、オプションで指定したページサイズに従って分割されます。ページ番号やウォーターマークも入れられるので、印刷や PDF 化に向いていますね。

印刷向けのレイアウトにするせいか、処理に数分かかります。

Capture Full Page

「Capture Full Page」は URL 指定だけで Web ページ全体を 1 枚の画像に変換してくれます。画像は横 1280 px で固定され、JPEG 形式のみです。

また、Lazy Load を採用している Web ページを指定すると、スクロールしなければ見えない部分の画像がキャプチャできません。

PC にアプリをインストールできない・ブラウザ拡張機能も入れられない、という環境のとき臨時に使うのがよいと思います。

ブラウザ標準機能（開発ツール）

代表的なブラウザには、Web ページ全体をキャプチャする機能が標準装備されています。

ただし、Lazy Load を採用している Web ページでは、スクロールしなければ見えない部分の画像がキャプチャできません。いったんページ下部までスクロールした状態でキャプチャすれば大丈夫です。

Microsoft Edge

Chromium 版 Microsoft Edge のキャプチャ機能は、今回ご紹介するすべての方法のうち最も簡単なものです。

とくに設定等は必要なく、デフォルトで Web ページ全体をキャプチャできます。

キャプチャした画像は、Edge 設定内の「ダウンロード」で指定した場所に保存されます。

ふだんから Edge を使っているなら、キャプチャツールを準備する必要はないですね。

Firefox

Firefox も、一度設定してしまえば Web ページ全体をすぐにキャプチャできます。

キャプチャ画像は、ブラウザオプションの「ファイルとプログラム」で指定した場所に保存されています。

アイコンをクリックすれば一瞬でキャプチャしてくれるのでストレスはありませんが、デベロッパーツールに不慣れだと使いづらいかもしれません。

Google Chrome

Google Chrome はキャプチャに一手間かかりますが、任意のサイズ（横幅）で撮影したいときは便利です。

同一の Web ページを異なるサイズで数パターンキャプチャしたいときはよいですが、複数の Web ページを次々にキャプチャしていく用途には向きません。

ブラウザ拡張機能（アドオン）

アプリやオンラインツールを使わず、ブラウザのみでキャプチャを撮りたいときは拡張機能を入れたほうが便利です。

特徴的な拡張機能を 3 つご紹介します。

Fireshot｜シンプルなタイプ

Web ページ全体をキャプチャするだけの目的なら、「Fireshot」がシンプルで使いやすいと思います。

キャプチャしたいページを開き、アイコンをクリックして「ページ全体をキャプチャ」を選択すれば OK です。

画像（PNG / JPEG）のほか、PDF でも保存できます。

Gyazo｜共有に特化したタイプ

「Gyazo」は Web ページ全体のキャプチャのほか、「部品」で特定の要素をキャプチャしたいときに便利な拡張機能です。

キャプチャした画像は無期限で Gyazo に保存しておけます（無料アカウント作成で直近 10 枚まで保存可）。

キャプチャ画像を共有することに特化しているので、チームでの使用やクライアントへの連絡に使うならイチオシです。

Awesome Screenshot｜編集に特化したタイプ

「Awesome Screenshot」は、キャプチャした画像をそのまま加工編集できるブラウザ拡張機能です。

デフォルトの保存場所「クラウド」を使うなら、アカウント作成が必要です。保存場所を「ローカル」に変更するとアカウント不要で利用できます。

キャプチャ後、すぐに編集画面が開かれるので、必要に応じて枠線や矢印を追加しましょう。

編集完了後、右上の「Done」をクリックすると保存方法・保存場所を選択できます。PC にダウンロードするだけではなく、クラウドストレージへの直接保存も可能です。

わざわざ Photoshop などを使うまでもない簡単な加工編集ならこれで十分ですね。

まとめ

以上、Web ページ全体をキャプチャする方法でした。

最も簡単なのは、Microsoft Edge 標準搭載のキャプチャ機能です。その他、すぐに共有するのが目的なのか、簡単な編集が必要なのか、などで最適な選択肢は異なります。

Web ページの特定の部分のみ切り抜いて保存・印刷したい場合は、「PrintWhatYouLike」というツールがおすすめです。使い方詳細は以下の記事でご紹介しています。

PrintWhatYouLike｜Webサイトをきれいに印刷・PDF化できる無料ツール – Naifix

ホームページやブログをきれいに印刷して参考資料にしたり、PDFとして保存しておきたいときはPrintWhatYouLikeを使ってみましょう。マウスでクリックしていくだけで必要な…

naifix.com

それでは、また。