Debugging Web Pages in IE

Tricks for debugging web pages under IE, if you don’t have any tools.

  • Comment out all but the code that doesn’t work. Often the code that’s not working is broken because of something else.
  • Have a separate CSS file, just for IE
  • Use alert to halt javascript execution. This lets you see which command was executed prior to the failure.
  • If you have a complex page, use View Source, then paste the text into a file under vi. Use grep “<div” | wc -l, and grep “</div” | wc -l to count the number of open and close divs.
  • If you are using a template language such as Smarty, hard-code values for quick tests.
  • Be sure to clear the cache, aka delete the temporary Internet files. Otherwise, CSS and javascript changes may not take effect.
  • Refer to w3schools.com to check for supported attributes for various browsers.
  • Be creative. If .style.display=’none’ doesn’t work, try removing the node.
  • Limit the versions of IE you will support, and alert the user. IE6 is a good starting point.
  • Accept some problems. For example, IE6 and Apache sometimes have trouble with .png transparency. Either make those images a different filetype, or allow them to display as the server delivers them and the browser displays them. It is not worth striving for perfection to support software that will eventually become obsolete.
  • Use server-side logic to deliver the best code for the browser. Again, this should be limited to that which is absolutely necessary, but it is often easier to prepare the page well on the server, than to adjust it once it has been delivered to the browser.
  • Use FireBug. It is bundled with dojo, and probably available as a stand-alone component.