Printing Your Website the Right Way

 There are so many techniques and methods available to create a user friendly website. The first one is by using a server side routine or print stylesheets. The print version may strip out images and navigation that lose their meaning on the printed page and may show the page in a single column using a dissimilar font with a different size.

When there is no printable version or the printable version includes ads or other settings, you can use stylesheets. With CSS awareness plus some web development tools, you can easily create your own formatted print versions. The tool you may need involves Mozilla Firefox. If you don’t have it yet, you can install Chris Pederick’s Web Developer’s Toolbar.

Various techniques are utilized in order to expose the grid of the website, segregate the element containing the content you want, use CSS to format the page with suitable font sizes, widths, and margins, use CSS to selectively show and hide the other parts of the page as you see fit and save the CSS to create an immediate custom printable view.

To easily take an X-ray of the site, use the web developer’s toolbar. After that, use the Outline Block Level Elements or Outline Table Cells to outline the site’s grid then use View ID and Class Details from the Miscellaneous menu.

To isolate the target, set the container and its descendants to be visible, and then move to the top of the editing area and hide everything. But before you do this, you can first change its background color, format the texts, change fonts or its border properties so that you can easily identify it. Use the Boxes and Arrows to do this.

When you already achieved your desired look, save your user stylesheet. In cases where you return from Print Preview and the area is vanished, you have to reload to continue with modifications. You can use Load to import your CSS file into the editing area.

If you want to create some space, the difficulty lies on how to distinguish between one div or table and another. To remedy this, you can create a rule in the editing area to place margins around the various containers which are dependent on the layout. If you have difficulty in identifying any target on the page, you can use the View Style Information from the Information menu. Your cursor will turn into a crosshair. Stay close over the elements in your page and the status bar will tell you where in the DOM tree the element is placed.

The editing CSS feature of Chris’ tool doesn’t work in Mozilla for the reason that its sidebar implementation is dissimilar than Firefox. However, if you desire to use Mozilla, you can use Firefox to edit and save the CSS and then use Add User Style Sheet from the Miscellaneous menu to apply the styles you saved.

About the Author

For additional information and comments about the article you may log on to http://www.printingquotesonline.com

 Maricon Almonte

More Articles 

DHTML-Introduction - Eddie Traversa
Think of DHTML as not a singular technology but a combination of three existing technologies glued together by the Document Object Model (DOM): 1. HTML - For creating text and image links and other page elements. 2. CSS - Style Sheets for...

Why Doing It Yourself is Best - Lee Asher
There are two ways that most people who create web pages do it: either they hire a professional web designer, or they use some visual HTML editing software. You could say that hiring a designer is like getting someone to make furniture for you...

Key Facts you should know about Web Site design and Search Engine Optimization - Rajitha Dahanayake
1. Web site File Structure / File Naming Most search engines do not recognize beyond two directory levels. Make sure to name your files and directories with keywords. Don’t separate keywords using the underscore instead...

Search Engine Friendly Web Design Advice - Jimsun Lui
Online marketers understand the importance of getting top search engine rankings in major search engines. Therefore, they spend many time in optimizing website content, seeking inbound links, and optimizing title and Meta Tags. However, many of...

Overview of Paint Shop Pro - Lee Asher
Paint Shop Pro is one of the most popular image editors out there. Even though it's increasingly geared towards digital photography, you'd be surprised just how useful it can be to web designers. Installing Paint shop Pro is pretty much a...

The Importance of Web Standards - Ryan Jones
<blockquote>Welcome to our website; unless of course you're blind, dyslexic, using a screen reader, magnification software, text-based browser, webTV, cell phone, or PDA, running Linux, Unix, BEos, Solaris, OS2 or FreeBSD, or haven't updated...

Brief web Design Tips - Richard Lowe
Here is a list of some tips to help you with your web pages. These are simply suggestions to help you create a better surfing experience for your visitors. Avoid Under Construction signs - All good web sites should always be under construction....

How Web Design Can Affect Search Engine Rankings - John Metzler
Uniquely built web sites can create unique issues when promoting your site on the search engines. From a basic 3 page brochure site, to a corporate site with hundreds of dynamically generated pages, every web site needs to have certain design...

Server Side Programming Languages - Dave Davis
Server-side programming languages are scripts that are executed on the server, and are then translated into HyperText Markup Language (HTML) which can be viewed by all web browsers. The two most popular server-side scripting ...

Effective Website Design - Julie Martin
One of the most commonly overlooked elements of an effective E-Business is the very thing that is essential to your success. Something as simple as the design of your website can make or break your business. Each consumer has their own set...

How to Make Your Website Load Faster - Lee Asher
So your web pages have great content, a nice design, but hardly anyone seems to click through from them to any other part of your website. In many cases, the problem is the load time - people are abandoning your site for the simple reason that...

Starting Cascading Style Sheets - stephen cope
Cascading Style Sheets (CSS) are being used more and more by web designers to layout and format web pages. Although they have been around for several years now many designers have avoided them due to browser incompatibility. Although...