You have put a lot of effort into creating a sexy overview of whatever data your application stores and allow your users to manipulate that data through AJAX controls. But, some people just want to print their data.
How to go about that? Just printing the page with data is generally not a good idea because it has been optimized for display on a screen. The first step we need to take is adapting our page for printing. Stylesheets are very handy tools for this. Check the following part of the header of my layout:
This will generate HTML code that includes two stylesheets. However, only the 'default' stylesheet is used on screen. When the users prints a particular page, the print stylesheet is used instead. So, what do you want to change in the print stylesheet?
<ul>
<li>Fonts should be serif (not sans-serif) for printing</li>
<li>Hide images as much as possible</li>
<li>Hide ads</li>
<li>Display printable ads that are hidden on screen</li>
<li>Hide navigational elements</li>
<li>Use a black-on-white colour scheme</li>
<li>Underline links and colour them blue for easy recognition</li>
<li>Add the actual URL to your links (see below)</li>
</ul>
To add the actual URL in the href-part of your link to the name of your link add the following to you print stylesheet: