How to Optimize Graphics for use in WebPlus
By Ken C.
With all my sites, I create the page look (a full size mock-up) in Serif DrawPlus, export sections or slices as 288 ppi tiff images. These are opened in Serif PhotoPlus, resized to 96 ppi using Lanczos3 resampling (best quality) and exported as jpg or png - seldom using gifs as they are too lossy. (96 x 3 = 288.) These images are inserted in WebPlus, never allowing WebPlus to handle them (saved into an 'images' folder on the website rather than letting WebPlus use the 'wpimages' folder), the original images are always used and never resampled by WebPlus.
The same goes for photos (always working on a copy, never the original). I work out the best size either in width or height on the WebPlus page, resizing the copy in PhotoPlus to 96 ppi, Lanczos3 resampling - maintaining the aspect ration to prevent squashing or stretching of the image. It's then a simple case of deleting the temporary image (yes delete, not replace, in case there is some slight discrepancy of size in either image in which case WebPlus will take over and resample the image) and importing the resized copy and placing it on the WebPlus page.
It's a longer way round, but PhotoPlus is, after all, a bitmap image processing program and WebPlus is a website building program. While WebPlus tries to handle images, unless they build it with Lanczos3 resampling and provide greater control over exporting, PhotoPlus will always give superior images. Lets face it, the internet is such a graphically intense place - and I mean no disrespect to those with sight impairment - it's worth spending the extra time and effort getting the best possible quality.
Hope this helps and hasn't bored you!
Ken (Major Confusion)
Sharing the FUN with Serif Software
Serif Forum link
On:29/11/2008 09:25:20 - Martin Taylor wrote:
I'm convinced that the ppi (or dpi) of the image has absolutely no bearing on its quality or its size on disk.
Quite correct. My understanding is that a difference in ppi is reflected in print size, I try to aim for a size that will provide an acceptable print if someone tries to print one of my pages - and should I make pdf versions of a tutorial, the print, while not perfect, will be acceptable and provide a reasonably sized pdf, so I can reuse the same images. It could just as easily be a lower ppi, but to retain the same pixel dimensions results in a larger, very pixelated, print size.
On:29/11/2008 09:25:20 - Martin Taylor wrote:
I can understand that you need to convert the tiff to jpg or png, but why do you bother with changing the dpi?
Experimentation with exporting png, jpg and tiffs from DrawPlus showed the limitations in the DrawPlus system - jagged curves and the like, even when using 96 dpi (the DrawPlus/Windows native setting). PhotoPlus provides the best resampling. As I was working on a full sized page layout in DrawPlus, exporting at 288 dpi (3x96), the quality of the export from DrawPlus is greatly improved. It is simply a matter of one measurement (ppi) being adjusted in PhotoPlus and the quality is retained.
For example, a page design in DrawPlus, drawn at 96dpi, measuring 1000 x 1000, when exported at 288 dpi becomes 3000 x 3000. Any part or slice of this page can be exported at 288 dpi. In PhotoPlus any of these tiff images (tiff to retain quality and and transparency) can be resized to 96 ppi and revert back to their correct 'on page' size - a no-brainer.
For the sake of consistency, I give all images the same ppi, this way I know where I am without wondering whether this image is 72ppi or that one's 300ppi etc.
Hope this helps to clarify. If I'm wrong in any of this, please tell me as I'm always willing to learn and would hate to pass on misinformation.
Ken