I have encountered surprised issues when I developed Bookmark Manager 2.0. They were solved successfully after I spent a significant amount of time. To share my ideas and thought with friends, I summarized the processes and generated a list of a good practices as the following.

HTML/XHTML validation

It will always be a good practice to validate your webpages after the alpha or beta version of your website is built. If the XHTML format is adopted, the practice is more important. To do that there are a couple of choices:

I personally like the first one. It can provide a lot of detail and easy to understand. You should check your code to correct all the errors based on the validation output. After all errors are fixed, your pages are more stable than ever. When you adopt XHTML, the most common error is the close tag, for example, <br /&gt vs <br>, <script ….><script> vs <script …. />.

CSS validation

As the html page can be validated against standards, CSS also can be validated. It is always wise to validate your CSS styles and fix any errors or warnings. That will help your users and search engine bot. The website that provides service to validate CSS is: http://jigsaw.w3.org/css-validator/

JavaScript

Problem A: JavaScript does not run in IE and FireFox while it works fine in Google Chrome
Solution: Use encodeURL function to encode URL parameter in xmlhttp2.open(“GET”,url,true) statement, such as “xmlhttp2.open(“GET”,encodeURI(url),true);”.

Problem B: After the above changes, Opera, Safrari, IE, Chrome but FireFox are working properly. It is hard to find what was wrong in FireFox before I get FireBug extention. The problem is that FireFox cannot use the form name to refer the html element, such as “searchform.keyword.value”.
Solution: To solve the problem, have to use the “document” object to get it, for example, “window.document.forms[“searchform”].elements[“keyword”].value”. After the change, the JavaScript works fine for all major browsers: Chrome, IE, Sarafi, FireFox, and Opera.

Debugging Tools

FireBug is a great tool to debug the css, html, JavaScript and more.

Share

Tags: , , , , , ,