Kilian Valkhof

The IE DevToolbar, a follow-up

Day’s after my original post on the IE DevToolbar, Microsoft released beta 3 of the toolbar. This post is a small update to the new functions and improvements made from beta 2 to beta 3.

The toolbar that is not a toolbar

That’s right, the toolbar now doesn’t need an actual toolbar anymore. Instead, it hides all the functions behind one button:

Once you click it, the dom selector pops up and it has the rest of the options included in it’s window. So, no more toolbar!

More CSS and source functions!

That’s right, the IE DevToolbar now has more functions that apply to css and the source itself. And they are very nice.

Source view options

The DevToolbar has 4 options to view the source: original, dom (page), dom (element) and dom (element + style). The original mode is very much like the old “view source”, with the addition of numbered rows and coloured code.

Dom (page) adds code-collapsing functions to this, which is always handy with large pages.

dom (element) views only the selected element, with only it’s parent elements. Dom (elements + style) does the same, but tells you which rules in the CSS apply to your element. In addition it also tells you on which rows it found the rules.

CSS options

The DOM explorer itself now also features all true css rules (the previous one “translated” them to internal Internet Explorer style rules), and has the option to add or delete attributes from the selected element.

When you right click one of the styles and select “trace style”, it will search for the specific style in your stylesheet. The view of this stylesheet is coloured and numbered, too.

Also new…

• A colour picker.
• The option to check multiple validation services at once.
• Show link paths in the website itself.
• a Show link report option. Which to be honest, generated a rather useless XML file.

Another great addition is the “disable cache for this domain only”-option, very useful for building a new website.

Minor Gripes

Of course, there are some minor gripes. The code view is slow. And by slow, I mean really, slow. It’s also questionable that you will use much of the code view option, given the excellent options firebug for Firefox gives us. It also seems a tad odd that they do give us the option to change attributes, but not styles. A real miss there, but perhaps ideas for a later version.

All in all

All in all, the IE DevToolbar is getting increasingly better, and it an excellent way to go about troubleshooting your websites in internet explorer. But for anything that isn’t IE specific, it’s still miles away from it’s competitors.