岐阜でホームページ制作、マーケティング&デザインを提供しているMWORKSです

お気軽にお問い合わせください

TEL 0573-67-8189

Mブログ

- mblog -

Chromeで印刷できない、その悩み【拡張機能】で解決!

公開日:2015年5月13日 : ソフト・アプリ・ツール

Chromeで印刷できない、その悩み【拡張機能】で解決!

Google chrome便利ですよね、僕もメインブラウザchromeです。しかし、こと印刷に関してはどうも使い勝手が悪い…。

という訳で、今回はGoogleChromeを使って思い通りに、Webページを印刷、PDFにする方法を紹介します。拡張機能を使うことでchromeでも立派に使える資料ができちゃいます。

「資料をまとめるのにwebページがうまく印刷できない!」「ホームページの不要な部分を消せない!」などでお困りの方、以前うまくできなかった方の参考になればと思います。

念のために、chromeダウンロードページ

この記事に訪れた方は、chromeをすでに使っている方だと思いますが、念のために、chromeをまだダウンロードしていない人は、こちらから無料でダウンロードできます。

GoogleChromeダウンロードページ>>

Chrome印刷の基本機能

chrome印刷機能_問題点

便利な拡張機能の紹介の前に、ざっと印刷機能とその問題点について説明したいと思います。

※注意点
macでの説明になります。Windowsとは違う部分があるかと思いますのでご了承ください。

では早速、MWORKSの「ホームページ制作」ページを印刷してみます。

印刷するページはこんな感じ。

MWORKS_ホームページ制作ページ

画像を表示させたい!

最初の設定では、ページ背景として使用されている部分の画像は表示されません。
プレビューを見て、背景画像を表示させたい場合は、下記の箇所にチェックが必要です。

プリントダイアログ

画像を表示させる(オプション)

■ページタイトル、URLを印刷させたい場合
・ヘッダーとフッターにチェック

■ページの背景に使用されている画像を印刷させたい場合
・背景のグラフィックにチェック

縮小・拡大印刷したい!

chromeには、縮小・拡大の設定がありません。(なぜなんだろう?基本的な機能だと思うのですが…)最初ビックリしました。(パソコン側の機能を使うんですって)

システムダイアログを使用して印刷

縮小・拡大の設定は、パソコン側の機能を利用します。それが、「システムダイアログを使用して印刷」です。でも1つ問題が、なんとここではプレビューが表示されないのです!

システムダイアログ

しかし、いろいろいじってみるとできました!
・システムダイアログを使用して印刷→pdf→プレビューでPDFを開く

PDFでプレビュー

ここでプレビュー画面を確認することができます。しかしまた問題が。

「プレビューでPDFを開く」では、背景画像が表示されていないのです。

プレビュー画面_背景なし

結論(うまく印刷できない!)

macのchromeでシステムダイアログを使用して「縮小・拡大をプレビューして印刷」するとページの背景が印刷されない場合がある。(すべてのサイト・ページで当てはまるかは不明です)

これは困りました、縮小・拡大はプレビューできるけど、そのかわり背景は印刷されなくなると。

Chromeの印刷系おすすめ拡張機能

GoogleChromeさん、しっかりしてくださいよ!ぶつぶつ…(これがアメリカンスタイルなのか?カリフォルニアロールなのか?)

という訳で、やる気のないchrome印刷機能を使えるようにするべく、ここで満を持して登場です。カリフォルニアロールの皆さん!…。 じゃなくて、拡張機能の皆さん!

Print Selection

※ここで紹介する拡張機能をインストールして、うまく動かない場合は一度GoogleChromeを再起動か、ページを再読み込みしてみてください。

Print Selection

Print Selectionインストールページ

Print Selectionは、ページ上の印刷したい範囲をマウスでドラッグして印刷するという、シンプルかつとても簡単な機能です。

Print Selection_使い方

Print Selection_選択画面
  • 印刷したい範囲をドラッグして選択。画像の青くなった部分がドラッグして選択した部分です。
  • この状態で右クリック→Print Selectionを選択。

プリントダイアログが表示されるので、そのままプリントできます。
印刷画面では、デザイン部分は省かれて、テキストと画像のみがレイアウトされます。この単純さがナイスです。

プリントダイアログ

Print Friendly & PDF

Print Friendly & PDF

Print Friendly & PDFインストールページ

Print Friendly & PDFは、ページの内容からテキスト、画像を取り出して、A4サイズにレイアウトしてくます。

多少レイアウトが崩れるページもありますが、「とりあえず内容を取り出せればOK」という場合には、使える拡張機能です。また、必要ない部分は選択して消せるという便利機能もついています。ナイスです。

Print Friendly & PDF_使い方

Print Friendly & PDF_アイコンボタン
Print Friendly & PDF_ダイアログ画面
  • ツールバーのアイコンをクリック
  • 印刷、PDF、メールのボタンから必要なものを選択可能。
  • 文字の大きさを変更可能。
  • ページ内の画像をすべて消去可能。
  • 必要ない部分は、クリックして消せる。

※注意点
そのまま印刷すると、なぜかフォントが明朝体になってしまいます。(環境によってはちがうかも?)
PDFを選ぶとゴシック体で書き出せたので、ゴシック体で印刷したい場合は、
PDFで書き出し→印刷という一手間かかります。

FireShot

FireShot

FireShotインストールページ

ページ全体のスクリーンショットを撮れる(ページ全体を画像で保存できる)という拡張機能です。この機能を使えば、ページをみたままの状態で印刷することが可能です。

FireShot_使い方

FireShot_ボタン
FireShot_ダイアログ
プリントダイアログ
  • アイコンをクリック
  • ページ全体をキャプチャ
  • 印刷

このようにページ全体を、画像、PDFとして保存することが可能です。
僕はこのFireShot拡張機能をよく使っています。おすすめです。

拡張機能の注意点など

今回紹介した拡張機能の他にも、似たような機能をもった拡張機能がありますが、自分が使ってみた感想として、印刷については今の所この3つがあればとりあえず良いかなと思います。

後は、ページ全体をスクリーンショットする機能を持つ拡張機能で、「Webpage Screenshot 」、「Awesome Screenshot」というなかなか便利な機能があるのですが、両方ともに、不正が発見されていまして、(閲覧ページのURLを取得・どこかに?送信しているらしい)使用しないほうが良いとのこと。

■Webpage Screenshotがポリシー違反
http://kemaken.info/webpage-screenshot.html

Webpage Screenshotはウェブストアで削除されていますが、Awesome Screenshotはまだダウンロードできます。

インストールされている方はご注意ください。

まとめ

Webページを印刷することは、それ程多くないですが、いざ印刷しようとするとchromeって使えないんですよね。ソフトの使い方などで時間を取られずに、大事な仕事に集中したいですね。

今回紹介した拡張機能を必要な状況に応じて使い分ければ、資料をまとめの際に仕事がはかどること間違いなし!

また仕事に使える機能があれば今後も紹介していきます。それではまた。


スポンサーリンク

Mblog

新着記事

- new articles -

ホームページ制作やマーケティングの他にも、日々の仕事での考えや気付きなどを記事にしています