1. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition1  Wiley and the book authors, 2002 Web Design in a Nutshell Chapter 5: Printing from the Web

2. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition2  Wiley and the book authors, 2002 Overview Brief Synopsis:

3. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition3  Wiley and the book authors, 2002 The Problem The web is undeniably an amazing resource for information, but it’s not the most comfortable nor portable way to read. Consequently, many people print web pages to read away from their desks or to file for later use. The ability to print the contents of the window had been built into browsers from the beginning. However, printing documents designed for viewing in a browser window does not always result in easy- to-read printouts.

4. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition4  Wiley and the book authors, 2002 Printer-friendly HTML pages One way to ensure that your users can get a good copy of your content is to link to a separate “printer-friendly” HTML document. These are generally stripped-down versions containing just a single column of content with minimal HTML formatting & graphics

5. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition5  Wiley and the book authors, 2002 Printer-friendly tips Keep the page narrow  The most common problem with printing web pages is that the right edge can get cropped off. This typically happens if you have a fixed- width design or a graphic that’s wider than the printable page  Keep the width of tables and graphics under 550 pixels Keep text visible  Use black text on a white background Think about content  If you’re taking the time to create a separate printer-friendly document, you should tailor the content of that document to be appropriate for the printed medium  Remove navigation aids & ads, combine multi-page content into a single page, print the URL and title of the company at the top, and write out the URLs of linked pages next to the text of the link

6. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition6  Wiley and the book authors, 2002 Cascading Style Sheets for printouts A more sophisticated way to control the way your page looks when it is printed is to take advantage of media-specific style sheets  This feature was added in the CSS2 specification  It allows a single document to be formatted on the fly depending on the device displaying our outputting it The process involves creating 2 style-sheets, one for displaying on the screen, and another for print. Both style sheets are associated with the HTML document using the media attribute or the @media rule. The downside is that browser support for this feature is only available on the newer browsers

7. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition7  Wiley and the book authors, 2002 Creating the style sheets In this example, the HTML document contains a navigational bar, a headline, and a few lines of text test.html Alternative Media Style Sheets With CSS2 you can create style sheets that are specific to the medium they’re displayed on browser.css BODY {background-color: black;} H1 {color: red; font-family: impact;} P {color: “#999999”; font-family: verdana;} print.css BODY {background-color: white; color: black; font-family: times;} DIV.navigation {display: none;}

8. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition8  Wiley and the book authors, 2002 Connecting the style sheets and HTML There are 4 methods for associating the style sheets with the HTML document The target medium can be all, screen, print, projection, braille, embossed, aural, tv, tty, and handheld Method 1 Method 2 BODY {background-color: black;} H1 {color: red; font-family: impact;} P {color: “#999999”; font-family: verdana;} BODY {background-color: white; color: black; font-family: times;} DIV.navigation {display: none;}

9. _______________________________________________________________________________________________________________ PHP Bible, 2 nd Edition9  Wiley and the book authors, 2002 Portable Document Format (PDF) PDF is a technology developed by Adobe for sharing electronic documents. The remarkable thing about PDF files is that they preserve the fonts, colors, formatting, and graphics of the original source document. Ideally, a PDF document looks exactly the way it was designed, regardless of the platform, hardware, and software environment of the end user PDF, however, is not a substitute for HTML  A plug-in or separate application must be used to view the files To create PDF files, you must purchase Adobe Acrobat. Creating PDF files can be as simple as selecting Acrobat as your printer from just about any Windows application.