3

I am currently recoding a website from tables to modern html/css and have several 100 pages to go over.

The problem is, each page has its own print version in another file, also with tables.

Would it be acceptable to apply a print stylesheet instead of a different file for print?

Also, when I click on print button on this page the new version opens up and somehow the print promt starts.

How is this done exactly?

Is there any advantage of using a different version of a page (in this case different .html file) instead of css for the same file?

Improve this question

2 Answers 2

Reset to default
1

There is many reasons why you should opt to use to a print.css and here's just a few reasons.

  • new pages have a print option with no further intervention.
  • Google can easily see that you have a print css (No worries about duplicate content.)
  • no need to edit any markup.

Now... Your vague on using a different HTML file since this could mean 2 things, you have a different style sheet assigned to pageB or your actually editing elements out of the page. Either way your duplicating content unnecessary - granted we have things like canonical links which helps prevent this but it should be just a guess of pressing the print bottom and BAM.

Also a different page that prompts for print would need to use JavaScript which may not work because JS is not enabled, you'd need to use something like window.onload = function() { window.print(); }

Personally I'd opt to use print.css if you opt to use pageB method using a style sheet would be pointless and editing elements of the page would be tiresome, you want the method that your able to make global changes quickly - CSS Print enables this.

Simply use stuff like:

header, footer, a, img{display:none;}
Improve this answer
2
  • so basically a printer will recognize and automatically use the print.css for screen="print" correct?
    – user1721135
    May 30, 2013 at 19:46
  • 1
    Yep exactly, the idea of print is to save people ink and only print whats nessacary, so for a good website with good print will disable hyperlinks (be careful if you have them in the content, do .article-container a {text-decoration:none;} and for disabling other links and menus do display:none. Also if you have colored text ensure you do h1, h2, h3, h4, h5, p, span, a, div, body, html {color:black!important;}
    – Simon Hayter
    May 30, 2013 at 21:38
1

Definitely using a print-only stylesheet would be your best way to go. Once you have that established and working as you want, you can simply add an anchor tag to each page that will then open the print dialog, with something like <a href="javascript:window.print();" title="Click here to print this page">Print this Page</a>.

By going this route you decrease future maintenance, and (slightly) increase printing performance.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.