In this third installment of the All About Speed series, I'm going to discuss the effect of HTML on speed.  Now, I know most of you are thinking how much effect does HTML have on load times.  A LOT.   We have already looked at the time it takes for content to be generated, and the time it takes for it to reach the end users computer, but what about the time it takes to render?  A poorly formated HTML file can take SECONDS to load in a browser (if not more).  Sure, it may display how you want it to, but what does that matter if the user has already gotten bored and gone to another page?

Validation

        The first step in producing a page that will load fast, is validating both the HTML and the CSS (this holds true for XHTML as well).  Valid markup will allow the browser to start rendering imediately, rather than trying to figure out what the file means.  This hold true for search engine rankings as well.  A valid site will rank higher (all other things being equal), than an invalid site.  There are several validators available on the internet, but the best (and free) on is the W3C's HTML validator.  Validating dynamic sites (such as Joomla) is MUCH more difficult than a standard HTML page, but it is necessary that it's done! 

Beware Of Tables

        Tables contain great power in both xhtml and html.  Many people will tell you to stay away from tables, which I'm not going to interject upon.  The point I am going to make is that if you do use tables, there are a few things you need to do to make sure that they load fast.  The first thing to keep in mind, is that anytime you use a table, ALWAYS set your width in the table AND all child elements (TD/TR/TH/etc).  By setting the width, the browser can start rendering the table as it downloads it, without waiting for the entire table to be in memory first.  Remeber, your goal is to have a site that gets useful content to the user in under 5 seconds (preferably in under 1 second). 

Size Your Images

        Another commonly overlooked issue occurs with images.  No matter how small the image is, ALWAYS set the width and height attributes of that image.  This has two benifits.  First off, some browsers won't even render the rest of the page until it knows the dimensions of an image.  For the rest of the browsers that do render the page, when that image finally loads it will shift content when it knows the size of the image.  Nothing is worse (to me) than reading something and having the content shift while in the middle of the line.  You want your site to load as a framework that fills in as it loads (ideally it should load almost instantly). 

Beware Of File Sizes (And Numbers)

        Back in the first part of this series, we talked about the bandwidth that you have direct control over.  There is another side to bandwidth, and that is the users link.  If a user is on 56k Dialup, than there are only two ways for you to provide them content.  You could optimize and minimize your images, or you could give them a page that says "I don't care about you, so don't visit this site"!  Look at Google's home page.  That page will load in under 1 second even on dialup!  Now, I am not saying you need to make your site as minimal as Google's, but you do need to take care to not limit your site to broadband only users (unless you have other reasons for doing this).  A good source to check how your site behaves is The Web Site Analyzer.

Conclusions

      Well, there you have it.  The end of the three part series All About Speed.  If you remember anything, make sure it's that you need to keep your web pages fast to keep your visitors coming!  Without visitors, what's the point of having a website?  And remember, I'm not saying your entire page needs to load in 0.5 seconds to be good.  What I'm saying is that you want to get USEFUL CONTENT to your user in under 5 seconds (under 1 second is optimal).  Don't make your users wait, and they'll reward you!  Thanks!

All About Speed - Part 1 (Bandwidth Demystified)

All About Speed - Part 2 (Generation Time)

TrackBack URI for this entry

Comments (1)

WOA
written by bobthebob01, May 18, 2007

wao, this serie of articles are really interesting. I would love to read more actually.
Do you have any book to suggest talking about all this.

good work!

Name

Email

Website

Title

Comment

Write the displayed characters

Add Comment