Wednesday, April 25, 2007

Tips for debugging your web pages

After building your site, it comes the hard stuff: testing and debugging the page. There are a few rules that you can follow to make your life easier:
  1. Make sure that you spelled everything correctly (for example img is not written igm)
  2. Make sure that the Doctype of your pages matches the (x)html you are using (for example if you use deprecated tags in your code, you should choose (x)html transitional instead of (x)html strict).
  3. Follow the rules of nesting. If you open a <p> tag and then a <a> make sure that the closing </a> comes before the closing </p>
  4. Avoid the use of non-standard tags as they may lead browsers to conflicts.
  5. For elements that have content avoid the use of <p ...... /> and prefer <p> ...... </p>. Both of them are valid (x)html but the first may cause problems to some older browsers. Use the first method though for elements that are empty or contain data, for example <img src="picture.jpeg" alt="picture" />
  6. Validate your code using W3C's validator. If you see a lot of mistakes to your code do not panic, as a missing closing tag can cause the validator to show lot of mistakes. Begin from top to bottom, correct few mistakes at a time, validate again and continue correcting after with the remaining mistakes. Tip: Make sure you use a correct Doctype before you validate your markup!
  7. Download the most famous and common used browsers (Firefox, Internet Explorer, Opera) and see how your site appears by yourself.

No comments: