【Windows】Webページ全体のスクリーンショットを撮る方法!Edge・Chrome標準機能とショートカット解説

8 min 20,177 views

Windowsで縦長Webページ全体を1枚の画像で保存するには、Microsoft Edgeの「Ctrl + Shift + S」やChromeのデベロッパーツールが追加ツールなしで手軽に使えます。

ページ全体スクリーンショットとは/ディスプレイに映っていない画面外の領域まで含め、Webページの最上部から最下部までを縦長の1枚画像(またはPDF)として保存する機能。「スクロールキャプチャ」「フルページキャプチャ」とも呼ばれます。

Windowsでページ全体を撮る主な手法

  1. Microsoft Edge の Webキャプチャ(Ctrl + Shift + S
  2. Google Chrome のデベロッパーツール(Ctrl + Shift + ICtrl + Shift + P
  3. ブラウザ拡張機能(FireShot / GoFullPage)

検証環境(2024年5月時点):Windows 11 Home 23H2(Snipping Tool v11.2312) / Microsoft Edge v125 / Google Chrome v125。PCスペック:Core i5-1135G7 / 16GB RAM。紹介するツール類との間に利害関係(PR・提供受領)はなく、第三者の立場から検証しています。

目次

Windowsでページ全体のスクリーンショット(スクロール撮影)を撮る最適手法

なぜ普通のPrintScreenではWebページ全体が撮れないのか?

PrtScnキーやWindows + Shift + Sは、通常は現在画面に表示されている範囲を取得するため、スクロール先までは含まれません。スクロールしないと見えない領域は画面上に描画されていないため、長文記事やランディングページ(LP)を撮影すると表示範囲のみで途切れます。

  • PrtScn:画面全体をクリップボードへ保持(ペイント等に貼り付けて利用)
  • Alt + PrtScn:選択中のアクティブウィンドウのみを取得
  • Windows + PrtScn:画面全体を撮影し「ピクチャ > スクリーンショット」へ自動保存
  • Windows + Shift + S:ドラッグして指定した範囲やウィンドウを選択撮影(Snipping Tool)

検証したSnipping Toolのバージョン(v11.2312)では、Webページ全体を自動結合するスクロールキャプチャ機能は確認できませんでした(画面録画機能のみ搭載)。Microsoft公式サポート情報でもWebページ全体のスクロール撮影にはブラウザ側の機能や専用ツールの利用が案内されています。そのため、ページ全体の撮影はブラウザ側の標準機能または拡張機能を活用する手順が現実的です。

【比較】標準機能と拡張機能の使い分け

手段 確認日・検証版 追加権限 主な制約 向いている場面
Snipping Tool / PrtScn 2024/05(v11.2312) 不要 画面表示範囲のみ。自動スクロール不可 見えている範囲のみの迅速な控え
Microsoft Edge(Webキャプチャ) 2024/05(v125) 不要 一部の複雑な動的サイトで描画抜けが生じる場合あり 追加ツールなしで手軽に1〜数枚撮りたい時
Google Chrome(デベロッパーツール) 2024/05(v125) 不要 操作に複数ステップ必要。組織ポリシーで無効化の可能性あり 拡張機能をインストールできない環境
Firefox(右クリックメニュー) 2024/05(v126) 不要 Firefoxブラウザ内のみ動作 Firefoxを普段からメイン利用している場合
拡張機能(FireShot / GoFullPage) 2024/05(各最新ストア版) 全サイトのデータアクセス権限など 会社PCでの導入制限、権限許可のリスク検討が必要 業務で毎日大量にキャプチャ・保存する作業

失敗例:「社内規定で拡張機能の追加が禁止されていた」と後から気づき、導入準備が無駄になるケースが見られます。拡張機能の追加リスクは避けやすい標準機能(Edge等)が手軽なものの、撮影・保存の可否はあらかじめ社内規程と管理者方針を確認してください。

【標準機能】Microsoft EdgeでWebページ全体をキャプチャする手順

ショートカット「Ctrl + Shift + S」を使った手順

  1. 撮影したいWebページをEdgeで表示する
  2. キーボードでCtrl + Shift + Sを押す(または画面右上の「…」メニューから「スクリーンショット」を選択)
  3. 画面上部に表示されたメニューから「ページ全体をキャプチャ」をクリックする
  4. 縦長のプレビュー画面が起動するため、スクロールして全体が撮れているか確認する

追加ツールなしで手早く撮るなら、EdgeのCtrl + Shift + Sが有力な選択肢です。範囲を狭めたい場合は「エリアをキャプチャ」を選ぶことで任意部分の切り出しも行えます。

注釈追加と保存方法

  • プレビュー画面上部のペン機能で手書きの丸囲みや線を記入可能
  • コピーをクリックするとクリップボードに保持され、Wordやメール本文にCtrl + Vで直接貼り付け可能
  • 保存をクリックすると画像ファイル(PNG)として出力される(保存先は通常「ダウンロード」フォルダですが、設定や組織ポリシーで異なります)

ログイン後の管理画面や個人情報・機密情報を含むページを撮影する際は、社内の情報管理ルールを必ず確認してください。撮影した画像を社外共有チャットへ誤送信するリスクを防ぐため、取り扱いには注意を払う必要があります。

【標準機能】Google Chromeで縦長ページ全体のフルスクリーンショットを撮る方法

デベロッパーツールを使った拡張機能なしの撮影

Chromeには専用ボタンが見当たらないものの、開発者ツール(デベロッパーツール)内部にフルサイズ撮影機能が組み込まれています。拡張機能のインストールが禁止されている社内PC等でも、ブラウザの標準機能で完結できる点が特徴です。ただし、組織のセキュリティポリシーによってデベロッパーツールの起動やファイルの書き出し自体が制限されている環境もあります。

コマンドパレットから「Capture full size screenshot」を実行する手順

  1. 対象ページを開いた状態でCtrl + Shift + I(またはF12)を押してデベロッパーツールを開く
  2. Ctrl + Shift + Pを押してコマンドパレットを表示させる
  3. 入力欄に「screenshot」と入力し、検索結果からCapture full size screenshotを選択してEnterキーを押す
  4. ページ全体のPNG画像が自動的にダウンロード処理される(通常はダウンロードフォルダへ保存)
  5. 撮影終了後、再度Ctrl + Shift + Iを押してデベロッパーツールを閉じる
  • モバイル表示の状態で全体撮影したい場合は、事前にCtrl + Shift + Mでデバイスモードに切り替えてから同じ手順を実行します
  • 特定要素のみを撮影したい場合は「Capture node screenshot」コマンドも利用できます

注意点:「screenshot」と入力しても目的の項目が表示されない場合は、コマンドパレットの先頭に「>」記号が入っているか確認してください。これが抜けているとファイル検索モードとなり、機能コマンドが検索対象になりません。

キャプチャ画像内のテキストを読み取って貼り付けたい場合や、クリップボードからの操作がうまくいかないときは、画面上の文字数カウントやテキスト抽出のトラブル解決法の案内も併せて確認しておくと作業がスムーズです。

【拡張機能】大量・頻繁にページ全体のスクショを撮るおすすめツール比較

撮影頻度が高い場合は、ブラウザ拡張機能の利用で作業手順を短縮できます。以下は筆者の検証環境における実測データと各ツールの特性比較です。

撮影パフォーマンス比較(検証データ)

※全幅約1,200px・全長約12,000pxの同一Webページを対象に各5回試行した実測結果(計測区間:操作開始からファイル出力完了まで/2024年5月検証)。

ツール・手法 確認日・バージョン 処理時間(5回中央値) 対応ブラウザ 主な制約・特徴
Microsoft Edge(Webキャプチャ) 2024/05 (v125) 約5秒(幅4〜6秒) Edge 標準機能。画像のみ出力可
Google Chrome(フルサイズ撮影) 2024/05 (v125) 約6秒(幅5〜7秒) Chrome 標準機能。手順がやや複雑
FireShot(無料版) 2024/05 (v0.99.98) 約5秒(幅4〜6秒) Chrome / Edge / Firefox ワンクリック操作。極端な長尺(30,000px超)で一部縮小傾向を確認
GoFullPage(無料版) 2024/05 (v7.12) 約7秒(幅6〜8秒) Chrome / Edge ワンクリック操作。検証ページにおいて追従ヘッダーの重なりが比較的少ない

FireShotの特徴

ツールバーのアイコンをクリックするだけで画面が自動スクロールされ、キャプチャが完了します。無料版でもPNG/JPG形式での保存に対応しており、手軽に利用できます(※高度な注釈編集やPDF保存などの一部機能は有料版で提供されている場合があります。導入時のストア表記をご確認ください)。

GoFullPageの特徴

アイコン1クリックで撮影が始まり、完了すると新規タブにプレビューが表示されます。無料版の範囲でPNGおよびPDFでの出力が可能です。検証したページにおいては、画面上部に固定配置された追従メニューの重複表示が比較的少ない挙動を示しました。

拡張機能はインストール時に「閲覧するすべてのウェブサイト上の全データの読み取り」などのアクセス権限を要求します。社内システムや個人情報を扱うブラウザプロファイルにはむやみに導入せず、必要に応じてキャプチャ専用のプロファイルを分離して利用する運用を検討してください。

スクリーンショットが「途中で切れる」「保存できない」時の原因と対処法

画像の読み込み遅延(Lazy Load)で下部が真っ白になる場合の解決策

Webサイトの中には、スクロールして画面内に移動した時点で初めて画像を読み込む遅延読み込み(Lazy Load)を採用しているものが多くあります。スクロールせずに撮影機能を呼び出すと、未読み込み領域が白く抜ける原因になります。

  1. キーボードのEndキーを押し、ページの最下部まで一気に移動して全画像を読み込ませる
  2. 画像が表示されたことを確認し、Homeキーで最上部に戻る
  3. その状態でEdgeのWebキャプチャやChromeのフルサイズ撮影を実行する

※SNSのタイムラインなどスクロールに応じて無限にコンテンツが読み込まれるページは、全長の概念がないため途中で読み込みをストップしてから撮影するか、複数回に分けて保存してください。

固定ヘッダー・追従メニューが重複して重なる不具合の対策

  • デベロッパーツールを開いて固定ヘッダーの要素を選択し、CSSの `position: fixed` を `position: static` へ一時的に変更して撮影する(ローカルの表示変更のため外部サイトには影響しません)
  • Ctrl + Pで印刷プレビューを開き、印刷用CSSを適用させた状態で「PDFに保存」する(追従メニューが非表示になる場合があります)
  • 検証ページで重複が少なかったGoFullPageなどの専用ツールへ切り替えて撮影を試みる

保存先フォルダが見つからない・保存できない時の確認事項

  • ブラウザからのダウンロード保存先は通常「ダウンロード」フォルダですが、設定や組織ポリシーによって異なる場合があります(Edge/Chromeの設定内「ダウンロード」項目で確認可能)
  • 「名前を付けて保存」のダイヤログが出ない・応答がない場合は、OneDrive等のクラウド同期状態、ディスク空容量、保存先のパス(長すぎるフォルダ名や特殊文字の有無)を確認してください
  • コピーした画像が貼り付けられない場合は、Windows + Vでクリップボード履歴を開き、データが正常に保持されているか確認します

縦長スクリーンショットの保存・PDF化・編集テクニック

Webページ全体をPDF変換して保存する方法

  1. 対象ページ上でCtrl + Pを押し、印刷設定画面を開く
  2. 送信先(プリンター)の項目で「PDFに保存」(または Microsoft Print to PDF)を選択する
  3. 詳細設定を開き、余白を「最小」や「なし」に設定し、倍率を調整する
  4. オプションの「背景のグラフィック」にチェックを入れ、背景色や画像を保持する
  5. プレビュー画面で改ページ位置を確認のうえ「保存」を実行する

トリミング・注釈入れ・容量調整の注意点

  • 画像形式の変換:写真主体のページではPNGからJPG(品質85%前後)へ変換することでファイル容量を減らせる場合があります。一方、文字や線画が主体となるページではPNGやWebPの方が境界線が崩れずクリアに保存できるため、用途に応じて比較・選択してください。
  • 個人情報の黒塗り処理:ペイント等の画像編集ソフトで黒塗りを行った際は、元画像を別管理した上で「単一の画像ファイル(PNG/JPG)」として書き出してください。その上で再度OCRやテキスト選択を試み、メタデータやPDFテキスト層に元の情報が残っていないか最終確認することが安全です。

他サイトの画面キャプチャを保存・共有する際は、著作権への配慮が必要です。著作権法第32条に基づく引用(公表済み著作物であること、引用の必然性、明瞭な区分け、主従関係の保持、出所の明示など)の要件を満たす必要があります。社内共有目的であっても複製範囲や権利者の規約によって取り扱いが異なるため、個別事案に応じた確認を行ってください。

Windowsのページ全体スクリーンショットに関するよくある質問(FAQ)

Windowsの標準機能だけでWebページ全体のスクリーンショットは撮れますか?

可能です。Microsoft EdgeであればCtrl + Shift + Sから「ページ全体をキャプチャ」を選択することで撮影できます。Google Chromeでもデベロッパーツール(Ctrl + Shift + I)内のコマンドパレットから「Capture full size screenshot」を実行すれば、追加ツールなしで保存可能です。

スクロールキャプチャすると途中で画像が切れたり真っ白になるのはなぜですか?

スクロール操作によって画面内に移動した時点で画像を読み込む遅延読み込み(Lazy Load)や、画面上部に固定される追従ヘッダーが影響しているケースが多く見られます。撮影前にあらかじめページ最下部までスクロールして画像を読み込ませておくと解決する場合があります。

PrintScreenキー(PrtScn)でページ全体のスクロール撮影はできますか?

できません。PrtScnキーやWindows + Shift + Sは、撮影した時点で画面上に表示されているピクセル領域のみを取得する仕様です。画面外の領域も含めて保存するには、EdgeやChromeの標準撮影機能や専用のブラウザ拡張機能が必要です。

ページ全体のスクリーンショットをPDF形式で保存するにはどうすればいいですか?

ブラウザ上でCtrl + Pを押し、印刷の送信先を「PDFに保存」に変更して書き出す手順が一般的です。レイアウト崩れを防ぎたい場合は、PDF出力に対応した拡張機能の活用も検討してください。

Firefoxでページ全体を撮影するにはどうすればいいですか?

Firefoxでは、ページ上の何もない場所で右クリックし「スクリーンショットを撮る」を選択後、「ページ全体を保存」をクリックすることで撮影できます。標準機能として実装されているため追加ツールは不要です。

使い分けの結論

用途や環境に応じて次の手順で選択するのがスムーズです。

  • 追加ツールなしで素早く保存したい → Edgeの Ctrl + Shift + S を利用
  • Chromeを使っており拡張機能を追加できない環境 → デベロッパーツール(Ctrl + Shift + ICtrl + Shift + P)から Capture full size screenshot を実行
  • 大量の撮影作業を行う・固定要素の重なりを減らしたい → 検証結果を踏まえてGoFullPageやFireShot等の拡張機能を導入
  • 撮影前の準備 → 事前に End キーでページの最下部までスクロールし、画像を読み込ませてから実行

作成したキャプチャ画像を資料作成や文章作成に活用する手順を効率化したい場合は、ChatGPTを活用したWord文章作成の効率化テクニックと併せてチェックしておくと作業効率が高まります。詳細な仕様や最新の操作手順については、Microsoft公式ヘルプ(Snipping ToolやEdgeサポートページ)の案内もあわせて参照してください。