When it comes to printing a web page, alot of the time you end up with unwanted and unneeded content wasting your precious ink. This seems ridiculous to me, since creating a print stylesheet is so simple and gives you control over what parts of the web page are sent to the printer. This is very useful for websites which have large areas of background colour or images.

Use The Most Readable Typefaces

It is known that Serif typefaces are the easiest to read on printed media, therefore its important to override any “less” legible fonts with this in the print stylesheet.

Keep Colours To A Minimum

Unless it is necessary and is required to make the information complete, avoid using colours for print. Colour ink is expensive and generally held in smaller quantities in most consumer printers, as well as alot of people will request to print in black and white anyway. However this can cause problems too, if the colour used is transferred to a light grey which is hard to read on the paper.

Font Sizes and Spacing

It may be a good idea to increase your font-size slightly as well as your line-height, as this can sometimes look cramped on a printed page.

Remember Page Width

When it comes to setting a width to a website, generally its not much of an issue as the printer will format the text to fit onto A4. However if there are elements on the page that will cause text to be missed out, or images to be cut off, you will need to make sure this is correctly repositioned using the print stylesheet

Forcing Content Onto a New Page

Sometimes your content is separated into sections on a single page, or there is a particular area which you may want to give the user the option if they want to print it or not. This can be achieved by added a page-break. This allows the user to choose which pages they want to print off, keeping unwanted or different content on a new page. It also keeps the document tidy and easier to read.

page-break-before: always;

Display Link Addresses as Caption

This would be useful as obviously links cannot be followed on a printed page, but if the user wants to return later to a link on the web page, they can if the links are included. This can be done by either manually adding a link in a span tag and hiding it on a normal webpage, but showing it on a print stylesheet.


Using a CSS Pseudo class trick, which unfortunately doesn’t work in IE.

.classHere a:after {
	content: " ("attr(href)") ";
	font-size: 11px;
        font-style: italic; 


Tags: , , , , ,

Related Info
These Christmas gift baskets and holiday gift ideas make great presents.

Online education is also a great invention which comes with the help of information technology and online degree programs.


No comments

Be the first one to leave a comment.


Top 100 Writers – Niche Sites

Here are Top 100 Writers sites that specialize in specific niches:

Weight Loss
Hosting - Available
Computers - Available
Home - Available

More Links