Three tools every web designer must have…

When starting out in web design there is an overwhelming number of options for you to make a site. For me, I started with a tool that came packaged with my design software, Adobe Dreamweaver. However, If I could go back in time, there are three basic tools I would have given myself to get on the right foot. They are, TextMate for text editing, FileZilla for FTP and Firebug for debugging.

#1 TextMate

TextMate is the only tool that you will have to pay for of these three, but it is more than worth the price ($58). TextMate is a text editor that supports a huge list of languages and offers a lot of time saving shortcuts. It auto-completes common tasks, highlights errors, and displays multiple files in a project and is customizable.  It was originally designed for mac, but I have also heard of a PC equivalent called E-TextEditor (haven’t checked it out). Feel free to try the demo for yourself and see if you like it.

The sliding drawer feature on TextMate allows you to see your entire project.

The sliding drawer feature on TextMate allows you to see your entire project.

#2 FileZilla

Once you write the code, you need to upload it to your server. I recommend using FileZilla because it’s easy to use and free. Some of the nice features are that it is cross-platform, supports drag & drop, includes a site manager and has a duel layout that shows both your local and remote sites. Plus, did I mention it was free?

Easy to use and free FileZilla FTP.

Easy to use and free FileZilla FTP.

#3 Firebug

I saved Firebug for last because it is an invaluable tool for web developers. If you don’t have it already, be prepared to have your mind blown away (I know this is a little dramatic, but Firebug is just so cool). Firebug is a plugin for Firefox that allows you to manipulate any website’s CSS, HTML and JavaScript. So if you were wondering how a new style would look on your website, just open up Firebug, apply it and see it’s effects live. Not only is this priceless for debugging your own site, but it is also a great learning tool when looking at others’ websites.

    Firebug pops up in the bottom of your screen and allows you to manipulate your site live.

Firebug pops up in the bottom of your screen and allows you to manipulate your site live.

With these three programs you have everything you need to start building websites. You will have the text editor to write the code, the ftp program to upload it to your server and the debugger to work out the kinks. The best part about these tools is that they work just as well for experts as they do for beginners. So, whether you plan on building a static site or a complex web application, these tools will grow with you and your needs.