1) Choose a professional local webhost.
Typically the closer a server is to your customers physical location, the faster
it will be able to serve them. Choose a local webhost also helps you to rank
better in the search engines, due to the fact that more and more search engines
are learning where you are located geographically and serving local results.
There are a number of dedicated websites
out there for testing webhost speed. You should investigate this thoroughly.
2) Optimise images.
Its been said before but if your images are heavy they will slow your website to a crawl. Remember to use GIF's when appropriate. If for example you have black text anti-alised on a white background , you should be using a maximum of say 8 colours. See figure 1 and 2 for a comparison of file sizes generated. Gif's aren't appropriate for everything, but when used well, extremely small, and have good clarity. The often achieve better results than JPEG's when they have been compressed, and provide your visitors with crisp clear images. Experiment with what program you use for image compression when using JPEG's some are better than others. I have seen significant differences between Fireworks and Photoshop for image compression for the web.
3) Use CSS for layout
CSS is your friend.Your website should embrace this technology or prepare to be dead in the water in the future. Webpage footprints are smaller, code is more easily maintained, and design can be completely changed without changing the content. Typically because less HTML code is needed, and the style is separated into CSS files, pages will load much faster than say using tables for layout.
4) Use Javascript sparingly
With javascript becoming more accepted in the webdesign community, developers are being showered with object orientated libraries, which are often superflous to webpage requirements. Remember less is always more when it comes to special effects. Unless javascript is being used to aid the visitor - say in the form of ajax, to improve page responsiveness then forget about it. If you really must use javascript - then make sure that you are doing so unobtrusively. More often than not though user experience is actually sacrificed when you force them to use a form which doesn't work the way they expect it to. Familiarity breeds results on the web.
5) Compress to Impress
HTML pages are typically full of white space to make code more readable. What you can do is to compress the code when it is ready to go onto a production server. This results in even small HTML pages, and is used by the major corporates such as Google to make their code footprint even smaller. Shaving a few bytes off a page can also save on bandwidth costs if you have a particularly high traffic site. Remember to take a copy of the site though - as working with compressed code is virtually impossible. There are a number of code compressors available freely on the web.
6) Image Hosting
Using a dedicated image hosting server for particularly large images which frequently get downloaded can speed a site up dramatically. These are available freely around the web. Some of the common ones include ImageShack and PhotoBucket. Disable hotlinking within a website by using an image hotlinking script. This prevents other people around the web from using your images on their website.
7) Learn Shorthand CSS and XHTML
There are plenty of guides on using shorthand CSS properties on the web, read and inwardly digest. This is always worth doing as it can shave a few kb off your style sheets. Learning all the appropriate elements and attributes of the HTML 4.0 can also help you to strucuture your code more appropriately. Ignore at your peril.
8) Avoid Classitis
Dont use classes for every element within your markup that needs a style. Remember that the very nature of CSS (Cascading Style Sheets) allows you to specify a style for descendants of other elements. It also makes your style sheets that bit smaller which will help speed up your site.
9) Externalise as much as possible.
Link to any javascript you use in an external file, inline javascript will only be beneficial on say one off pages that use it. If you need to have a javascript file on every page it almost certainly should be externalised. The same goes for CSS files. Use the link tag to bring in css files which reside in individual files. If you have multiple CSS files, it is also worth considering putting them all into one file, the less requests that your website makes for files, the better. Remember it is faster to request 1 file at 100Kb than say 5 files each at 20Kb each. Externalising files will aid with browser caching.
10) Use lowsrc images
The lowsrc attribute of the img tag allows you to specify a faster loading version of the image. This is typically an extremely compression version of the final image which will render in the users browser before any content loads, which allows them to view the content whilst the images start loading. Alternatively use progressive JPEGs which will give the same effect, loading more and more image clarity gradually.
11) Cache in hand
If you run a database driven site, information should be server side cached as much as possible. Real-time data such as stock quotes or banking information cannot be cached, but generally most forms of web content doesn't change that frequently. Caching minimises server load, and speeds up subsequent requests for the information.
12) KISS
Keep it simple stupid. Do you really need that flashing graphic on your homepage? Would a static one function just as well to communicate your message? Often the things that annoy your potential customers are the things that slow a site down. E.g. flash for the sake of flash, sound files which load automatically and heavy graphics. Remember that on the web, it is never easier to leave your site and find someone elses. Provide your visitors with the content they want and they will be happier, and come back to see your fresh content.
Want a free website speed consultation? Click here?
All content © Webdistortion.com : 
