Webページ全体の画像を作る【スクショ】

Webページを画像でほしい。（スクショことスクリーンショット）

画面で見えない部分も含めて、ページ全体を画像でほしい。

この方法*を忘れることがあるので、備忘にまとめました。

*Windowsパソコンで Google Chrome を使います。

パソコン表示の全スクショ

画面が２分割され、右に「検証」画面が表示されます。

「検証」画面の上部に「>」が表示されます。

下に表示された「Screenshot」をクリック。

ページ全体の画像*がパソコンに保存されます。

＊ファイル名は自動でつけられます。

1 の「検証」画面で「Toggle device toolbar」をクリックすると、スマホ表示になります。

後は 2 以降を行います。

部分スクショの取り方

取りたい画面で「Windows」キーを押しながら「Shift」＋「S」を押下。

暗くなった画面で、スクショにした箇所を左上から右下までドラッグ。

部分スクショは、ペースト（Ctrl＋V）で貼り付けられて便利。

このブログにも貼り付けられます。

よくあるのが、ホームページを変更する時。

変更する前、今の見え方として資料に載せます。

「変更前の今はこうです」「参考ホームページはこうです」等。

ホームページは昨今、スマートフォン表示が第一。（モバイルファースト）

資料に載せる全スクショは、スマホ表示も欠かせなくなっています。