スクショ用にいま見ているWebページをChromeデベロッパーツールを使って一時的に書き換える

自分のブラウザの中の世界であれば、どんなWebサイトであっても自由に表示を書き換えることができます。Chromeを使っている場合を例に、デベロッパーツールを使ってスクショ用にWebサイトの表示を整えてみましょう。
1. Web広告の表示を削除してからスクショを撮る
  • ある要素のHTML上での位置を特定する
  • 特定したHTMLタグを一時的に削除する
  • 本当に削除すべき親要素を探索する
2. Webページに表示された個人情報をダミーに変更してからスクショを撮る
  • HTMLタグの中にあるテキストを一時的に書き換える
  • HTMLタグの属性の値を一時的に書き換える