Larry's Graphics Web Design






Banner Factory



Why images?

The reason for that is, I think, pretty obvious. A web page with only text is rather boring.
Images (or graphics) are necessary to lighten up the page and make it more enjoyable for the
visitors. However, using too many or too big images slows down the loading time of the page
and can result in visitors hitting the back button.

The number of images on a page vary and depends very much on what your site is about. If you
have visited my photo site you may have noticed that I use quite a few images there (not including
the photos). You may also have noticed that most of the images are fairly small and therefore don't
slow the page's loading time down too much.

Regardless of the number and size of the images it is important that they have some connection to
what the site is about. On my photo site the majority of the images have something to do with
photography. Apart from looking great (oh, well) they clearly show what my site is all about:
Photography. If I should place a picture of a car there it would look out of place since my site has
nothing whatsoever to do with cars.

Check out my photo site by clicking the banner!








Photos and thumbnails

Since I have been going on about my photo site I will start with telling a little about using photos.
As you might have seen I am using thumbnails in my photo galleries. Since thumbnails are small (although they don't really have to be) they load fast and you can have quite a few on one page

There is really no need to have your photos loading in full size. If the photos are big (most photos
are) your page will undoubtedly take a fair amount of time to load. Using clickable thumbnails your
page will load much faster. I know I have said that already but it is important especially if you
have more than one page with photos.

This is what a common thumbnail looks like

This is the size of thumbnail I use in my galleries. Needless to say a picture this small loads fast
which is essential since I have about 24 galleries. The full size photo you get when you click the
thumbnail (not this one!) covers most of your screen (if you use a 800x600 resolution).

If you only have a few photos on the page there is really no need for a thumbnail this small.
Below are two examples of larger thumbnails

I strongly recommend the use of thumbnails, just keep in mind that they need to be uploaded
also. Note: I will not go into how to link photos and other images to web pages because there
is a whole page here dedicated to that subject.

Other kinds of images

Far from all web sites have photos on them but most, if not all, of them have some kind of
graphics: Buttons, bars, titles, logos and of course banners (I use them all, as you might have
noticed). Graphics as well as photos need to be fairly small to prevent the page from taking too
long to load. Still, even if the images are small too many of them can slow the loading down

Even if the images on a page look great individually they may not look all that great put together.
Therefore, some sort of theme is needed (in my photo site the theme is photography). The colours
are also of great importance (See the colours page). If you use animated images don't put too
many on one page. It will only distract the visitors attention, and it can also be very annoying.

GIF images with transparent background are nice. Whether you make them yourself or get them
from the Net there is one thing you should be aware of: The colour used for the background.
Although the background is transparent the pixels closest to the image still holds the background
colour. Take a look at these cool GIF images.

These are the same image saved with different background colours. The one to the left has a dark
background colour which, when placed on a page with a light background, gives the image a rough
and ugly looking edge. The image to the right has a light (actually white) background and blends in
nicely. If we place the images on a dark background we get a reversed result.

As you can see it is now the one saved with a light background that looks rough and ugly.
Therefore, when saving images as GIF:s make sure you give them the same background
colour as the page you are going to use them on. If you have got the image from the Net you
will have to save it as a .bmp and use a program such as MS Paint to remove the disturbing pixels,
and then save it as a GIF again with the right background colour. Of course, you can also change
the background of the page to match the one of the image.

Some words about graphic formats

The most common format used is probably GIF (Graphic Interchange Format). It only supports
256 colours but they are dynamic, which means that if you save an image that contains only 16
colours the GIF image will only contain these 16 colours and you will get a smaller image as result
of that. GIF is also a lossless format which means you can save and resave a GIF image without
any loss in quality.

Almost as common and popular is JPG or JPEG (Joint Pictures Expert Group). It supports up to 16
million colours which makes it a perfect format for photos. The compression is also harder than GIF,
but you can adjust the amount of compression to suit your need. Just remember that JPG is not
lossless so the harder you compress an images the more the quality suffer. You also loose a little
in quality every time you resave a JPG

There is also a third format which deserves to be mentioned here. I am referring to PNG (Portable
Network Graphic). It is lossless like the GIF but supports just as many colours as the JPG. Like the
GIF it can also be made transparent. Surprisingly few web hosts supports this great format but I
think that will change as it becomes more and more popular.


-- Close this window to return to the main page menu! --