ブログ - Brave Browserでページ全体のスクリーンショット
見ているSUUMOのページを丸ごと保存したいと考えた.
ブラウザでページをPDFにして印刷すれば良いのだけど,スタイルシートの影響か,リクルート社が意図的にそうしているかわからないけど,レイアウトが崩れてぐちゃぐちゃになる.
調べるとBrave Browserのデベロッパーツールでスクリーンキャプチャー機能があるというので試してみた.
デベロッパーツール(検証)を使う
・保存したいページで F12 キー(Macは Cmd+Option+I)を押して検証メニューを開く。
・Ctrl+Shift+P(Macは Cmd+Shift+P)を押してコマンドメニューを開く。
・screenshot と入力し、「Capture full site screenshot」を選択すると、ページ全体がPNGで保存されます。
簡単だけど使用頻度から考えると手順を覚えるのが無理...でも何も入れないのが良いのかも.
拡張機能GoFullPageを使う
Chromeの拡張機能でGoFullPageをインストール.

保存の際にA4ページサイズとかにするとページ替えの時に空白ができる.

1枚のイメージにするには,image formatをfull imageにすればよかった.
これで定期的にキャプチャーして,画像でdiffにすれば,画像の変化した場所がわかるようになる.
早速画像でdiffを取ってみた.
今回はサイトで「並び順」を変更しただけの変化を可視化してみたのだけど,新着分のある場所だけが赤色で示されている.また,サイト下部にある広告・他の地域の物件などの動的に変更される部分も赤色になってる.検証は成功かな.
ブラウザでページをPDFにして印刷すれば良いのだけど,スタイルシートの影響か,リクルート社が意図的にそうしているかわからないけど,レイアウトが崩れてぐちゃぐちゃになる.
調べるとBrave Browserのデベロッパーツールでスクリーンキャプチャー機能があるというので試してみた.
デベロッパーツール(検証)を使う
・保存したいページで F12 キー(Macは Cmd+Option+I)を押して検証メニューを開く。
・Ctrl+Shift+P(Macは Cmd+Shift+P)を押してコマンドメニューを開く。
・screenshot と入力し、「Capture full site screenshot」を選択すると、ページ全体がPNGで保存されます。
簡単だけど使用頻度から考えると手順を覚えるのが無理...でも何も入れないのが良いのかも.
拡張機能GoFullPageを使う
Chromeの拡張機能でGoFullPageをインストール.

保存の際にA4ページサイズとかにするとページ替えの時に空白ができる.

1枚のイメージにするには,image formatをfull imageにすればよかった.
これで定期的にキャプチャーして,画像でdiffにすれば,画像の変化した場所がわかるようになる.
早速画像でdiffを取ってみた.

今回はサイトで「並び順」を変更しただけの変化を可視化してみたのだけど,新着分のある場所だけが赤色で示されている.また,サイト下部にある広告・他の地域の物件などの動的に変更される部分も赤色になってる.検証は成功かな.

