Home > Articles > Free Tools Every Web Developer Should Have

Free Tools Every Web Developer Should Have

Written on Feb 18th, 2010 at 2:50pm

There are a lot of great development tools out there. Unfortunately, a lot of them cost a pretty penny for someone who's just starting web development. Adobe's suite of software, for instance, can go for as much as $600 - if you're a fresh college graduate (or younger), that's money that could be going to paying off student loans and the like.

Fortunately, there are a lot of tools that have been developed which don't cost a penny - you just need to know about them and download them. Here's some that you just need to have:

Notepad++

Notepad++ is actually recommended for ALL developers, not just those making websites. Featuring support for several languages (including HTML, CSS, PHP, ASP), auto-tabbing (so you don't have to tab 4 times with each new line), syntax highlighting, and more, Notepad++ is key for anyone hand-coding their websites.

GIMP

GIMP, or The GNU Image Manipulation Project, is a highly sophisticated image manipulation tool (like photoshop), available to the public for free. If your site features fancy graphics, this is a tool you must have.

Firefox, Google Chrome, and IE 6.0-8.0

It sounds silly to mention these as tools - but that is exactly what a browser is, a tool for viewing HTML. Not all browsers will render HTML the same way, and that's why you'll need to check your HTML in all forms of browsers - particularly the various versions of IE, as it will frequently display pages incorrectly. While many will say that it's not worth considering browsers which don't work, the sad fact is that many people still use IE6 (nevermind IE7 or IE8), and you just can't ignore a market share that large. Other browsers to consider are Opera and Safari

IE View

The great thing about Firefox is that it has so many extensions. One great extension is IE View, which will render a page as IE would in your Firefox browser - meaning you don't have to even load IE when testing your websites.

Browser Shots

Just because your website looks good in Firefox 3.5 running on Windows Vista doesn't mean it looks fine running on Firefox 3.5 running on a Linux platform - and not everyone has instances of every OS available. Browser Shots is a website which solves this problem, taking screen shots of a given page for a large number of browsers on different operating systems. A bit obsessive? Maybe. I prefer to think of it as passionate.

HTML Validator

Validation is key if you want to be considered a good developer. However, it's easy to forget to close that <p> tag, or forget the close slash on the <input> tag. HTML validator checks your code, and tells you if and where there are any errors.

Web Developer

Well, you are a developer, aren't you? The Web Developer add-on adds a toolbar which is placed between your tabs and bookmarks, allowing you to manipulate the page to obtain AND alter data such as cookies, stylesheets, forms, etc. What I find the most useful is the outline tool, useful for determining if elements are nested properly, and if not, how to fix them.

Font Finder

This add-on should probably be called 'Style Finder' instead, as its used to find all the styles for a particular piece of text - just highlight and right click. This add-on is perfect for when you're browsing other websites, and realize some of their styles would go perfect on your site, but don't want to go fishing through the stylesheet to figure out exactly what's going on.

Comment on this page:

Your information Name:
Email:
Hide Email?
Enter the 5 characters shown.
Request another image.
Prove your human:
Comments Overall page rating:

Comments

No one has commented on this article yet. You can be the first!