A tool I've found useful at both work and home is the Mozilla plugin Firebug. At work, since it gives you a JavaScript debugging environment that is far superior to the built in we use it to figure out how things are working. Being able to examine variables and call functions from the console command line inside Firebug has made troubleshooting problem JavaScript wildly easier than it is any other method. For this alone, it would be a keeper.

It also does CSS debugging, after a fashion. It will show you the structure of your webpage, and as you hover over the HTML, it will both show you the stylesheet that controls that particular chunk of the page (including the main and inherited bits) but will highlight it on the page itself. Really, it has to be seen to be believed. What tweaks I've done to my new template successfully were all done with that. Before I had this tool, making any effort to debug CSS was a wild crapshoot. I couldn't always tell what DIV was in control where or what part of the page it controlled. Now that's trivial. If you do any webpage development at all - including customizing your blog's template - this is a download you need.