はじめに
「Webサイトを見たままの状態で印刷したいのに、レイアウトが崩れるのはなぜ？」
「画面では表示されている背景や画像が、印刷すると消えてしまうの？」と困っていませんか。
仕事の資料や保存用としてWebページを印刷しようとしたとき、文字の位置がずれたり、右端が切れたりすると、どこを設定すればよいのか分からず迷ってしまいますよね。
この記事では、Webサイトをブラウザから印刷する基本的な方法と、画面どおりに印刷できないときに確認したい設定や対処法を順を追って説明していきます。
Webサイトをそのまま印刷する方法
Webサイトを画面に近い状態で印刷するには、まずブラウザの印刷機能を開き、印刷プレビューで仕上がりを確認します。
ここでは、ブラウザから印刷する基本的な方法から、背景・画像、倍率・余白の設定、印刷前のプレビュー確認まで順に説明します。
まずはブラウザの印刷機能を使う
Webサイトを印刷するときは、対象ページを開き、Windowsでは「Ctrl＋P」、Macでは「Command＋P」を押します。
印刷画面でプリンターや用紙サイズ、印刷するページを設定し、プレビューに問題がなければ印刷しましょう。
背景や画像が印刷されない場合は設定を変更する
背景色や背景画像が印刷されない場合は、ブラウザの印刷設定を確認します。
Chromeでは「詳細設定」を開き、「背景のグラフィック」にチェックを入れると、背景を含めて印刷できます。
表示が切れる場合は倍率や余白を調整する
ページの右端などが切れる場合は、印刷設定の倍率を下げて、用紙内に収まるよう調整します。
余白が広い場合は「最小」などに変更すると、ページ全体を収めやすくなります。
印刷前にプレビューで表示を確認する
印刷する前にプレビューを開き、文字や画像が途中で切れていないか確認しましょう。
不要な空白ページなども確認し、気になる部分があれば設定を調整してから印刷すると安心です。
Webサイトをそのまま印刷できないときの対処法
ブラウザの印刷機能でレイアウトが崩れたり、画面どおりに印刷できなかったりする場合は、別の方法でページの表示を残してから印刷できます。
ここでは、スクリーンショットとPDF保存を使ってWebサイトを印刷する方法を説明します。
レイアウトが崩れる場合はページ全体をスクリーンショットして印刷する
ブラウザから印刷してレイアウトが崩れる場合は、ページ全体をスクリーンショットとして保存する方法があります。
ページ全体をキャプチャして画像として保存し、その画像を印刷すれば、記録したレイアウトを保ったまま出力できます。
Webページ全体を画像として残す方法が分からない場合は、保存方法を確認してから進めると安心です。
▶Webページを保存する方法は？HTML・PDF・スクリーンショットの違いを解説
必要に応じてPDFに保存してから印刷する
印刷時の表示を確認してから出力したい場合は、一度PDFとして保存する方法もあります。
ブラウザの印刷画面でPDF保存を選び、保存したファイルの内容を確認してから印刷すると安心です。
まとめ
Webサイトをきれいに印刷するには、まずブラウザの印刷プレビューを確認し、必要に応じて背景や倍率、余白を調整しましょう。
それでもレイアウトが崩れる場合は、スクリーンショットやPDFに保存してから印刷する方法もあります。
無理にブラウザの印刷だけで整えようとせず、ページの表示に合った方法を選ぶとスムーズです。
