Firebug alternatives

Most designers have heard about Firebug for Firefox. But what is you are a designer that does not use Firefox, are there any alternatives for Internet Explorer or Opera? Well there are alternatives for each.

Internet Explorer

If you are a designer that likes using Internet Explore, or like a lot of designers you are forced to design for IE since a large amount of web surfers still use it. There are a lot of alternative for Firebug. The Microsoft Developer Network has a blog entry just for such tools. Like most products for anything created by Windows, some of the tools do cost money, but Microsoft has created a similar tool that you can use. The Internet Explorer Developer Toolbar allows you to much of the same things that Firebug does also. Here is a list of things you can use the Internet Explorer Developer Toolbar for according to the download site:

• Explore and modify the document object model (DOM) of a Web page.
• Locate and select specific elements on a Web page through a variety of techniques.
• Selectively disable Internet Explorer settings.
• View HTML object class names, ID’s, and details such as link paths, tab index values, and access keys.
• Outline tables, table cells, images, or selected tags.
• Validate HTML, CSS, WAI, and RSS web feed links.
• Display image dimensions, file sizes, path information, and alternate (ALT) text.
• Immediately resize the browser window to a new resolution.
• Selectively clear the browser cache and saved cookies. Choose from all objects or those associated with a given domain.
• Display a fully featured design ruler to help accurately align and measure objects on your pages.
• Find the style rules used to set specific style values on an element.
• View the formatted and syntax colored source of HTML and CSS.

There are reports that this tool was so useful that IE 8 will have it built in, instead of a separate download. For the full list of similar tools check out the MSDN Blogsite.

Opera

Opera, unlike FireFox and Internet Explorer, has a built in developer tool since version 9.5. This tool is called Dragonfly. To access Dragonfly, you can either press Control+Shift+I (Mac: Control+Alt+I) or click Tools -> Advance -> Developer Tools. Dragonfly looks very similar to Firebug, and has some useful features. Unlike Firebug, Dragonfly will allow you to check sites in all open tabs, from within a single tab. This can help when you are designing a site, and you need to check the position of an elements, or you are reusing some code.

Topics: CSS, Design, Firefox, Web Development