wildepages.com for newbie web builders

Graphics, graphics tools and image manipulation

The subject of imaging / graphics tools is highly subjective and highly complex. Somebody wanting very high end graphics and photo editing will probably recommend the Adobe Photo Shop suite of tools (at around £600 / $1000 this seems a bit steep to be starting with plus the learning curve is parabolic!).

A more realistic suite would be JASC Paint Shop Pro (about a tenth of the price, not as many photo manipulation applications but still a pretty sharp learning curve). However, as a newbie you do not require these levels of esoterica.

If you are using Microsoft works, then you should have Photo editor in the tools section. This is actually a very good piece of equipment with all the elements you should need for simple editing of photographs (cropping, re sizing, colour correction, general touching up and beautifying). You can convert photographs to jpeg/jpg or gif formats from their native bmp format. Graphics can be converted from jpeg/jpg to gif for size reduction.

At this juncture, let me briefly explain what bmp, jpeg/jpg and gif formats are:

Bmp is a bitmap and is the largest form of image storage format. Typically a bitmap image has the maximum number of colours available incorporated in the most dense concentration. There is a hell of a lot of information per square inch. This is fine for printing a good quality picture onto paper but murder to use on a web page.

Loading the logo at the top of this page, using a standard 56kbs modem, as a bitmap would give the average visitor time to go and make a cup of coffee! Most visitors are not that patient.

Which brings us to jpeg/jpg, which stands for Joint Photographic Experts Group. This is a format for saving images that trades off a little bit of quality for a large reduction in file size. The number of colours used and density of the colours is much less than a bitmap, but a respectable picture still emerges.

In 'logo' terms you have time to switch the kettle on before it loads. However, for small images it is pretty quick, so shout for someone else to make the coffee!

Which takes us to gif format. Gif stands for graphics Interchange Format and is ideal for showing non-photographic images (such as buttons, logos and shapes with sharp edges) as it only uses 256 colours. The compression does not 'lose' colours so the resultant image looks very much like the image you started with (unless it was a photograph of aunt Hermoine, in which case it now looks like a rough sketch of Daffy Duck on an off day).

There are several other imaging formats, but these are the most commonly used at this time.


Graphics editors tend to be individual to their purpose and as a newbie, you probably do not know what you will need. The best that I can do is offer a selection of the tools I use and describe their particular usage.

For general photograph manipulation, I have already mentioned Microsoft's Photo Editor. If you have a web cam then you will, almost certainly, have a photo editing software suite bundled with it. The tools are going to be very similar to 'Photo Editor'. Similarly, if you have a scanner the same should apply (if you are really lucky, you will have got Adobe PhotoShare which is a quite excellent photo editing tool with jpeg conversion and an email tool). Basically though, unless you are desperate to part with large quantities of cash, experiment with the tools you have.

You will, no doubt, want a few banners, logos and buttons. In this area several products stand out for ease of use, versatility and cost.

First up is Banner Maker Pro from Gator Data. This is a very neat and tidy way of making your own banners in a very little time. By using a wizard like interface, Banner Maker Pro allows you to easily create professional looking banners, buttons, and graphics for web pages in just minutes. Simply follow the tabs at the top of the program to go step-by-step in the image making process. When you have completed the image, just save it as a gif or jpeg and use the img tag to add it to your web site. I use this tool for any quick banner or button task and would not be without it!

For a bit more complexity, but also a variation in making pure gif banners try an evaluation copy of Gif Construction Set Pro from Alchemy MindWorks. (In fact just visit the site to read the help notes - if you don't end up with a smile on your face then the world is doomed!). This piece of software is very easy to use and allows you to make both static and animated logos and banners.

For a more complicated, but incredibly rewarding, animated gif construction suite try 3D GIF Designer from Py Software. A very versatile, and relatively shallow learning curve, design tool that comes with loads of templates that can be edited and manipulated to produce your desired end product. The on-line resource centre has a rich source of new templates that can be readily downloaded to keep you more than adequately supplied with 'raw' material and you can always design from scratch. 3D GIF Designer also has a compression tool, offering various reduction variables and a preview mode (to avoid the 'Daffy Duck on an off day syndrome') that allows you to reverse the process and try compressing the image differently, it also allows you to import other graphics (in bmp, jpeg/jpg format) that can then be compressed to gif output.

For the more adventurous, though probably not for the absolute novice are AnFx from Stepahead Software, an incredible Java based web effects / animation suite and 20/20 from byLight Technologies. 20/20 is an image viewer, screen capture and annotation application. It is also capable of creating slide shows, generating thumbnails, and creating muted backgrounds for web pages and stationery. The tool is free (Ad supported) for personal and commercial use.

Realistically, with the first two or either one of the first two tools you have enough to get started on your site.


Contents Exit Here Contact:

Created on November 9, 2002

copyright©2002 Wilde Pages Ltd.,
except for JavaScript's where authorship / ownership acknowledged.