While inserting images in HTML always mention height and width attributes. This helps the web browser to know the image size before loading it. The browser will then reserve the area for the images while rest of the web page design continues to load, thereby reducing website loading time. Do not use the height and width tags for image size reduction.

4. Preload Your Images

You can preload some heavy images of the next pages (that can be reached by clicking on links within the current page) by defining them at the footer of the current web page. For example, img src="nextimage" height="1" width="1" inserts a 1x1 pixel image in the footer that is read by the browser when the code above it has been read. Thereafter, while your visitor is viewing your main page, images of the next page will continue to download to the viewer's PC in the background and will reduce subsequent web page load times. This is not recommended for direct Adwords landing pages because Google has recently announced that high web page load time will negatively impact the landing page quality score.

5. Optimize Flash Files

Animating important stuff can make an impact on the visitor. If possible, avoid animated GIF images in website designs; instead use Flash with discretion. Always use optimized flash files. There are so many ways to reduce Flash loading time that I will be covering this in a separate article.

B. TRIM the Code (Shapely legs ;-)

1. Remove Useless Code:

While using an HTML generator, some extra or empty tags get inserted in the code, for e.g. breaking spaces, block quotes, unnecessary extra space, blank lines etc. Even if you hand-code HTML, always manually check your website design code and remove the empty or unnecessary HTML tags. Use appropriate DOCTYPE and close all HTML markup elements. The browser will then have less work to do matching elements. Clean coding of a web page will not only reduce website load time but also increases your text-to-code ratio and search engine spiders do not have to spend time deciphering irrelevant stuff.

2. Use of Shorthand External CSS

CSS helps make your website design code compact as well as clean and its proper usage helps reduce website loading time. Define common font styles, images etc. (used in a set of web pages) in one single external CSS. By doing this, you will not have to insert the same tags again and again on different pages - just call the CSS and apply that particular class. With all your repetitive stuff defined in the CSS file, the browser won't have to read each single tag all over again. Always use External CSS file and remember to remove extra, unused styles from it.

Use smaller class names and shorthand CSS instead of putting each CSS attribute in its own line.

For example:

"body{ background: url("image.jpg"); background-color: #cccccc; background-repeat: repeat-x; }"

Above code can be written as below when using shorthand CSS:

Page 2 of 3 :: First | Last :: Prev | 1 2 3 | Next