Helpful Tools

It seems that there are quite a few questions asked about some basic design and I was thinking that it might be nice to have a thread with a list of helpful tools.

I by no means know what all the tools are or how to use them, but I figured I would list a couple and hopefully other people will add to this thread.

The tool I use the most is Firebug for Firefox. Once you have Firefox you can download Firebug at:


I love this tool. It is so easy to use and it gives you all sorts of information. All you have to do (for the most part) is right click where ever you need more information and click Inspect Element and you get all sorts of info like the CSS of what you are inspecting.

Another tool that I frequently use is Web Developer for Firefox. This tool works similar to Firebug, but it has some neat features like turning off CSS and other things. This tool can be downloaded at:

[url=“Web Developer – Get this Extension for 🦊 Firefox (en-US)”][/url]

Anyways I thought it might be nice to share these 2 tools and hopefully other people will have more to add.


Firebug is indespensible for designers.

Yeah FireBug is a must. I also use “HTML Validator” which is also an addon, this helps when you sometimes forget a closing tag, or make a spelling mistake. It can give false errors though, but it’s a good guide.

Free HTML/PHP editors:

NotePad++ - Notepad++ is a free source code editor and Notepad replacement that supports several languages. Running in the MS Windows environment, its use is governed by GPL Licence.

PSPad - PSPad is a freeware programmer’s editor for Microsoft Windows operating systems. You can also switch on Smarty Highlighting in the options menu.

There are loads more but these are the two i use.

Image Editor:

Photoshop is good but some people may not be able to afford it. I haven’t but you could try The Gimp (for Windows). Although originally developed to be used on Linux systems, there are some windows installers, so could be a good FREE alternative. I think there is also a way to install this on MAC aswell.

Although somewhat out of fashion, I use TopStyle for page design, and both firebug and Chrome’s element inspector for placement issues, etc.


There’s always Amaya also:


For coding, I use phpxref to create function maps for any PHP system I work with.


For version comparison, I sometimes use kdiff3 but I also have ExamDiff Pro.