Web担当者の皆様は、ホームページの修正依頼時などや作業をする上で、ページのキャプチャをとることが多いのではないでしょうか。

OSに標準装備されているキャプチャ機能を利用するのも良いですが、キャプチャ用のフリーソフトや拡張機能などを使えばより効率的にキャプチャ作業を行うことができます。

今回は、無料のキャプチャツールであるAwesome Screenshotの利用方法について解説します。

目次

  1. OSに標準装備のキャプチャ機能
    1. Mac OSでのキャプチャ
    2. Windowsでのキャプチャ
  2. Awesome Screenshotのインストール方法
  3. Awesome Screenshotの使用方法
  4. まとめ

OSに標準装備のキャプチャ機能

Mac OSでのキャプチャ

Mac OSでは以下のキーを押すことでキャプチャの撮影が可能です。

  • [command] + [Shift] + [3]：画面全体
  • [command] + [Shift] + [4]：ドラッグで選択した部分
  • [command] + [Shift] + [4] + [space]：選択範囲を表示

また、Mac Os Mojaveでは、

  • [command] + [Shift] + [5]で撮影方法を選択できるボタンが表示されます。

Windowsでのキャプチャ

Windowsでは以下のキーを押すことでキャプチャの撮影が可能です。

  • [PrintScreen]：画面全体をキャプチャ
  • [Alt] + [PrintScreen]：最前面のウィンドウのみをキャプチャ

注意点

Mac OSとWindowsに標準装備してあるキャプチャ機能を開設しましたが、これらはどちらも画面に表示されている部分しかキャプチャできません。
そのため、Webサイト全体のキャプチャなど、画面をスクロールする方法には対応していません。

Awesome Screenshotではこのようなスクロールが必要なキャプチャも可能です。

Awesome Screenshotのインストール方法

Awesome ScreenshotはFirefoxとGoogleChromeで利用可能な拡張機能です。

***

***

***
インストールが完了したら、画面右上、URL横に「Awesome Screenshot」のアイコン（カメラレンズのマーク）が表示されます。

Awesome Screenshotの使用方法

画像をキャプチャする

1.Awesome　Screenshotのアイコンをクリックすると、キャプチャ形式の一覧が表示されます。
***
キャプチャ形式は以下の3つから選択可能です。

・Capture visible part of page（今見えている範囲のキャプチャ）
・Capture selected area（選択した範囲のキャプチャ）
・Capture entire page（今見ているページ全体のキャプチャ）

いずれかをクリックすると、それぞれの形式でキャプチャされます。

キャプチャした画像を加工する

1.いずれかの形式でキャプチャを取ったあと、編集画面に移ります。
***

編集画面上部には、画像加工操作用のバーが設置されています。
***

2.左から二番目の四角いマークをクリックすると、四角形の描画ができます。
***

3.楕円形のマークをクリックすると、楕円の描画ができます。
***

4.棒線・矢印のマークも同様に、クリックすると描画できます。
***
***

5.波線のマークは自由に線を描くことができます。
***

6.白抜きの「A」が表示されているマークは、蛍光ペンのような半透明の太めの線が描画できます。
***

7.しずくのマークは範囲の画像をぼかすことができます。
狭い範囲だけぼかしたい場合は、画像編集ツールなどは使わなくてもこちらの機能で十分でしょう。
***

8.「A」のマークをクリックすると、文字を挿入することもできます。（文字サイズを調整することはできないようです。）
***

9.一番左端のマークはキャプチャ画像を更に四角形に切り取ることができます。
***

パソコン内に保存している画像を加工する

1.また、通常のキャプチャ操作に加え、メニュー内の「Select a local image」を選択するとパソコンに保存している画像を加工することもできます。
***

2.画面中央の点線内の範囲をクリックすると、画像選択画面が表示されます。画像選択後は、キャプチャ時と同様の操作で加工を行うことができます。
***

まとめ

社内デザイナーや外部業者にわかりやすく修正依頼するためにページをキャプチャしたり、作業依頼をする際にキャプチャしたり、修正箇所に印をつけて注釈をいれて…という細かい作業は意外と時間がかかってしまいがちです。
キャプチャツールと画像編集ツールは分かれている場合が多いのですが、一連の作業を一気に行える「Awesome Screenshot」を利用すれば一気に工数を短縮できます。

以前Ferretで紹介したキャプチャ用フリーソフト「faststone Captcure」も素早くキャプチャがとれますが、キャプチャ画像に加工したい場合は「Awesome Screenshot」を使うとより便利になります。

「faststone Captcure」の使い方についてはこちら

【無料】オススメの画面キャプチャツール「faststone capture」

「Awesome Screenshot」の場合はGoogleChromeやFirefoxで開いているページのみキャプチャ可能ですが、「faststone Captcure」はパソコンに表示されている範囲ならどこでもキャプチャを取ることができます。
用途に合わせて使い分け、作業効率を改善して、ホームページ改善の為の施策を考える時間を増やしていきましょう。