Web design is constantly evolving, and the tools that are available to designers are also constantly being improved. While the sheer amount can become somewhat overwhelming at times, here is a list of tools, resources and useful bits of info that can save you time, money and hair loss while designing your next site!
Firebug
I personally couldn’t imagine working without Firebug now, this is literally the best free tool for any web designer. The full capabilities of Firebug are too many to list in this article but in essence it allows you to make live changes to any web page, allowing you to see the difference immediately. I use it when I have the majority of a theme or site coded up to tweak the positions, colours and sizes of elements to perfection.
jQuery UI
jQuery UI is a library of open source interactions, widgets and animation effects that all run off of jQuery. This is an invaluable resource for designers that could literally save hours – next time you need a date picker for a form or nifty autocomplete field, this is the place to visit first.
W3C Validator
This is essential for all web designers – use it to ensure that your code is valid and not likely to cause any major issues. With web development becoming increasingly more advanced and complicated adhering to standards is more important than ever.
Clean CSS
This is a really handy little tool for reorganising and compressing your css to make it cleaner and more efficient. You need to feed it decent, valid code but then it can compress amazingly.
Web Developer toolbar for Firefox
Rather like the Firebug extension, I can’t explain the full usefulness of this tool in the scope of this article. It’s incredibly useful for debugging by switching off certain elements or languages like Javascript or CSS.
IE Netrender
There are lots of browser testing tools – including the awesome browser shots. But more often than not its IE thats causing the issues. This is the fastest tool for checking the difference between IE versions and I thought it deserved a shout out.
XHTML Character Entity Reference
The amount of times I had simply Googled the answer for HTML entitites before I found this – all entities are listed and easily sorted, making life a little easier.
Flickr
Quite why people don’t use Create Commons, commercially licensed images as much as they could is beyond me. The prices of stock images can be ridiculous when there are millions of awesome images on Flickr that can be used for free (just don’t forget to leave a link back somewhere on your site.
About: Article written by James Blackwell, a freelance web designer and SEO consultant. James also produces sites like broker review – check user comments on the optionsXpress review and Tradeking review.