When I am optimising I always go with the lowest common denominator which tends to be 56k. Very few people use 28k as a standard phone line is 56k, so that is how I will go. If you want to know about using the internet at 28k just ask Tom wink.gif
So the larger the page, the longer it takes to transfer to the user. Easy then, we just need to get the page size (in kb) down to as small as possible.
The main things to target are:
Images (nearly always what slows a page down)
Javascript (it can be suprising how large files can be)
tables ('whats that?' you say, 'tables? are you mad?')
Before I tell you how to shrink your pages you should go to the following site, put in your pages url and see what time comes up for a 56k modem.
website optimization's analyzer
You should then scroll down the page and find out which files are the largest on your page. Any image over about 8k should be simple enough to optimise, but most images can be shrunk.
So first comes first, images.
There are three types of image you can use online. jpg's, gif's and png's.
Avoid png's. They are clever and smaller than jpg and gif format but some browsers cannot see them, and thats not good is it?
So we are left with two jpg and gif, and believe it or not, that is how it is going to stay. The fastest websites always use a combination of both. gif's are smaller when you only need a few colours on an image. jpg's are smaller when you want lots of detail and colours.
How do you know when to use which? Simple. Go to the following page and either put in the url of the largest image you got from the link above or if you have the same image on your computer you can save yourself bandwidth and upload it from there.
dynamicdrive's image optimizer
First choose the same format the the image currently is. When the results appear, use your keen eye to decide which is the best without too much loss of quality. Look to the left and see what the % saving is.
Next choose the other format (jpg if the originals a gif and gif if it's a jpg) and check the results again. Then see the saving for that. Which ever % saving is the largest is the format for you. So redo the check and when your happy you have the smallest and best image right click the image and save it to your computer.
Saving as the same filename as the original is good because you then don't have to change your html too much. If it has changed from a jpg to a gif or gif to jpg then you will still have to change your html though.
Do this for all images on the page and then change all your html, finally upload all the image and then the file (to save on missing images). You can then delete any old images from your webspace.
Javascript. There is not much I can say about this other than, if you can possible do without a lot of javascript on a large page then try and do so. I use one script that is nearly 15Kb and it doesn't help much on large pages so I remove the function it does just for that page.
Tables. Well here it is, if your confused your about to find out why tables are going to slow down a page. It is as simple as the number of characters they use.
<table><tr><td></td></tr></table>
is 33 character while
<div></div>
is 11.
On a large page that can make a massive difference, especially as and webdesigner worth his salt knows that your tables are more likely to be
<table border="0" cellpadding="0" cellspacing="0"><tr><td></td></tr></table>
which is a massive 76 characters!
If you can be bothered or you're really struggling with the size of pages then learn how to use <div> tags!
Hope your pages are now flying onto the users screen.
| 