Thursday, January 08, 2009

Why HTML Print Templates are dangerous and erratic

In quite a few recent projects we executed, I have observed the developers and the UX Designers spend considerable time in designing HTML Print Layouts that never behaves like it should. It should be noted that HTML Print templates are not fool-proof as the final output depends on the individual browser settings and bandwidth considerations.

Browser Limitations:

  • Each browser version even from the same vendor interprets the print in it's own way. What is printed by IE6 might differ from what is printed by IE7. 
  • The individual users Page Setup overrides any settings we might incorporate in our code. 
  • For example, in out HTML code we can define the margins to be 0.5 inch but if the user's browser print settings are set at 0.2 inches, the HTML settings will be ignored. 
  • In many cases, the user's disable the "Print images and background colors" option in their browser settings. In this case, no images or colors will be printed.
  • The page is designed as "Landscape" but the user's browser print settings are set to "Portrait". The page will print as Portrait.
  • CSS-based print is not supported by many browsers as they were not refined in CSS 2.0 specifications. CSS 3.0 specifications allow for advanced print layouts but no browser manufacturer has adopted this as yet except IE 8 Beta and Opera

Due to security reasons, the web application cannot change/access the individual user's browser settings.

Bandwidth Considerations:

Take the example when we need to create a map print template in A0 size for the browser. This means that the client will have to download the map image of at least 12000 px X 10000 px (40'' x 33") which might translate to 10-15 mb. In addition, it will have other graphic and text elements. In a normal 256 kbps connection, it can take upto 5-10 minutes to generate and render the preview on the client side.

Reducing the filesize will lead to dithering of the image and loss of quality.

Repercussions:

  • No control over the print output
  • Different print outputs in different browsers and different machines
  • Performance issues due to large image size downloads
  • Lost man-hours in trying to tweak the output for different browsers

All these will eventually lead to problems during the UAT and also in the profitability of the project.

Solution:

  • Large-size prints should be in PDF or Flash Paper formats
  • Generate PDF in server and let the user download the generated PDF for offline printing/plotting
  • Educate the client on the limitations of the browser-based HTML Print templates and on the advantages of PDF/Flash Paper

0 comments:

Post a Comment