Breaking The Rules For All The Right Reasons : Image sizing

Since The Dawn of the Internet (with Pictures) a.k.a. 1995, the prevailing wisdom is to not resize images via html attributes or css.

 

http://graphicssoft.about.com/od/aboutgraphics/l/blresizehtml.htm

 

http://www.computerhope.com/issues/ch001158.htm

 

I however maintain that even when something makes sense most of the time maybe not all the time is a good idea.  The difference is when the page is intended to be printed.   Most browsers will take the additional image resolution and print using that.

 

ScannedCropped

This is a sample.  The logo has to have text in it for multiple reasons, the largest of these is that to put the right font and positioning would take hours. 

  • The top logo is one with a higher resolution, like this blog post suggests you do.
  • The second is one customized for printing well but without using an overkill resolution.
  • The last is a logo not intended to be printed.

There are several points of this experiment to be considered.

  • These were printed and then scanned.  The scanned result closely matches the appearance on the printed page with the eye
  • The same happens if converted to PDF before printing with something like ABCPDF
  • This is one printer.  Others looked to have the similar results.

 

So the takeaway is this

If your page is intended to be printed. Make sure any images you want to be crisp to have a resolution that is suitable for printing.