こんばんは、モルモル（@morumorublog）です。
皆さんは、Webブラウザは何を使っていますか？
私はいつもGoogle Chromeを使っています。
理由は、直感的に操作できること、起動が速い気がすること、スマホとの互換性があることなど、挙げるとたくさんあります。
そのなかでも、「拡張機能」がとても便利です。
拡張機能とは、Google Chromeに＋αで多様なツールを追加できる機能です。
機能の種類・数は実に様々であり、無料で利用できるものも多くあります。
私も普段、いくつか拡張機能を使ってますが、ブログ記事作成はもちろん、Chromeを使ううえで特に便利だと感じるものを、いくつか紹介したいと思います。
今回は、スクリーンショットの拡張機能「Awesome Screenshot」について。
【Google Chromeのインストールはこちらから】
【Google Chrome拡張機能のインストールはこちらから】
Awesome Screenshotとは？
Awesome Scrennshotは、スクリーンショットの拡張機能です。
スクリーンショットは、パソコンであればデフォルトで搭載されている機能です。
Windowsであれば、【PrtScr】キーで、Macであれば、【shift】【command】【3】キーでスクリーンショットを撮れます。
しかし、この方法で撮れるスクリーンショットは、現在画面上に写っている画面全体に固定されます。
つまり、画面上の特定の部分だけを撮ったり、画面外の情報（スクロールしないとみれないほど長いWebページなど）を撮ったりすることまではできません。
なので、一度スクリーンショットした画像を、欲しい部分だけトリミングしたり、画像を組み合わせたりする手間が生じます。
これが結構、面倒なのです。
※※一部追記（20200405）※※
以下2点を追記させていただきます。ご指摘いただいた方、有難うございました。
① Chromeのデフォルト機能で、ページ全体をスクショできる機能もあるようでした。以下のサイトがわかりやすかったのでリンクさせていただきます。
ChromeでWEBページ全体をフルスクリーンショット！見ているページの全画面キャプチャー画像をダウンロードする方法
② Windows及びMacにおいて、指定範囲をキャプチャできる機能があるようでした。
それぞれの方法について、以下サイトをリンクさせていただきます。
これを解決してくれるのが、Awesome Scrennshotです。
Awesome Scrennshotを使えば、通常のスクリーンショットはもちろん、画面上の特定箇所を指定して撮ることや、Webページ全体を撮ることが可能です。
つまり、面倒なトリミングの作業が完全にカットされ、効率化が図れるのです。
では、実際にどのように使用するのか、簡単に紹介します。
Awesome Screenshotの使い方
Awesome Screenshotには様々な機能が搭載されていますが、私が普段よく使う、3つの機能について紹介します。
ちなみに、上述でリンクしたサイトからAwesome Screenshotをインストールすると、以下のようにツールバー横にアイコンが表示されます。
どの拡張機能も、基本的にこのアイコンをクリックすることで、機能を利用することができます。
まずはこの状態にすることが最初のステップです。
それでは、続いて具体的な機能を紹介します。
画面上の特定の部位だけスクリーンショット
まず、ツールバー横のアイコンをクリックします。
以下の画面が出るので、【Capture Selected Area】をクリックします。
すると、以下のようにWeb画面が少し暗転し、スクリーンショットを撮りたい領域を指定できる状態になります。
（※今回は試しに、当ブログのトップページを使って説明します。）
次に、スクリーンショットを撮りたい領域をドラッグして指定します。
指定領域が通常の色で表示されるので、【Capture】をクリックします。
すると、新規タブで以下のような画面が表示されるので、右上の【Done】をクリックします。
この編集画面では、トリミングや文字の追記など様々な処理もできます。
編集を終えた後、【Done】をクリックすることも可能です。
【Done】をクリックすると、以下のような画面が表示されるので、赤枠のマークをクリックすれば、画像保存（JPEG or PNG）することができます。
以上で、Web画面上の特定領域だけスクリーンショットすることができます。
トリミング作業が直感的にできてしまうので、効率がよく非常に便利なので、一番おすすめの機能です。
Webページ全体をスクリーンショット
Webを閲覧していると、ページ全体を画像として保存して管理したい場面もあるかと思います。
このときデフォルトのスクリーンショット機能では、画面に表示されている部分しか撮れないため、非常に不便です。
Awesome Screenshotでは、スクロールをしないと見れない範囲であっても、Webページ全体をスクリーンショットできる機能があります。
まず、ツールバー横のアイコンから、【Capture Entire Page】をクリックします。
現在表示されているWebページ全体が読み取られ、新規タブに以下の画面が表示されるので、右上の【Done】をクリックします。
すると、保存条件の選択画面に入るので、好きな保存媒体を選択します。
画像保存でも良いですが、気になるWebページを資料のように保存して管理したい場合は、赤枠で示したボタンでPDF保存することをおすすめします。
自分の興味のあるWebページは、すかさずPDF保存しておいて、あとで眺めてみたり、興味のある分野をソーティングして管理しておくと、勉強やブログのネタ管理など、様々なことに応用できると思います。
ツールバー以外（Webページのみ）をスクリーンショット
最後は、私は使用する機会は少ない機能ですが、便利なものなので紹介します。
デフォルトのスクリーンショットでは、デスクトップやWebブラウザのツールバーも含めた、文字通り「画面全体」を撮ってしまいます。
しかし、大抵の場合は、欲しい画像はWebブラウザに表示されているページの情報なので、ツールバーは邪魔であり、あとでトリミングする必要があります。
Awesome Screenshotでは、ツールバーを除いた、純粋にWebブラウザに表示されているページ部分だけを撮る機能があります。
ツールバー横のアイコンから、【Capture Visible Part of Page】をクリックします。
すると、赤枠で示したツールバーなどの余計な部分を除いた領域のみをスクリーンショットすることができます。
以降の操作は、上述の他機能と一緒なので、割愛します。
以上、スクリーンショットの便利なChrome拡張機能「Awesome Screenshot」の紹介でした。
ブログ記事作成においては、画像を引用したり、気になるWebページを保存しておきたいシチュエーションは少なからずあるかと思います。
そのうえでは、Awesome Screenshotは直感的に好きな領域をスクリーンショットできる非常に便利な拡張機能だと感じます。
今後もChrome拡張機能の紹介は継続しますので、ぜひご覧いただけると幸いです。
それでは！
～こんな記事もあります～
