はじめに
この記事では、縦に長いWebページのスクリーンショットをChrome拡張を使わずに綺麗に撮る方法についてまとめます。
また、例えばChatGPTの画面のような、画面の一部のみがスクロールするせいで中々うまくスクリーンショットを撮るのが難しいページを撮るコツについて紹介します。
方法
ChatGPTの画面を例にして説明していきます。
1. Chromeの検証ツールを起動する
右クリックで表示されるメニューから「検証」をクリックするか、ショートカットキーで起動します。
- ショートカットキー
- Mac: command + option + I
- Windows: ctrl + shift + I
2. 画面サイズを調整する
検証ツールでは、表示される画面サイズを自由に変更することができます。
画面上の「Dimensions」の項目を「Responsive」に設定し、スクリーンショットを撮りたい範囲全体が映るように高さを調整しましょう。
※通常のWebサイトであればこの作業は不要です。ChatGPTのような画面の一部のみがスクロールするせいで中々うまくスクリーンショットを撮るのが難しいページの場合に、この作業を行ってください。
3. Capture full size screenshotを呼び出す
ショートカットキーで機能検索を呼び出します。下記のショートカットキーで検索ウィンドウを出し、「capture」と入力します。出てきた「Capture full size screenshot」を選択することで、スクリーンショットを撮影することができます。
- ショートカットキー
- Mac: command + shift + P
- Windows: ctrl + shift + P
おわりに
以上の作業により、Chrome拡張なしでスクリーンショットを撮影することができました！
最近では、ヘッダーやサイドバーが固定されていて、一部のみがスクロールするようなWebページが多く存在します。
そのため、Chrome拡張を使ってもうまく全体を撮るのに苦戦していました。
この方法でだいたいのページを撮影できそうです。
ぜひ皆さんも試してみてください！
補足: 綺麗に撮れたスクリーンショット
