This is a solution for producing a print and a web version of the same content, addressing the difficulty of maintaining two versions. This issue arose when I converted our Physics lab manual to a web format and now found that I was left with updating two versions.
An HTML page draws in content by using "includes" and basis the formatting on CSS. For the print web page, printing is controlled with an ActiveX component (for the print header, footer and page numbers), page breaks are set with style="PAGE-BREAK-BEFORE: always" and a scripting variable (PrintFlag) is used for active changes to content.
Content is placed in a separate folder, divided into small units (introduction, procedure, results, ...) without headers. The header is kept as a separate file. A view (web or print) is composed by "including" a header and content through using a FrontPage web bot (very easy to do) or by using an ASP (Active Server Page) include.
Formatting is handled with CSS (Cascading Style Sheets), one for web view and another for print format. The print one removes color, hyperlinks, background and so forth, for black and white printing. Section headers in the print version are also reduced in size.
Printing is controlled through a free ActiveX component called ScriptX that changes the print header/footer (such as adding page numbers). This code was packaged as a separate file (view source to see what was done) and is "included" on the print web page (similar to what is done with content). The component was also used to grab the HTML page title for the page numbering (for example: Experiment 5 page 1 of 3).
Through scripting with DHTML, a print button is removed during printing by setting style.display ="none". Also a print flag scripting variable is set for potential use with content pages.
| Page breaks are set with: |
<div style="PAGE-BREAK-BEFORE: always"> Some Content </div> |
Page last changed February 08, 2004