I’ve been doing a lot of HTML and CSS recently, and checking that pages appear and behave the same in different browsers can be a bit of a pain. Fortunatley, there are several toolbars that can be used to make this process easier.
Internet Explorer
-
Developer Toolbar
This is a toolbar for Internet Explorer versions 6 and 7 that adds a DOM and CSS explorer and editor, as well as tools for viewing pages structures and various type of validation. -
Web Development Helper
This is similar to the Developer Toolbar above, but geared more for ASP.Net. It features several browsers for view state, caches, header and response details and call stacks, as well as a DOM explorer.
Firefox
-
Firebug (also here)
This is an extension that adds a CSS, HTML, Javascript and DOM monitor and editor to the browser, as well as a request monitor and a element inspector. -
Web Developer Toolbar (also here)
This is a toolbar that adds lots of utilities and tools, including validation and page information and outlining. -
HTML Validator (also here)
This is an extension that adds an HTML validator to the browser that validates pages in real time and displays warnings and errors in the page status bar. -
Dust-Me Selectors
This is an extension that enables you to inspect CSS style sheets for selectors and styles that are loaded but not used when browsing pages. Useful for consolidating style sheets after a site redesign. NOTE: this didn’t install properly using the xpi file, but worked following a manual install. -
Modify Headers (also here)
This is an extension that enables the viewing and modification of HTTP headers. -
User Agent Switcher (also here)
This is an extension that allows the configuration of custom user-agent strings and enables switching them whilst browsing. -
IE Tab (also here)
This is an extension that allows the viewing of pages using the Internet Explorer rendering engine, but within the Firefox application. -
IE View
This extension is similar to the IE Tab extension above, but will open Internet Explorer as a separate window instead of embedding it inside FireFox. -
IE View Lite (also here)
This extension is a rewrite of the IE View extension above, but written to be more compact and lightweight. -
Opera View (also here)
This extension is similar to the IE View extension above, but will open pages in Opera instead of Internet Explorer.
Opera
-
Web Development Toolbar & Menu
This toolbar and menu set add a set of menus and a toolbar. The menus contain quick links directlry to HTML, CSS, DOM, JS and Unicode reference information. The toolbar adds tools for inspecting page contents, validation, page source viewers and form manipulation. -
Opera Developer Console
This tool adds a button onto a toolbar that when clicked opens a windows containing a DOM, JS, CSS and HTTP browser for the current page.