test and optimize your website

24 Apr 2010

You are at the last stage of development, the beta stage. Your website needs to be tested. This is an article referencing to useful tools and methods to optimize the speed and the visual uniformity.

First of all the W3C Validator

Do not be scared from all these errors and warnings on the validators. Look carefully, some warnings have to be that way in order to achieve cross-browser compatibility.

You may want to go down deeper. Use Firebug to inspect HTML and modify style and layout in real-time (and many more). Save them, upload, revalidate.

Be sure that you read and applied the "best practices for speeding up your website"
http://developer.yahoo.com/performance/rules.html
I strongly suggest to read the follow and check on them first
a. CSS Sprites
b. Serve gzipped html 
c. Optimize images, do not resize/scale them via html, upload them at the resolution you want the to be used
d. Do not use iframes at all if you can
e. Minify JavaScript and CSS
Check the results using Pingdom or Yslow

Visual uniformity
. Check your website's rendering on the most used browsers  - browser versions  (and the latest too). Install them and use also the Browsershots service (use even this http://www.opera.com/mobile/demo/ ) Do not panic on errors. It is usually a simple change on your css. Check your (x)html document type, check the w3c validator results, isolate the problem with the help of the Web Developer Toolbar . If it is not so obvious, google it.

Optimize, Reapply