10 tools to develop, monitor, evaluate & debug web pages

by Paul McCarthy on 1 February 2010

When it comes to developing websites and pages we could all use a little help now and then when it comes down to the real detail. Fortunately there's a wide variety of tools on offer to developers that can be of use when it comes to developing, monitoring, evaluating and debugging web pages. Here are 10 which I've found useful over the years.

Web developer toolbar

The Web Developer Extension adds a menu and a toolbar to the browser.

For anyone who uses Firefox that's interested in accessibility and CSS web development, this is an essential must-have for testing web pages!

Click here to download the web developer toolbar.

Web accessibility toolbar

The web accessibility toolbar is available for Internet Explorer.

It can perform virtually any accessibility test on a web page, such as HTML and CSS validation, colour checking, HTML structure analysis, and much, much more!

Click here to download the web accessibility toolbar.

Firebug

Firebug is an extension to the Firefox web browser and is an indispensable tool to any web developer.

It allows to view, inspect and edit HTMLCSS and JavaScript live on any web page as well helping to debug a large number of potential problems.

Click here to download the Firebug extension.

Yslow

Yslow is a plug-in which is integrated with the Firebug web extension for Firefox.

It's a great tool to help reduce the number of HTTP requests needed to render a page.

It analyses the web page and summarises the page's components, displays statistics and suggests ways to improve its performance.

Click here to download the Yslow extension.

Fangs

Fangs is an extension to the Firefox web browser.

It renders a text version of a web page similar to how a screen reader would read it. It also provides a list of headings and links that are on the page. It helps to quickly find out if there are any accessibility issues on a web page for screen reader users.

Click here to download the Fangs extension.

Aardvark

Aardvark is an add-on for Firefox browser.

It outlines any elements over which you hover your cursor and displays the HTML tags and the CSS styles of the elements selected.

It also has one fantastic feature that makes it worth installing - a page clean-up prior to printing. Simply select the area of the page you want to print (usually the main content area) and it'll ensure that only this gets printed, resizing it perfectly on to the paper.

Click here to download the Aardvark extension.

IE tester

IETester is a free web browser that contains different versions of Internet Explorer, from 5.5 through to 8.

Now you can test websites in multiple versions of Internet Explorer all through just one browser!

Click here to download the IE tester program.

Windows magnifier

It's essentially just a very basic screen magnifier bundled in with Windows XP.

It is great if you want to quickly check how your site looks through a screen magnifier.

Check out this program on your PC at Start > Programs > Accessories > Accessibility > Magnifier.

Xenu's Link Sleuth

Xenu is a handy freeware tool that checks for any broken links on a site.

Simply type in a URL and it will check the links on every single page of the website.

Dead links can come about due to links on external websites going down, a file being moved or someone typing in the wrong URL. Whatever the reason, Xenu will find those dead links for you and tell you on which pages they are on. Isn't that great!?

Click here to download Xenu's Link checker.

Dust-Me selectors

The Dust-Me Selectors is an extension for Firefox web browser.

It lists all the used/unused CSS selectors from all the stylesheets on a web site. It's a handy tool when times come to tidy up and reduce files size.

Click here to download the Dust-Me extension.

Conclusion

It can be difficult to decide on which plug-ins and extensions to use as a developer, but this list should point you in the direction of some really helpful tools. Having these programs in your arsenal could help you out no end when it comes to developing, monitoring, evaluating and debugging web pages.

Thank you for your comment. It has been submitted for approval.

Comment Again?

Leave a comment

Please enter your name.
Sorry, this email address is not valid.
Please enter your comment.

Course basket x

Course

Price per place

Add another courseCheckout

Pay now by credit card or later by invoice (invoice payments only possible if all courses are 3+ weeks in advance)