Wednesday, July 25, 2007

Sharper image

We felt the need to re-visit the matter of re-sizing your graphics for use on your website. There are photographs being used that appear to be a little grainy. These are typically identified in the hair where sparkles and streaks will appear. There may also be unnatural highlights or shadows on the forehead or cheek.

WebCubic uses technology that automatically resizes graphics to fit into a preconfigured area. Even custom website users will pre-determine the size of the area to display a graphic.

However, your source graphic is, in almost all cases, much larger. As digital cameras take higher resolution photographs, this challenge becomes greater.

As we said already, WebCubic automatically resizes graphics to what the page requires. At times, this may result in a slightly "grainy" appearance when the graphic is reduced in size. To get a sharper image, you must manually reduce the size of the graphic before loading it onto the website. This will provide a better image as well as reduce the file size of the graphic being shown on the website.

Here's how to do this.

(1) Determine the actual size of the graphic on the website.

You can do this by putting the cursor on top of the graphic and doing a right-mouse-click. Click on "Properties". Write down the "Dimensions" - it will be something like 250 x 200 pixels.

(2) Start the Windows Picture Manager (or other graphics tool) then open the graphic file.

(3) Look for a menu task to "resize" or "stretch/skew" the image

(4) If you can specify the image pixel size, do that. If you must do this by percentage, then adjust both the horizontal and vertical by the same percentage. Your objective while doing this is to maintain the same "aspect ratio". If you don't then the image will become stetched too much either vertically or horizontally. You'll have a sharp image but it'll also make you look like you're walking through the old "house of mirrors".

(5) Physically compare your results with the image currently shown on the website. They should be approximately the same. If it varies too much you will again end up with a "grainy" look.

(6) Save the image by using the "save as..." option and rename it.

(7) Go to your website administration functions and upload the NEW photo or graphic.

(8) When you view your website, the photo or graphic should be as clear as the original image - just smaller