PCやスマホから検索をしていると、オシャレなサイト全体をキャプチャして保存したい、サイトの一部分だけ切り取ってキャプチャを撮りたい、といった場面もあるかと思います。
スクリーンショットを撮る方法はいくつかあるのですが、大きく分けて拡張機能を使うか使わないかで区別することが出来ます。
拡張機能を使わずにChromeでスクリーンショットを撮るのは、手軽に使えるメリットがあります。
一方で拡張機能を使うと、スクリーンショットを撮った後に加工が出来るものなど、他の機能と組み合わせて使うことが出来るメリットがあります。
今回は、拡張機能なしでサイト全画面のキャプチャを撮るフルスクリーンショットの機能、拡張機能なしでサイトの一部分のスクリーンショットを撮る方法をお伝えいたします。
スクリーンショットを綺麗に撮るコツ、スクリーンショットを撮れるおすすめの拡張機能7選もご紹介いたしますので、最後までご覧ください。
1. 【拡張機能なし】Google Chromeでフルスクリーンショットを撮る方法
まずは拡張機能を入れずに、Google Chromeの機能でサイトの全画面のキャプチャを撮ることが出来る、フルスクリーンショット機能の使い方をご紹介したいと思います。
1-1. PC版
まずはPCからフルスクリーンショットを撮る手順をご紹介します。
①Chromeの画面右上にあるメニューボタンから「その他のツール」>「デベロッパーツール」を選択します。
②画面中央あたりにある「デバイス選択」ボタンを選択します。
③画面中央あたりにあるメニューボタンから「Capture full size screenshot」を選択します。
これで完了です。ダウンロードフォルダに画像が保存されます。
1-2. スマホ画面もフルスクリーンショットが可能!
デベロッパーツールの画面を開いて、画面左上にある上図の赤枠部分を選択すると、AndroidやiPhoneの種類を選択することが出来ます。
そこで選択した端末サイズで、先程ご紹介した「Capture full size screenshot」をすると、スマホ画面のフルスクリーンショットを撮ることが出来ます。
また画面確認で利用する際も、スマホをそれぞれ開いて見え方を確認する必要がないのでおすすめです。
2. 【拡張機能なし】Google Chromeで画面の一部のスクリーンショットを撮る方法
次に、画面の一部、表示部分だけを選択して、キャプチャを保存する方法をご紹介したいと思います。サイト全体の画像は大きすぎるけれど、画像を部分的に使いたいといった場合にとても役立つ機能なので、是非チェックしてみてください。
①Chromeの画面右上にあるメニューボタンから「その他のツール」>「デベロッパーツール」を選択します。
②画面中央あたりにある「デバイス選択」ボタンを選択します。
③画面中央あたりにあるメニューボタンから「Capture screenshot」を選択します。
3. フルスクリーンショットを綺麗に撮るコツ
3-1. 表示サイズを調整する(ズームアウトの調整)
表示サイズが100%だと、スクロールしないと全体が見れない場合もあると思います。ほんの少しだけはみ出した感じで、スクロールした2ページ目は上部の少しだけで収まるような場合には、表示サイズを少し小さくすることもおすすめです。
表示サイズを小さくすることで、全体がバランスよく小さく収まってくれるので、綺麗にスクリーンショットを撮ることが出来ます。
3-2. 読み込みが完了してから撮影する
スクリーンショットは、画面に表示されている状態をそのまま画像として保存してくれる機能です。
画面の一部が読み込み中であった場合、読み込み中のマークが表示されている状態のまま、スクリーンショットを撮ることになってしまいます。
スクリーンショットを撮る前に、一度画面を全て読み込んでいるか確認することで、綺麗に画像として保存をすることが出来ます。
4. Chromeの拡張機能7選
拡張機能を使わずにスクリーンショットを撮る方法をご紹介してきましたが、拡張機能はダウンロードする手間はあるものの、使うメリットも大きいと思います。
例えば、スクリーンショットを撮った画像をそのまま加工できたり、データ送信ができるものもあるので、頻繁にスクリーンショット機能を使う方には拡張機能を入れることもおすすめです。
今回は7つの拡張機能をご紹介したいと思います。
4-1. Awesome Screenshot
Awesome Screenshotはフルスクリーンショットに加えて、表示画面、画面の選択範囲のみを指定してキャプチャを撮ることが出来ます。
また、録画機能も付いていて、画面全体、タブ指定、カメラのみから選択して録画することが可能です。
スクリーンショットを撮ったら、そのまま図形の挿入や文字入れなど編集機能を使ってから保存することができるのことも特徴です。画像を一度保存した後で、編集ソフトを開くといった手間を省くことが出来ます。
4-2. FireShot
FireShotは、フルスクリーンショットと表示画面、選択範囲のみでキャプチャを撮ることが出来る拡張機能です。
無料でPDF・JPEG・PNGファイルとして保存や印刷をすることも出来ます。有料機能を利用するとGIFなどでの保存も出来るようになります。
また、有料機能を使うとTwitterやFacebookといったSNSへのアップロード機能も利用することができるので、SNS運用でスクリーンショット機能を活用したい方にはおすすめです。
4-3. Screencastify
Screencastifyは、Webブラウザのタブやデスクトップ、Webカメラを動画で保存できる拡張機能です。
この拡張機能の大きな特徴は、動画の中に簡単にペン機能で文字がかけたり、録画した動画を編集できるトリミング機能など、高い機能性にあります。
また、様々な機能が使えるのに、オシャレで使いやすい点も魅力です。
ダウンロードページにある、上の画像と同じYouTubeの説明動画を見るだけで、簡単に使い方を習得できます。1分半程の短い動画なので、是非ダウンロードと併せて説明動画もチェックしてみてください。
4-4. Nimbus Screenshot & Screen Video Recorder
Nimbus Screenshot & Screen Video Recorder
Nimbus Screenshot & Screen Video Recorderは、画面全体のスクリーンショットとブラウザ全体、選択範囲で画面キャプチャができて、動画も撮ることが出来る拡張機能です。
スクリーンショットを撮って、そのままトリミングやテキスト挿入といった編集が可能で、Googleドライブへの保存やYouTubeなどへのアップロードも出来る豊富な機能が魅力です。
4-5. GoFullPage – Full Page Screen Capture
GoFullPage – Full Page Screen Capture
たくさんの機能を組み合わせて使うのではなく、シンプルにスクリーンショットの機能だけを使う拡張機能が欲しい方におすすめしたいのが、GoFullPageです。
機能もシンプルなので、操作もとてもシンプルである点が良さといえるでしょう。スクロールしたページのスクリーンショットを撮ることができます。PNG、JPEG、PDFで保存することが可能です。
4-6. Gyazo
Gyazoは、画面全体、ブラウザ全体、選択範囲のスクリーンショットを撮って、スクリーンショットのURLを共有できる拡張機能です。
ホーム画面を開いて、無料のユーザー登録を行うと、過去にアップした画像も確認することができます。画像を保存する手間も画像を保存する容量もいらないので、簡単に画面を見せながら確認したい場合などに、とても役立つ機能です。
4-7. Toasty! Screenshot
Toasty! Screenshotはスクリーンショットを撮った後で、加工を行い、そのままアップロードが出来る拡張機能です。
コミュニケーションツールのSlackや画像共有が手軽に出来るウェブサービスのはてなフォトライフにアップロードすることが出来ます。
5. まとめ
Chromeで拡張機能を使わずに表示画面やサイト全体のスクリーンショットを撮る方法と、おすすめの拡張機能をご紹介してきました。
拡張機能をダウンロードする手間が必要ないChromeの機能のみで完結できる良さがあります。一方の拡張機能には、スクリーンショットを撮る機能のみのシンプルなものから、編集や動画保存も出来る高機能なものまで様々あり用途に応じて選択できるメリットがあります。
色々試してみながら、自分好みのスクリーンショット機能を見つけてみてください。