Webが苦手としているものの一つに印刷があります。Webサイトを印刷しようとしてデザインが崩れてしまった経験はないでしょうか。また、ごく一部だけ印刷したいのにそれもままなりません。 そこで使ってみたいのがPrint.jsです。印刷対象を細かく指定できるソフトウェアです。

Print.jsの使い方

一例です。PDFファイルを指定すると見ているHTMLと全く違うPDFが印刷できます。

 <button type="button" onclick="printJS('docs/printjs.pdf')">
    Print PDF
 </button>

さらにフォームの印刷も。

<form method="post" action="#" id="printJS-form">
  ...
</form>

<button type="button" onclick="printJS('printJS-form', 'html')">
  Print Form
</button>

任意の文字を差し込むこともできます。

JSONの印刷。

画像ごとに印刷ボタンを置いて、その画像だけ印刷することもできます。Webページで表示しているものと異なる品質の画像を印刷できます。

ユーザの必要としている文脈を理解できれば、印刷ボタンを押した時に何を表示すれば良いか分かるようになるでしょう。PDFであればより細かくレイアウトを調整したデザインで印刷が実現できます。

Print.jsはJavaScript製のオープンソース・ソフトウェア（MIT License）です。

Print.js - Javascript library for HTML elements, PDF and image files printing. crabbly/Print.js: A tiny javascript library to help printing from the web.