個別記事

前後の記事

印刷用 CSS に必要なこと

この記事が属するカテゴリー
CSS

拙サイトにおいて印刷用 CSS の需要と必要性がどれほどあるのかは微妙だけど、とりあえずは用意していたりする。んで、作成した当時にこうした方が良いかなってな事がいくつかあったんで、何となく書き残しておく。いや、別にネタがないとかそう言うことじゃ (ry

基本的に紙媒体を対象とするもんだから、通常のスクリーン用 CSS を作成する時とは考え方が変わってくる。

不必要な要素を非表示
ナビゲーションやらサイドカラム、フォームなんかは必要ないんで、display: none; にしてプリント用紙を節約。
フォント関連
ポイントで決め打ちする。拙サイトの場合は、本文 10pt にしてある。後は、本文などの長文系は明朝系のフォントを指定した方が読みやすい。
色は使わずモノクロ
余計な色を使ってインクを使わせないって事と、モノクロプリンタのユーザに対しての配慮。そして、なるべくスミ 100% などのベタにしない。

あとは、リンクに関しては URI が記述してあった方が親切な気がする。:after 疑似要素に対応しているブラウザのみが 対象となってしまうけど、下記のように指定して URI を生成させている。

a[href]:after {
        content: " (" attr(href)") ";
}

これで、印刷したものを見てもリンク先の URI を知ることが出来る。とりあえずこんなもんだけど、こうやって見てみると特に深いことはやってなかったっす。おまけにかなり手を抜いてたりして。とりあえず、凝ったことはせずに極力シンプルにするって事が大事かも。

意外と他のサイトの印刷用 CSS なんて見ることは少なかったりするんだけど、皆さん他にどういった事をやってるんだろうかとか気になってみたり。

2005-08-18T19:57:37+09:00 | コメント (2) | トラックバック (2) |はてなブックマーク

関連性が高いエントリー 5 件

トラックバック

このエントリーのトラックバックURL:
http://WWW.lucky-bag.com/cgi/mt/mt-tb.cgi/289

このリストは、次のエントリーを参照しています: 印刷用 CSS に必要なこと:

妄想科學日報 さんからのトラックバック
[CSS]印刷用スタイルシート
中途半端ながら印刷用スタイルシートを追加。不慣れなので背景色/文字色などを多少調整するに留まる。 練習を兼ねて、本腰入れて弄った方がよいのだろうけれど。 以下に... [続きを読む]
2005年08月23日 05:23
TRANS さんからのトラックバック
[Web]印刷用CSSをまとめてみた。
以前、絵文禄のことのはさんのところで、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論というエントリーがあった。それから、ちょっと印刷用... [続きを読む]
2006年12月09日 03:23

コメント

宇彩 さんからのコメント

はじめまして。いつもこっそり読ませていただいております。

以前僕が印刷用 CSS を作成していた際には、これでもかってくらい極力必要なものだけに抑えていました。こちらよりもっと思い切りよくやってました。ブログのタイトルすら省き、前後の文章へのナビも省略。このエントリを例にすれば、「印刷用 CSS に必要なこと」というタイトルより上のものは全部消してました。

本文以下ではトラックバック関係も削ってしまい、もちろん TypeKey ID がウンタラカンタラなんてメッセージも切っていました。表示するものは、エントリのタイトル、本文、以下がコメントであることを示す「コメント」などの文字と、コメントの本文、そして最後にコピーライト。

少しでも紙を節約するため、印刷した際にユーザが本当に必要とする（と想定される）情報以外は全部バッサリでした。ちょっとスッキリしすぎという気はしてましたが、誰からも不満の声は……ああそうか、誰も印刷なんぞ (ry

以上、ご参考まで。

2005年08月18日 22:14
e-luck さんからのコメント [TypeKey Profile Page]

宇彩 さん、コメントありがとうございます。
いや、そんなこっそりなんて言わずに :-D

>もちろん TypeKey ID がウンタラカンタラなんてメッセージも切っていました。

確かにその部分はいらないですね。拙サイトでも非表示にしようと思ったんですが、section 要素的に div で括ってなかったんで、どうしようかなって思っててそのままにしてました。:nth-child() 擬似クラス が使えれば良いんですが。

ブログのタイトルに関しては、印刷した人が他の人に参考として渡す場合には情報としてあった方が良いのかなあとか思ってます。まぁ、そこら辺は人によって考え方は違うんでしょうけど。
つうか、このサイトに印刷するほどの情報があるのかと小一時間 (ry

2005年08月19日 12:36

コメントしてください

コメント内ではタグは一切使えません。コメント内にてタグを表記したい場合は、お手数ですが、文字実体参照を利用して < を &lt; 、> を &gt; とそれぞれ置き換えてください。




保存しますか?


(V) (P)