NoteMe

Not long ago, Firefox was the one and only browser for web designers. It had Firebug (screen shot), as well as quite a few other developer tools, no web designer could do without. Opera heard the masses, and responded in what became Opera Developer Tools (screen shot), which was a revamp of in-house tools used at Opera. Though it was meant as alpha quality software, it did a good job in covering the most basic usage.

Now Microsoft have released their Developer Toolbar (screen shot). Although the new toolbar doesn't add any major functionality over the Beta 2, it still feels powerful enough to be usable for an average web designer. As Firebug for Firefox, it is very intuitive and easy to use, though some functionality is missing. It can live both in the browser, as well as a stand alone window, just like Firebug. It might be me, but still after using the Opera Dev Toolbar a few times, I still can't seem to be able to make it stick to the rest of the chrome, nor stretch it to my second monitor. If this MDI behaviour is all it got right now, then I guess this will be fixed in further releases, if it is already fixed, then the setting is hidden well enough for me to give up on it for tonight.

But there is two more extensions I would like to point out for Firefox, that people seldom talk about. One of them saved me lots of work while for example styling this blog. It is not always easy to see what styling goes where on a web page. And what font is used where. One of those tools was CSSViewer (screen shot). By using this tool, it was no job to find out if it was a border that made some random blue line, or if it was some container div that was bigger than the p tag on top, or what ever went about on this blog. It gave me exactly the info I needed without me even having to look at the source for a second.

But sometimes looking at the source is the easiest and best way to get to the information you need. And then Emacs of course is a tool to rely on, but also this View Formatted Source (screen shot) extension from Firefox was invaluable for me while doing this redesign. Not only is the source formatted perfectly, but it also gives you information on the styling of each element. Why most browsers lack the possibility to format the source beats me. But at least there are alternatives for you to chose from.