Improve Site Performance Increase Site Traffic Monitor Site Uptime Webmaster Resources NetMechanic Home Looking For Help? Partner Programs Privacy Policy Contact Us Press Room
NetMechanic Home LOGIN | HELP | ABOUT US | PRODUCTS | SITE MAP
NetMechanic Menu
Over 52 Million Web Pages Tested!     
 

Search for:


Your Email:

I would like to receive my newsletter in:
HTML format
Text format



Volume 8 (2005)
   September
   June
   April
   March
   January

Volume 7 (2004)
   November
   September
   July
   June
   May
   April
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 6 (2003)
   December
   November (Part 2)
   November
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June (Part 2)
   June
   May (Part 2)
   May
   April (Part 2)
   April
   March (Part 2)
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 5 (2002)
   December (Part 2)
   December
   November (Part 2)
   November
   October (Part 2)
   October
   September (Part 2)
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June (Part2)
   June
   May (Part 2)
   May
   April (Part 2)
   April
   March (Part 2)
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 4 (2001)
   December (Part 2)
   December
   November (Part 2)
   November
   October (Part 2)
   October
   September (Part 2)
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June (Part 2)
   June
   May (Part 2)
   May
   April (Part 2)
   April
   March (Part 2)
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 3 (2000)
   December (Part 2)
   December
   November (Part 2)
   November
   October (Part 2)
   October
   September (Part 2)
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June
   May
   April
   March
   February
   January

Volume 2 (1999)
   December
   November
   October
   September
   July
   June
   May
   April
   March
   February
   January

Volume 1 (1998)
   December
   November
   October
   September

 

Load Time Tip:
Using HEIGHT and WIDTH

by Tom Dahm,
Chief Operations Officer,
NetMechanic, Inc.

  
January 1999
Vol. 2, No. 1
 • HTML Tip
 • Load Time Tip
 • Search Tip
  

Have you ever waited for a slow Web page to load, given up, clicked the browser's "Stop" button, and then suddenly seen the page appear? Where was it all that time? Pages like that are a good example of how your HTML tags can affect your page load time.

By now nearly everyone knows you should use HEIGHT and WIDTH attributes for your image tags. Using these attributes lets the browser allocate space for your image within the page layout. That way the browser can render the rest of the page, leaving a placeholder for the image while it's loading.

HEIGHT and WIDTH attributes for your TABLE and TD tags are just as important, for exactly the same reason. These attributes tell the browser how much space to allocate for each table cell. Without them, the browser waits until all the table's contents have been loaded before rendering any of its contents.

Here are a few rules of thumb:

  • Use the WIDTH attribute for all your table cells.
  • If possible, try to use the HEIGHT attribute for table cells. But be careful with this attribute as explained below.
  • Avoid nesting tables if at all possible. Nested tables can dramatically increase your rendering time. If you must nest tables, be sure to use the HEIGHT and WIDTH attributes, at least on the inner table.

Setting the WIDTH attribute for a table is most important in the first row, since the browser uses this row to set the column widths for all the other rows. Likewise setting the HEIGHT attribute is most important for the first cell within each table row, since this sets the height for the rest of that row.

Use of the HEIGHT attribute for tables and table cells is a bit risky, since you don't know the size of the browser's default font. If you plan your table layout assuming everyone is using a font size of 12 points, your page may not be rendered correctly for visitors who've changed their default font. Visitors who've set their browser font to 14 points may see text spill over from one cell to another because the text can't fit into the space you allocated.

There are two ways around this:

  • Test your page with your browser's default font set to a larger value.
  • Use the FONT tag and SIZE attribute to set the font size for each table cell. Use absolute values, such as "SIZE=2," not relative values, like "SIZE= -1."

If you follow these rules, the HEIGHT attribute should be safe to use.

To change your browser's default font follow these steps for Netscape Navigator:

  • Under the "Edit" menu, select "Preferences."
  • In the Preferences window, select "Fonts".
  • Set the size of the "Variable Width Font" to be some larger number.

Follow these steps for Microsoft Internet Explorer:

  • Under the "View" menu, select "Internet Options."
  • In the Internet Options window, click the "Fonts" button at the bottom of the window.
  • Set the "Font Size" to be "Larger."

Try this and see how it affects your tables. Getting your table height just right may take a few tries, but the payoff in improved load time should be worth the trouble.



Rate This Tip:
Not Useful Useful Very Useful   
 
NetMechanic Tools
HTML Toolbox
Browser Photo
Server Check
Search Engine Starter
Search Engine Tools
GIFBot
Newsletter
HTML Tutorial and Tips
Search Engine Tutorial
Accessibility Information
Browser Problem Tutorial

Company Info
Products
About Us
Contact
Advertise
Link To Us
Jobs
Privacy Policy
Partner Programs
Press Room
RSS Feed
Support
 



Powered by Overture!

 
     
 
   
 
     


Keynote Home
Copyright © 1996-2007,
Keynote NetMechanic
All rights reserved.