むねさだブログ

またの名を「わんぱくブログ」食・写真・ガジェットを使用した感想や情報を発信中!!

Webサイト全体をレイアウトそのまま印刷したい!という人はChrome拡張使うと良いぞ!

   

  • Pocket
  • このエントリーをはてなブックマークに追加
  • Clip to Evernote
  • LINEで送る

スクリーンショット_011316_024635_PM

ブログ歴も、早いもので8年以上が経過しました。むねさだ(@mu_ne3)です。

ブログやネットのニュースなど、印刷して人に見せたい!ということってありますよね?

ただ、なぜかブラウザの「印刷」を押すと、通常表示している見た目と違ってしまい、ヤキモキしちゃいます。

これ、なんとか改善したい!と思って調べてみた所、Chromeの拡張機能で良さそうなものがありましたのでご紹介したいと思います。


スポンサード リンク

Webサイトを印刷しようとするとレイアウトやデザインが崩れる

まず、こちらをご覧ください。

PCで見た、私のブログです。
スクリーンショット_011316_123924_PM

タイトルがあって、その下にプロフィール・カメラ写真・ガジェット・グルメ、などのカテゴリ表示。

その下にカテゴリのパンくず表示がありつつ、記事タイトル。その下に更新日付とSNSボタンがあって、本文(ここで言うと写真)に入ります。

それが、印刷しようとブラウザの「印刷」を押してみると、こんな具合に…。
スクリーンショット_011316_123855_PM

カテゴリは横並びだったのに縦並びに。パンくずも縦並び。左上にはMENUという表示がなぜか表示されたり。

タイトルと日付の後には、無駄に改行されたSNSボタンが表示され、1枚目に写真さえ表示されません。

これでは、困りますよね…。

 

Chromeの拡張機能「Awesome Screenshot」

ということで今回ご紹介しますのは、Webサイトをみたまんまの表示で印刷することができる便利な拡張機能。
スクリーンショット_011316_122841_PM

ブラウザのChromeを使っている人限定になりますが、こちらのリンクから拡張機能を追加してください。

この拡張機能を使うと、やってることとしては、
1.Webサイトを見えていない部分含めて1枚の画像としてスクリーンキャプチャする

2.(必要ならば)注釈をつけたりボカシを入れたりする

3.印刷はプリントも可能だし、PDFとして保存も可能

ということで、具体的な使い方の紹介をしていきます。

 

「Awesome Screenshot」の使い方

拡張機能を入れると右上にカメラのレンズのようなアイコンが表示されます。
スクリーンショット_011316_124446_PM

これが、「Awesome Screenshot」です。

印刷したいWebサイトをChromeに表示させて、この「Awesome Screenshot」を押すと、このような表示が現れます。
スクリーンショット_011316_125216_PM

表示されている領域だったり、エリアを選択してキャプチャもできるのですが、今回はスクロール領域含めてWebサイト全体を選びます。

こちらのこれです!
スクリーンショット_011316_125450_PM

 
すると、Cheromeの別タブでこのような画面が表示されます。
スクリーンショット_011316_125618_PM

これ、要はこの時点でWebサイトが上から下までマルっとスクリーンキャプチャとして撮られてるわけ。
スクリーンショット_011316_010142_PM

この「Awesome Screenshot」の面白い所は、この状態で注釈を付けたり、線をひいたり、ぼかしを入れたりという加工も出来ちゃうんです。
こんな感じで。
スクリーンショット_011316_011432_PM

なので、記事の査読に使ったり、サイトの修正依頼をする時にも便利なんです!

 

編集が終わったら「Done」で印刷or保存

一通り編集が終わったら(というか印刷だけなら特に編集不要で)、右上のDoneボタンを押します。

するとこのような画面に切り替わります。
スクリーンショット_011316_014048_PM

後は、右側中央にある「Local Save」の左側のアイコンを押すと画像として保存。
右側のボタンを押すと、印刷することができます。
スクリーンショット_011316_014409_PM

ここで、左側の選択肢から「PDFに保存」を選ぶと後から印刷できる状態のA4書類の束として保存してくれるのでとても便利です。

無事、見た目そのままのPDFで保存することが出来ました!
PDF

あとはこれをプリントアウトすれば、見た目やレイアウトそのままで印刷することが可能になります。

 

わんぱくブロガー的まとめ

ブログを書いていると、どうしても「印刷して人に見せる」ことがチラホラとあるんですよね。

そういう時に、この「Awesome Screenshot」を使うと、イメージ通りにブログを見せることができるので重宝しています。

ただし、懸念点としては、
・写真もページ途中で見切れて(次ページに続きが)印刷される
・文字も同様なので、査読用だと少し読みづらくなる箇所が発生することがある
・画像をPDF化しているので、文字検索などができない

という感じでしょうか。

それでもかなり便利だと思いますので、気になっていた人は是非お試しください。

あ、もちろん無料です。
「Awesome Screenshot」
 

 - サービス・アプリ

        
  • Pocket
  • このエントリーをはてなブックマークに追加
  • Clip to Evernote
  • LINEで送る
コメントはこちら。

  関連記事

【クーポンも貰える】ミスド公式iPhoneアプリ「misterDonut」で写真を撮ると面白いぞ!

写真を撮る事が大好きな、むねさだ(@mu_ne3)です。 先日、ミスタードーナツ …

iTunesをアップデートしたら「msvcr80.dllがない」と表示され起動しない問題を解決したぞ!

普段はMac使いですが時々Windowsも使います、むねさだ(@mu_ne3)で …

【注意!】Facebookで既に承認済みの友人から友達申請が来た時は「なりすまし」かもしれないぞ!

Facebookは毎日使っていますむねさだ(@mu_ne3)です。 先日、友人ブ …

ついに来た!iPadでRAW現像!Lightroom mobileで写真の選定や加工が直感的にできるぞ!

写真を撮ることが大好きな、むねさだ(@mu_ne3)です。 デジタル一眼レフで撮 …

iPhoneユーザー必見。写真アプリの中にフォルダを作って自動で写真を振り分けてくれる「スマートアルバム」が便利すぎるぞ!

  iPhoneと、Eye-Fiという無線LAN搭載のSDカードが手放 …

【後1日切ってるので急げ!】世界最小クラスのポケットサイズ折りたたみ椅子「Sitpack」がスゴイぞ!

ずっと立っていると足が痛くなってくる、むねさだ(@mu_ne3)です。 私、足の …

【速報】InstagramがFacebookに買収されただと!?

iPhoneでオシャレな写真を撮れる人気アプリ「Instagram」。 &nbs …

「Super英単語30000」というアプリがすごい

5月位からiPhone用アプリとして発売されている「Super英単語30000」 …

【こんなに違った!】SIMフリーiPhone6sと格安SIMの運用について比較検討してみたぞ!

実はau歴15年くらいになる、根っからのauユーザーのむねさだ(@mu_ne3) …

自分のスマホから料理が注文できる居酒屋、三田の「魚串」でスマレジ体験してきたぞ!

食べるの大好きなむねさだ(@mu_ne3)です。 スマレジとは、店舗に大がかりな …