むねさだブログ

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

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で送る
コメントはこちら。

  関連記事

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

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

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

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

Adobe好き必見!丸ごと一冊Adobeだらけの雑誌「Pen+(ペン・プラス) 」が面白いぞ!

本業はデザイナーのむねさだ(@mu_ne3)です。 プライベートでも仕事でも、ほ …

会話のキャッチボールに火をつけろ!缶コーヒーRootsのサイトから面白メッセージを送れるぞ!

なにやらTwitterやFacebook上で面白い写真入りのメッセージが飛び交っ …

ponta-TOP
もうPontaカードを持ち歩かなくてOK!これからはローソンアプリがカンタンお得だぞ!【PR】

  ローソンは週4~5日は利用しています、むねさだ(@mu_ne3)で …

毎月最大7枚のパンツが無料でもらえる「フリパン」から実際にパンツが届いたぞ!

パンツはトランクスよりボクサーパンツ派なむねさだ(@mu_ne3)です。 昨年の …

【写真好き必見!】Creative Cloudフォトグラフィプランが機能進化しつつ月額980円で契約可能だぞ!

写真を撮るのが大好きな、むねさだ(@mu_ne3)です。 普段から写真を撮影して …

子どもがいるなら寿司は出前で!ネットで注文「銀のさら」がカンタン美味しく便利だぞ!

美味しいものが大好きな、むねさだ(@mu_ne3)です。 美味しいもの、御馳走の …

【史上最大!】楽天優勝!楽天日本一大セールが始まったぞ!

野球は広島カープファンです。むねさだ(@mu_ne3)です。 先ほど、プロ野球の …

カラオケに行くならiPhone/Androidアプリ「キョクナビJOYSOUND」を入れていこう!

カラオケに行って自分が歌っている時に、みんながリモコンや曲一覧の本を必死で探して …