はじめに
「ホームページ全体をスクショしたいのに、途中で切れてしまう…」
「縦に長いページを1枚で保存する方法が分からない…」
そんなふうに困ったことはありませんか。
参考にしたいデザインを残したいときや、仕事でページ全体を共有したいとき、何枚も分けて撮るのは意外と手間がかかりますよね。
実は、ホームページ全体のスクショは、ブラウザの機能やスマホの設定だけで簡単に保存できます。専用ツールがなくても、数クリックで1枚にまとめられることも少なくありません。
この記事では、パソコン・スマホそれぞれでホームページ全体をきれいにスクショする方法を、順を追ってやさしくご紹介していきます。
自分に合ったやり方が見つかるよう、できるだけ分かりやすく整理していきますので、ぜひ気軽に読み進めてみてください。
今すぐできるホームページ全体をスクショする方法｜Chrome
「とにかく今すぐフルページのスクリーンショットを撮りたい」という方に向けて、最短でできる方法を紹介します。
特別な拡張機能は不要で、Chromeに標準搭載されている機能だけで完結します。
ここでは、その中でも最も手軽で確実な「開発者ツール」を使った撮影方法を解説していきます。
開発者ツールでフルページスクショを撮る方法
Chromeでフルページのスクリーンショットを撮るには
対象ページを開いた状態でキーボードの「F12」を押して開発者ツールを表示し、画面上部右側の「⋮」をクリックしてメニューを開き、「Run command」を選択するか「Ctrl＋Shift＋P」を押してコマンド入力欄を表示します。
入力欄に半角で「screenshot」と入力すると候補が複数表示されるため、その中から「Capture full size screenshot」をクリックします。
この操作を行うと、現在の表示範囲ではなくページ最上部から最下部までを含んだフルページのスクリーンショットが自動的に生成され、処理完了と同時にPNG形式の画像ファイルがダウンロードフォルダに保存されます。
スクロール操作は不要で、ページの高さが長い場合でも一度の操作で全体が取得されるため、分割撮影や結合の作業は発生しません。
もっと簡単にホームページ全体をスクショする方法
「開発者ツールは少し難しそう…」という場合は、Chromeの拡張機能を使う方法がいちばん簡単です。
なかでも定番なのがGoFullPage – Full Page Screen Capture と FireShot です。
Chromeの拡張機能を使えば、複雑な操作なしでワンクリックでページ全体をキャプチャすることが可能です。
ここでは、誰でも直感的に使える手軽な方法を紹介します。
GoFullPageならワンクリックでページ全体を保存できる
もっとも手軽なのは、GoFullPage – Full Page Screen Capture を使う方法です。
Chromeに追加したあと、スクショしたいページを開き、画面右上の拡張機能アイコンからGoFullPageを1回クリックするだけで、自動でページの一番上から一番下までスクロールしながら撮影してくれます。
数秒後にプレビュー画面が表示されるので、「Download」ボタンを押せば、そのままPNG形式で保存できます。
範囲指定やスクロール操作は必要なく、クリックだけでホームページ全体を1枚の画像として残せます。
FireShotなら保存後に書き込みもできる
「ページ全体を保存したあとに、矢印や文字を書き込みたい」という場合は、FireShot が便利です。
Chromeに追加した状態でページを開き、FireShotのアイコンをクリックして「Capture entire page」を選ぶと、ページ全体が自動でキャプチャされます。
保存前に文字・矢印・枠線を追加できるため、「ここを見てほしい」と共有したい場面や、仕事用の資料として残したい場合にも使いやすい方法です。
うまくホームページ全体をスクショできないときの対処
手順どおりに操作しても、うまくフルページのスクリーンショットが撮れないことがあります。
特に長いページやログインが必要なページでは、思わぬところで失敗しやすいのがポイントです。
ここでは、よくある原因とつまずきやすいケースを整理して解説します。
長いページ・ログインページで失敗する原因
長いページで全体キャプチャが失敗する原因は、拡張機能がページを上から下へ自動スクロールしながら画面を連結する仕組みのため、読み込みが遅い箇所が1か所でもあると、その時点で未表示の領域が空白のまま結合されることにあります。
特に画像や広告が遅延読み込みされるページでは、スクロール速度に対して描画が間に合わず、途中で切れたり重複したりする状態が発生します。
ログインページで失敗する原因は、セキュリティ制御により画面の一部が外部フレームとして分離されているため、拡張機能がその領域にアクセスできず、黒塗りや欠落として出力されることにあります。
また、ログイン状態の維持にCookieが必要なページでは、拡張機能の処理中に再認証が発生すると、その時点で表示内容が切り替わり、途中から別の画面が混在した画像になります。
まとめ
ホームページ全体を1枚で保存する「フルページキャプチャ」は、難しそうに見えても、実際はとても簡単です。パソコンなら、Chromeに標準で入っている機能を使うだけで、追加のツールなしでページの上から下までまとめて撮影できます。
「もっと手軽に済ませたい」という場合は、Chromeの拡張機能を使う方法も便利です。アイコンを1回クリックするだけで、自動でスクロールしながらページ全体を撮影してくれるため、初めてでも迷わず使えます。
ただし、縦に長いページや、画像・広告の読み込みが遅いページでは、一部が空白になったり、ずれて保存されることがあります。また、ログイン後の画面など、一部のページでは正常に撮影できない場合もあります。そのときは、少し待ってから撮り直したり、別の方法を試してみてください。
一度やり方を覚えておけば、資料作成や情報共有、デザインの参考保存などがかなり楽になります。まずは、自分にとって使いやすそうな方法から試してみてください。
