There will come a day when everyone has fast access to the Internet but as it currently stands the majority of users are still connecting with modems and spending a lot of their time online patiently or, more likely, impatiently waiting for pages to load. 

Statistics show that, without a compelling reason, the average user will not wait for much more than 10 seconds for a page to load. It is up to us then to ensure that they get some results in that time. The guidelines provided by FrontPage about load times are very useful but may not always be accurate. For one thing those connecting to the Internet via a modem very rarely actually achieve a connection speed of 56.6 kbs in the real world.

Load time should be constantly in the back of your mind while you build your site. Building it first and then trying to pare it down later is doing things the hard way. These tips may help you to design pages that load quickly and smoothly and to use a few 'tricks' to help with trickier areas of loading.

Using Tables Efficiently

Tables are still the most reliable way to lay out web pages but misuse of tables can seriously add to the time it takes for a page to load. 

When a browser is faced with displaying a table it needs to get all information about the entire table before it can display any of it. The effect of this is that if you put your whole page inside one large table nothing will appear on the screen until everything has loaded. This leaves the user staring at a blank page.

There are a number of things that can make your tables easier for a browser to read and load.

1. Stack Your Tables

Stacking your tables, that is placing one table on top of another, is a good way to overcome this. For example a typical page has three areas - header, body and footer. If each is in a different table then the header part of the page will appear as soon as the browser has read the first table, followed by the body and finally the footer. Even if the main part of the site, the body table, is a little slow the user will have the header to look at and to give them hope that there is more to come!

In fact it will take the same amount of time for the three tables to appear as it would have if everything was in the same table but it will seem faster.

There is no need to stop at just breaking the page into three tables. If you have a page that is unavoidably long there is no reason not to break it into chunks and display each in separate tables, one stacked on the other. This means the user can start reading the first part of your missive while the rest gets on with loading.

2. Do Your Math

It is important that the browser can clearly understand the structure of your table and for this to be the case the table and cell widths must add up correctly. 

Another thing to watch is using images in cells too narrow to hold them. For example if you have an image that is 320 pixels wide and you put it in a cell only 250 pixels wide the browser will load the table, then realise the image does not fit and have to redo the thing again. What will happen, and I am sure you have seen this, is that everything will disappear for a fraction of a second while the browser recalculates how to display this anomaly.

3. Don't Nest too Deep

Nesting tables, that is placing a new table inside a cell of another one, is a very useful technique in laying out pages but it can be overused. Some people issue commandments about never nesting tables but it is not necessary to be so absolute. Certainly if there is a simple way to display something without nesting it, go for it; if it is simpler to nest, then nest. 

Taking nesting to extremes though, where there are tables within tables within tables, will create problems. The browser will need to get all the information about all the tables before it can render any of them and this can be very slow indeed of the structure is really deep.

Anytime you need to use tables nested more than one deep ask yourself if there is a way to do it using stacked tables or by simply splitting cells in existing tables.

Avoid Load Hogs

Java Applets, Flash, JavaScripts and so on are all elements we often use to add interest or functionality to a page. Aside from other issues related to their use all of these can add considerably to load time and this extra time will not be reflected in the load time estimates in FrontPage. 

One route to speed is to avoid them altogether but this is a bit absolutist for many sites. What is necessary is to use them judiciously and with consideration for your users. If they add nothing to your site, or if their inclusion so slows load time that the benefit is negated, then lose them. 

Even if they are genuinely of value keep such features to a minimum on any single page - a page with a news ticker, a flash animation and heavy dependence on JavaScript may load fine for those with cable access but it will be a real burden for those with modems.

It is tempting to add these sort of features to your home page as a 'draw' for users. However your home page is almost certainly also the main entry page to your site and thus the page where load time matters most. Bear this in mind when deciding to add anything extra to it.

Part II: Images and Load Times >>