【使い方簡単】縦に長いWEBブラウザの画面を自動的にスクロールしてスクショする方法

パソコンでスクリーンショット便利ツール

縦に長くてスクロールが必要な画面のスクリーンショット(画面キャプチャ)を、簡単に画像化する方法をご紹介します。

Google Choromeの拡張機能「Awesome Screenshot」を使えば、別途ソフトをインストールする必要なく、クリックひとつで自動的にWEBページ全体のスクショを撮ってくれるので便利です。
一部の機能や幾つかコラボレート機能を使おうと思ったらお金が必要なようですが、スクショを撮るだけならもちろん無料で使えます

Awesome Screenshotの導入方法

Awesome Screenshotとは

Awesome ScreenshotはChromeの拡張機能として提供されているツールです。
説明は英語で書かれていますが、ツール自体は日本語にも対応するようになってます。
(シンプルなツールなので使い方に迷うことは無いと思いますが)

awesome screenshot

Choromeの拡張機能(プラグイン)として導入する方法

Googleの拡張機能の画面に行きます。
Google ウェブストア

左側の「拡張機能を検索」に、”awesome screenshot”と入力して検索します。
検索結果の一番上に出てくるはずです。

chrome extension

これをクリックすると、Awesome Screenshotの説明画面が表示されます。
右上の「Chromeに追加」をクリックすると、ポップアップで導入してよいか聞かれるので許可すれば導入は完了です。

FirefoxやMicrosoft Edgeにもアドオンで追加可能!

私はブラウザとしては動作検証以外ではGoogle Chromeしか使わないですが、調べてみたらFireFoxやMicrosoft Edgeにもアドオンとして追加可能でした。

普段使いのブラウザが違う方や、会社の制限などでブラウザがEdgeしか使えない方なども利用できますね。

Awesome Screenshotの使い方

「フルページ」を選択して画面全体をキャプチャ

ここからは使い方を説明します。
と言っても、直感的に操作できて超簡単です!

まず、Chromeの拡張機能にAwesome Screenshotのアイコンが追加されているはずなのでクリックします。

アイコンが無い場合は、拡張機能のアイコンをクリックすれば出てくるはずです。便利なので、よく使う場合はピン留めしておきましょう。

スクショの撮り方

「キャプチャ」→「フルスクリーン」を選択すれば、現在表示しているブラウザの画面を、自動的にスクロールしてキャプチャしてくれます。

「フルスクリーン」以外に、「表示部分」と「選択範囲」も選べます。
これを選択すれば、それぞれ現在表示されている部分のみ、もしくは自分でキャプチャ範囲を選択してのスクリーンショットを撮ることも可能です。

キャプチャ後、以下のような編集画面に移ります。
ここでは範囲を選択(トリミング)したり、ちょっとしたテキストや図形の追加も出来ますが、特に必要なければ右上の「Done」を押します。

キャプチャ編集

あとはブラウザ上で右クリックして「名前をつけて画像を保存」するだけです。
ちなみに、右側のメニューを使えば、イメージとしてのダウンロードの他、PDFとしてもダウンロードしたり、そのままプリントアウトも出来たりします。

スクショの結果

以下がスクロールが必要な画面のスクショの結果です。
ここでは、サンプルとして見やすいようにスクロールの量が少なめのページを使いましたが、何回もマウス操作が必要なものすごく縦長のページでも問題なく処理してくれます。

スクショの結果

必要に応じて範囲選択したり簡単な編集も出来る

キャプチャ後の編集画面で少し触れましたが、ちょっとした編集程度であれば、他のソフトを使わなくてもAwesome Screenshot上でついでに出来ちゃいます。

一部の機能(吹き出し、丸数字、顔文字アイコンなど)を使おうと思ったら有料になってしまいますが、
リサイズ、矢印や丸/四角の図形、テキスト、ぼかしは無料で使えます

上部のメニューからやりたい事を選択してください。
下の画像に追加されている図形などは、すべてAwesome Screenshot上で追加したものになります。

編集画面

まとめ

どうでしたか。
縦スクロールが必要な画面を画像として保存する簡単な方法を紹介しました。

ブログの運営などでも使うとは思いますが、私はIT系の仕事で画面設計書やユーザマニュアルを作る時に必要になる事が多いです。
WEBの画面限定ですが、他にソフトなど立ち上げることなく簡単に画像として保存できるプラグインなので、是非使ってみてください。

コメント

  1. ハナ より:

    Google検索しました。保存したものを2次利用したいので、コピーで保存したいのですが、コピ
    ーしたものはPCのどこに保存されるのですか

    • いるかくんいるかくん より:

      こんにちは。
      スクリーンショットをブラウザ上でCtrl+Cもしくは右クリックのメニューからコピーしたということでしょうか。
      コピーしたものは一時的な記憶領域に保存されており、パソコンのフォルダ上に保存はされていません。
      コピーした画像を何かのアプリケーションで利用する場合は、ショートカットのCtrl+Vもしくは右クリックして「貼り付け」を選べば良いです。

      PCに保存したい場合は、コピーではなく、右クリックメニューから、「名前を付けて画像を保存」を選択すれば、保存場所を自分で指定することが出来ます。

タイトルとURLをコピーしました