Home Categories Design Tutorial

Web Design - A Quick Loading Site

2.7/5.0 (3 votes total)

Nasir M
September 26, 2006

Nasir M
Nasir is a well-known internet consultant and developer with Naxtor Technologies - a web design and web development firm in Sydney Australia
Nasir M has written 1 articles for WebKnowHow.
View all articles by Nasir M...

Do you want your site to load quickly? If it is your personal homepage, it may be a big deal to you. If you are trying to run a business, or offer people important information, this can be very important. If your front page takes a great deal of time to load into a browser, then you may want to do a little redesigning to increase the number of visitors that decide to stay at your site.

Let's start with the obvious bandwidth hogs: images and other media. My suggestion here is to take out every form of multimedia embedded in you front page except for images. Sure, a background song can be nice, but these sound files can take up a great deal of bandwidth, especially if the sound is a .wav file. (I made a 30 second .wav on my computer- It came out around 140K). Videos can be even more taxing, (1 MB or more at times) and should probably be avoided unless absolutely necessary. As a surfer, if I have to wait more than 10 seconds for something like this to load, I'm tempted to hit "Stop" or "Back". So if you use these, keep the file sizes small (Probably 30-40K or less would be OK). Better yet, save them for a later page.

First, remember that not everyone has a T1, cable modem, or ISDN connection to the internet. In fact, there are still a large number of surfers with modems less than 56K. So, as web designers we must see to it that our sites load as quickly as possible without losing anything important.

Your images will be your next big worry. These can also get quite large, so caution is necessary when dealing with images. For starters, do not make an image any larger than you need it to be for the effect you desire. If you have an image that is 600 pixels x 600 pixels, your page could take forever to load. One of the easiest ways to reduce the file size of your image is to simply give the image smaller dimensions. Go to your image editing program, and resize or resample your image to make it smaller. You can also compress your images using special services on the web which reduce the file size of images for you, and let you choose the images that still look good once they are compressed. There are links to an image program, an image rendering tutorial, and image file size reduction services at the bottom of the article for you.

Another trick you can use is to define the width and height in all of your image tags. This way, the browser knows how much space the image will use on the page, and will not have to adjust everything once the image starts loading. It will save a little time, and will also keep the page from jumping when an image loads.

After you have the images as compact as you can make them, you can save loading time on other pages by using one or more of the images from the front page on other pages. The image you loaded for the viewer on the front page will be in the browser's cache, and will load instantly when it is called on your other pages! This will allow you to load other things you may need without needing to worry about the image again.

Finally, be sure your front page is as short as possible as well. A longer page can take a long time to load, even if it is all text. Put extra information on another page and use a link for people to go view it. You will save a little extra time, and maybe reduce clutter a little bit.

Well, I am done thinking for today, maybe I'll have a few more speed tips for you in a future article. Until then, have fun with your speed enhanced web sites!

Add commentAdd comment (Comments: 0)  



Related Resources

Other Resources