ホームページを運用していると、ツール紹介のコンテンツ制作など、スクリーンショットの機能を使う機会があります。スクリーンショット機能はパソコン自体にも備わっていますが、拡張機能を使うと使い勝手が良くなります。

今回は、スクリーンショットやキャプチャをするときのChrome拡張機能を10個まとめました。

目次

  1. Chrome拡張機能
    1. ウェブページ全体をスクリーンショット撮影。
    2. Webページの写真
    3. スクリーンショット
    4. Webcliple
    5. Awesome Screenshot
    6. Screen captur,screenshot shre/save
    7. スクリーンショットのキャプチャ
    8. Toasty! Screenshot
    9. Full Page Screen Cutter
    10. Pingスクリーンショット全体
  2. 拡張機能無しで全画面のスクリーンショットを撮影する方法
  3. まとめ

Chrome拡張機能

【1】ウェブページ全体をスクリーンショット撮影。

https://ferret.akamaized.net/images/59eea6f9781b876426000893/original.jpg?1508812536
ウェブページ全体をスクリーンショット撮影。

Webページ全体のスクリーンショットの撮影と編集・注釈が可能です。キャプチャ画像は「PDF/JPEG/PNG」ファイルで保存でき、クリップボードにコピーができるため、オフラインでも作業が可能です。また、スクリーンショットをGmailに直接送信することもできます。

この拡張機能はFirefoxでも取得できます。

参考:
完全なWebページのスクリーンショット

【2】Webページの写真

screenshot_-_2.jpg
Webページの写真

Webページのスクリーンショットが利用できます。スクリーンショットはフォトギャラリーに保存されるため、後でまとめて確認することもできます。オフラインでも利用でき、ショートカットキーで素早く作業できます。

【3】スクリーンショット

screenshot_-_3.jpg
スクリーンショット

拡張ボタンをクリックし、画面上で操作するだけで、画面全体か、指定した画面の一部のスクリーンショットができます。JPEG・GIF・PNGなど、用途に応じたファイル形式で保存することができます。

【4】Webcliple

screenshot_-_4.jpg
Webcliple

一定間隔であらかじめ登録しておいたホームページのスクリーンショットを自動的に撮り、画像サーバーにアップロードします。スマートフォンから閲覧することも可能です。社内でしか閲覧できない情報を確認するときなどに活用できます。

【5】Awesome Screenshot

screenshot_-_5.jpg
Awesome Screenshot

Webページの全画面か一部のスクリーンショットを撮れます。以前は有料だった機能も全て無料になっています。スクリーンショットは編集・注釈が可能です。

参考:
Awesome Screenshotとは〜キャプチャ画像を無料で簡単加工できるツールの使い方を徹底解説|ferret

【6】Screen capture, screenshot share/save

screenshot_-_6.jpg
Screen capture, screenshot share/save

スクリーンショット後、運営サイト(www.clipular.com)に自動的に保存され、タグ付けやフィルタリングで整理し、検索することもできます。スクリーンショットには注釈をつけられます。

【7】スクリーンショットのキャプチャ

screenshot_-_1.jpg
スクリーンショットのキャプチャ

Webページのスクリーンショット後、切り取り・ペイント・ハイライトなどの編集を行えます。画像はローカルで保存するか、オンラインでの共有が可能です。

【8】Toasty! Screenshot

screenshot_-_7.jpg
Toasty! Screenshot

スクリーンショットを撮影後、加工してアップロードできます。加工では枠線や矢印などのイラストや、画像とテキストの挿入も可能です。

【9】Full Page Screen Cutter

screenshot_-_8.jpg
Full Page Screen Cutter

全画面のスクリーンショットを撮影し、一部を切り取って保存することができます。オフラインでも利用でき、インターフェースも工夫されています。

【10】Pingスクリーンショット全体

screenshot_-_9.jpg
Pingスクリーンショット全体

Webページの全画面のスクリーンショットをワンクリックで撮影し、PNGファイル形式で保存できます。撮影後は、加工やサイズ調整も可能です。

拡張機能無しで全画面のスクリーンショットを撮影する方法

Google Chromeではデベロッパーツールから、拡張機能を使わずに全画面のスクリーンショットが撮影できます。

まず、スクリーンショットを撮影したいページでデベロッパーツールを開きます。
デベロッパーツールは以下の方法で開けます。

  • Windows:Ctrl + Shift + I
  • Mac:command + option +I

スクリーンショット_2019-03-06_16.11.07.png

デベロッパーツールを開いたら、詳細機能を開きます。
詳細機能は以下の方法で開けます。

  • Windows:Ctrl + Shift + P
  • Mac:command + Shift + P

そのまま「full」と入力すると「Capture full size screenshot」と表示が出ます。
Enter、もしくはクリックすることでスクリーンショットが撮影できます。

スクリーンショット_2019-03-06_16.11.18.png

まとめ

スクリーンショットを利用して画像を掲載することで、読み手にとっても視覚的に伝わりやすいコンテンツとなります。拡張機能を活用し、業務効率も上げながら読みやすいコンテンツを制作しましょう。

この記事を読んだ方におすすめ

【2019】Windows、Mac、スマホまで!業務効率化に役立つアプリとツール集

【2019】Windows、Mac、スマホまで!業務効率化に役立つアプリとツール集

業務をより効率的にするため、新たにツールやアプリを入れれみましょう。この記事ではPCやスマートフォンにインストールできる便利な業務効率化ツール&アプリを紹介します。

知ってると便利!iPhoneでのスクリーンショット撮影にオススメの無料アプリ7選

知ってると便利!iPhoneでのスクリーンショット撮影にオススメの無料アプリ7選

今回は、iPhoneユーザーの方にオススメしたい無料のスクリーンショット撮影アプリ7選をご紹介します。 デフォルトでもホームボタンとサイドボタンを同時に押すことで撮影可能ですが、ただスクリーンショット撮影をするだけではなく、さらに便利な機能を兼ね備えたアプリばかり厳選しました。 iPhoneユーザーで、かつスクリーンショット撮影を行う機会の多い方は、本記事を参考に使いやすいアプリを探してみてはいかがでしょうか。