Testing Browsers - HTML5Test & CSS3Test

Sometimes your web application doesn't work and it might not be your fault, sometimes it is the browser's fault. No browser supports every feature of  HTML5 or CSS3. 

Determining which features your phone's browser supports use to be tedious. You would have to write code to test each feature you were interested in. If a test failed you would have to double check your code to be sure that it was written correctly. Luckily we don't have to do that any more. Nowadays there are websites available which will exercise nearly all of a browser's features. All you have to do is type their URL into your browser. My two favorite test sites are also super easy to memorize: HTML5Test.com and CSS3Test.com.

Both do exactly what their names say. They test your browsers implementation of HTML5 and CSS3 feature respectively. This is really important to do while your site is still in the design phase. You can see if see if your desired features are supported by your target devices. 

Here are pictures of HTML5Test.com running on my iPhone (iOS 5.1), Nexus One (Android 2.3.6), and Samsung Focus Flash (WP7.5):

HTML5Test.com uses a score based system. The maximum possible points is 500. As you can see there is wide differences in the scores. The Focus Flash while a great little phone definitely has some issues supporting higher end browser features.

CSS3Test.com uses a percentage based system. The maximum is 100%, obviously none of these phones is close yet. Be sure to try these sites in your phones browser.