The Best Web Developer Tools

The tasks I take on at work range from developing emails and creating new webpages to animating online banner ads. Throughout all of this, there have been a couple of tools that have made these experiences so much easier.

• Aptana Studio – Although a bit slow to load, Aptana is an excellent tool to code anything from HTML to PHP or Javascript in. The built-in previews are nice, but what I really like are the snippets. Snippets allow you to create small, easy to insert, files that you can add to any project you’re working on. They can even be customized to prompt for variables (e.g. a swf’s filename). This is excellent for the web developers out there that have to do any type of regular website maintenance.
  Runner-up: Notepad++ – Up until I started using Aptana, Notepad++ was my favorite windows app to write any piece of code in. It’s extraordinarily fast to load and can color-code just about any file format you want to write code for.
• Web Developer Toolbar (Firefox Plugin)- This single plug-in for Firefox has so many useful features for web development that it’s probably why I took to liking Firefox so much (that and Firefox’s greater use of web standards). You can outline any element on a page, find broken images, display an on-page ruler, view css, and closely examine an elements css. And that’s just to start.
• 960 Grid System – Although I may switch to Blueprint eventually, 960 is the first CSS Framework I’ve worked with and it makes constructing websites extremely easy and fast. Using 960, you can quickly generate mock-ups or full-blown templates in a fraction of the time. No longer do you have to construct the css for every single structural component of your website’s design.
• Firebug (Firefox Plugin)- I admit, I didn’t originally think Firebug would be a plug-in that I’d use so often. But, it’s now an essential tool. It’s great for troubleshooting css problems with the inspection tool and the live-edit feature makes creating “what-ifs” for management super-easy.
• Screengrab (Firefox Plugin)- Before screengrab, I used to have to stitch together screenshots to get one of the full webpage. With this tool, you just right click to get a copy of the full page.
• ImageMajick & Ghostscript – In one of my old jobs, I had tasks that involved prepping multi-page PDFs for the web. Not having a quick computer, Photoshop wasn’t really an option for doing a batch job on these. Plus, I had to adhere to a certain file-naming convention which I’m not certain that PS can handle without me having to type it in. Anyways, in comes ImageMajick, an image editor that can manipulate graphics via the command line. Plus, with Ghostscript it can modify PDFs and convert them to jpegs or gifs. So, all you have to do is supply the PDF and a batch file, and it will do all the dirty work of resizing & thumbnailing(or whatever) for you.
• WinFF – Like many web developers out there, I was inevitably asked to take some video and convert it to another format. Thankfully, I found WinFF, which gets the job done (but it does have a tendency to quit unexpectedly after converting a video – although apparently there is a new version out now….so, you may have better luck with it).
• Terminal – Ok, so this one is probably a little out of place on this list. But, having access to a unix-based CLI is awesome. True story, I was once asked by a certain IT department to provide a list of *ALL* the files I had modified in the past day or two, so they could check each one. If I had had only a Windows machine, that task would have taken hours to complete (which I think was IT’s point-to get me to go away, since they do have access to linux machines). Fortunately though, using Terminal on my Apple I was able to give IT a list of all 300+ files to check on within a few minutes(their response? “f*ck! he’s not one of our usual ID-ten-T coworkers.”).

So, what are some of your favorites?