PCでサイト・ブログのスクリーンショット おすすめツール3選

画像:PCサイトのスクリーンショット(キャプチャ) おすすめツール3選

サイトやブログのスクリーンショット(キャプチャ)を撮れる便利ツールを紹介します。
SNSに投稿したり、制作の仕事でブラウザの表示確認を共有したい時などにも便利です。

今回のツールの動作環境はPCで、
Windows:Google ChromeとFirefoxです。

Windows標準機能のスクリーンショットとは使い分けるのがベスト。

おすすめ順は、

  1. Awesome Screenshot
    • 数秒間、遅延させてのスクリーンショットも可能。
  2. Nimbus Screenshot
    • スクリーンショットはまぁまぁだけど動画が便利。
  3. GoFullPage
    • 操作が簡単。シンプルにスクリーンショット。一応PDFに変換可能。

ツールを探すには、

Google Chromeは拡張機能、右上のメニューから「その他のツール」→「拡張機能」→画面左のメニュー内に「Chromeウェブストアを開きます」を選択。
Firefoxではアドオンと呼びます。右上のメニューから「アドオン」→ 検索窓があります。

Awesome Screenshot

スクリーンショット(キャプチャ)はすべて無料。かなり優秀です。

対応ブラウザGoogle Chrome、Firefox
レコード(動画)△ 一部無料
キャプチャ(スクリーンショット)

無料版と有料版がありますが、スクリーンショットは無料で使えます。
無料で使えるスクリーンショットはかなりいい感じです。

レコード(動画)タブ側では動画も撮れますがアカウント登録の必要があります。基本は無料ですが、う~ん、こっちの使い勝手は良くないです。
有料プランという選択肢もある訳ですが、普通逆ですよね。
「有料プランにするならアカウント登録してください」って言うなら分かるんですが・・・。

図解:Awesome Screenshotの画面説明
Awesome Screenshotの画面説明

①キャプチャエリア選択

表示部分

文字通り画面に見えている部分だけキャプチャします。

フルページ

画面をスクロールして、見えていないページの先頭から最後まで全てキャプチャします。

選択範囲

画面の中のキャプチャしたい部分だけドラッグして選択範囲を指定します。
画像編集ソフトを使って切り抜かなくても良いので楽ですね。

②遅延後の表示部分

時間差でボタンや画像などが表示されるサイトの場合は、この「遅延後の表示部分」がおすすめ。

ボタンを押すとカウントダウンが始まり、ゼロになるとキャプチャが撮れます。カメラのタイマーと同じです。

➂画面全体またはアプリウィンドウ

「画面を共有する」ポップアップ画面が開き、2つのタブ「あなたの全画面」と「アプリケーションウィンドウ」が表示されます。

海外製なので日本語おかしいですが・・・。

あなたの全画面

ディスプレイ全体をキャプチャする事が出来ます。Windowsのスクリーンショットと同じですね。ディスプレイが複数あっても選択可能です。

アプリケーションウィンドウ

起動しているアプリ全体だけをキャプチャ出来ます。ブラウザ画面や他に何かアプリを開いていれば、選択したアプリ画面だけ丸ごと綺麗に撮れるので、ブログでアプリの説明画像を載せるのに便利。

アプリごとに選べるので選択して、「共有」ボタンをクリック。

④オプション

画像:Awesome Screenshotのオプション設定画面
Awesome Screenshotのオプション設定画面

タイマーで遅延させたい時間の設定や画像保存形式(png / jpg)などの設定が出来ます。

GoFullPage

とてもシンプルで、起動させるとすぐさまスクリーンショットを撮り始めます。
スクリーンショット(キャプチャ)は一部無料。ブラウザのスクロールバーも入りません。PDFで保存も出来ます。

スクリーンショットを編集しないのであれば有用です。

対応ブラウザGoogle Chromeのみ
動画機能無し
キャプチャ

キャプチャした後編集できるアプリは多いのですが、このアプリは有料になります。

ボタン1つで、単にサイト全体のスクリーンショットを撮るだけなら手軽で良いかも。

オプション設定

画像:GoFullPageのオプション画面
GoFullPageのオプション画面

画像の保存形式(png / jpg)が選択可能です。
無料版のPDFは書き出しフォーマットの選択だけです。

Nimbus Screenshot (Nimbus Capture)

キャプチャ方法の選択肢が多く自由度高めです。
変換ツールが必要なものの、動画も撮れるのは有難いです。

キャプチャフラグメントは使い方次第ではとても便利です。

対応ブラウザ Google Chrome、Firefox
動画機能
キャプチャ

delayed screenはページの表示されている部分しか保存できません。また、動画は使いやすいのですが、MP4かGIFに変換するなら有料です。でも無料変換サービスがあるので紹介しますね。

Convertio:無料変換ツール

ブログでちょっとした動画を載せるならGif形式がおすすめ。SNSでもよく見かけますよね。MP4にも変換出来ますよ。

図解:Nimbus Screenshotの画面
Nimbus Screenshotのメニュー画面

①キャプチャエリア選択

キャプチャ可視部分

画面上で見えている範囲をキャプチャします。

キャプチャフラグメント

このアプリの特長的な機能です。画面上にカーソルを合わせると、HTML上の要素ごとにキャプチャ範囲を選択出来ます。

例えば、リスト形式の情報とか、特定の情報のブロックだけをマルっと選択出来るのでブログやSNS用の画像として利用しやすいです。

選択したエリア、選択&スクロール

ドラッグしてキャプチャの選択範囲を指定します。
エリアとスクロールの違いは、スクロールしないと見えない範囲もドラッグしてキャプチャしたい時は「選択&スクロール」を使います。

ページ全体

ページの先頭からスクロールしてページの最後までをキャプチャします。

Delayed screen

遅延させてキャプチャを撮ります。他のツールと違って、画面表示されている部分しかキャプチャ出来ません。

ブラウザウィンドウ

他のアプリと同じで、ディスプレイ全体のキャプチャか、起動しているアプリだけをキャプチャします。

Record Video

良い感じで動画を撮れますが、無料だと保存形式が限られます。
でも安心して下さい。無料変換サービスをご紹介いたします。

Convertio:無料変換ツール

ブログでちょっとした動画を載せるならGif形式がおすすめ。SNSでもよく見かけますよね。MP4にも変換出来ますよ。

オプション設定

画像:Nimbus Screenshotのオプション設定画面
Nimbus Screenshotのオプション設定画面

画像の保存形式(png / jpg)が選択可能です。遅延時間などの各種設定も出来ます。

まとめ

スクリーンショット(キャプチャ)だけなら、
Awesome Screenshotがおすすめです。

動画も撮れるNimbus Screenshotと合わて使い分けると良い感じです。

ブログやサイト、SNSにとスクリーンショットの出番はかなり多いです。是非使ってみて下さいね。