Great Free Software for Web Designers

Ask anyone who has just upgraded the software on their Mac to the latest version, or even splashed out on the latest Creative Suite and they will say the same thing: Software is EXPENSIVE.

Now imagine you are an agency with 12 designers who all need (want!) to move to the latest version of Creative Suite. Even more expense.

Now imagine you are a looking to learn web design and don’t have pots of cash to spend on the industry standard software. How can you get your hands on a suite of software tools that will help you plan, design, build, debug and deliver a website without spending a penny?

Here’s how.

We’ve compiled a list of free software, mostly for the Mac, but with a few exceptions where absolutely necessary! We’ll take you through the process of planning, completing and delivering a project, and what free software is available to you at those stages.

Be sure to add your comments below and let us know of anything we have missed.

Messaging & Communication

For email on a Mac, Apple’s Mail application is pretty faultless. Good alternatives are out there for free such as Thunderbird from Mozilla, but the trainable Junk Mail filter in Mail and recent improvements in handling multiple accounts keep it head and shoulders above any competition here. Integration with iCal and Apple’s Contacts application add up a pretty solid messaging suite.

Apple’s Mail is also great at handling RSS feeds, but if you prefer a separate RSS reader then try NewsFire RSS. Designed squarely with the Mac in mind it allows you to organise multiple feeds into neat, manageable views and label your feeds according to pre-determined criteria.

If you need an instant messaging client then look no further than Adium. With support for a wide choice of account types, regular nightly builds and the latest release being optimised for Snow Leopard, this really is the best IM for the Mac. Don’t forget that Skype still offers a free service and so cost need not be a worry when keeping in touch with clients.

Lastly I’m going to mention DropBox. Not that it needs further plugging, but it is still a fabulous free service that simplifies not only file synchronisation across multiple computers but file delivery as a whole. 2 GB of free cloud storage gets you up and running and the ‘Public’ folder system allows you to provide large files for clients to download, rather than clogging up email with large attachments.

Project Planning & GTD (Getting Things Done)

If your clients are working on PC’s then the chances are you will be receiving emails with Microsoft Office attachments. Fine if you run iLife, but if you don’t you will need NeoOffice. Much like Microsoft Office, this equips you with applications for Word Processing, Spreadsheets and Presentations, but vitally the ability to open, edit and save back to the common .doc, .xls and .ppt format. The latest build even supports the .docx, .xlsx and .pptx formats.

Wireframing page layouts and even the creation of site maps can be handled in the brilliant Go Mockingbird. This online app allows for site mockups to be created with page hierarchies that link to each other, and for completed projects to be shared online. My advice is to secure an account for this app while it is still free.

Mockingbird

To keep you focused on tasks and deadlines we’d recommend a look at TaskMate. It is refreshingly simple to use and its devotees (of which there are many) tend to stick with it despite the increased uptake of more feature-rich, paid-for applications such as Omnifocus.

Another name that keeps cropping up is Xpad. This hugely popular app allows you to create ‘drawers’ for each new project, into which you drag and drop files of any type to keep them organised against pre- defined categories.

If you are on the move and have an iPhone then free apps such as Evernote and Remember the Milk allow for note-taking, as well as images and audio files (in the case of Evernote) to be stored in the cloud for reference later on.

Keeping track of time while you work is made easier with Lumina (recently renamed from iClockr) So simple it barely warrants explanation, but essential if you are to keep track of resource on each project and bill for time accurately and efficiently.

Image Editing & Design

This was probably the trickiest area historically to source really good software for nothing. Not least due to licensing issues surrounding some of the proprietary file formats within design. That said there are still some great products out there if you know where to look.

First off, a free equivalent to Photoshop.

Due to its support online, large community of developers producing regular nightly builds, and not forgetting its feature rich tool set, GIMP (the GNU Image Manipulation Project) is head and shoulders above the rest for image manipulation. Running on the X11 windowing system (be sure to install this first) GIMP offers layers, colour correction, filters and support for a wide array of file formats. Cinepaint, Chocoflop and Paint.NET (Windows) are all also popular options, some perhaps with a more satisfactory GUI, but they all fall short of GIMP’s impressive feature list.

Paint .NET

For vector graphics we’d recommend a look at Inkscape. Inkscape is an open source project that supports the W3C standard SVG (scalable vector graphic) file format. Thanks to the dedication of its community its latest release already supports Snow Leopard happily.

Two other useful additions to your arsenal would also be Smush IT and Sprite Me. Smush IT from Yahoo is a lossless online image optimiser which is fast gaining popularity. Image optimisation is an art form few wish to master, and with Smush IT at hand there is no need. It analyses images and uses the most appropriate algorithm based on the pixel data, outputting very small file sizes without loss of quality. Bundled with YSlow, a plug-in that analyses the speed a page loads, its one to watch. Sprite Me is a bookmarklet that aims to reduce http requests to your server for images, by suggesting where multiple images may be combined into sprites.

ySlow

Coding & CSS

Interestingly enough, two of the most popular coding suites (Coda and Espresso) are very cheap to purchase, compared with the industry ‘standard’ Dreamwea

ver for example. Coda weighs in at around £60.00 and Espresso £50.00, compared with Dreamweaver at around £420.00 for a full version. Good free options are around though, and Text Wrangler is up there as our key recommend. From the people who brought you BBEdit, Text Wrangler features syntax coloring for most popular programming languages, integrates with Python, Perl and even Xcode. You can compare two files and integrate changes, and even FTP to remote hosts. Not at all bad, and with the reputation of Bare Bones software behind them, you can be sure this is a robust and user friendly programme.

You might also consider Smultron as a solution. Though no longer developed, this app has a beautifully simple interface which has the benefit of both a low barrier to entry for newcomers, as well as not being off-putting to veteran programmers.

If you prefer a separate environment for producing CSS then Simple CSS might be for you. Currently only supporting CSS2, Simple CSS provides either a guided interface for CSS creation, or if you prefer you can code by hand with colored syntax to highlight mistakes or invalid declarations.
Coding in the cloud has been much in the news recently due in no small part to the advent of HTML5 and AJAX. Web applications are now able to behave more like their desktop counterparts, and this in part explains the recent release of a number of exciting solutions to coding in the cloud. The collaborative nature of working this way is also appealing as the development community pool their knowledge on projects.

The two front runners seem to be Mozilla’s Bespin project and CodeRun. Both look very promising solutions indeed with the ability to create multiple projects, to preview, compile, debug and deploy projects all from within your browser.

CodeRun

Database developers should definitely give Sequel Pro a look as this app makes MySQL administration simple and quick. Aimed as a straight replacement to tools such as PHPMyAdmin, Sequel Pro supports
MySQL 5 and is fully customisable to suit your needs, from those favouring a simple interface, to more advanced users who wish to hand code SQL queries. An incredible product when you consider it is free.

FTP

Long the preserve of free software, with paid for apps being a relatively new occurrence. FTP applications, like the protocols which they serve have come on a pace in recent years. One of our favourites is Fire FTP, a free plug-in to Firefox which loads a neat little ftp client into a new tab in your browser. Supporting networked shares on your local machine, permissions changes, passive mode and SFTP, Fire FTP is a fantastic plug-in.

fire ftp

Another excellent candidate worth your attention is Filezilla. Built originally for Windows, this might not have the feel of a Mac app, but it has been cross platform for a number of years now and has some classy features that make it a great choice for someone administering FTP on across a variety of servers. Filezilla supports, FTP, FTPS and FTP over SSL so can handle most server requirements with ease.

And for those who might want an app which feels Mac through and through then Cyberduck is still there for you. With recent improvements covering connection protocols for Amazon S3, WebDAV and CloudFront as well as support for Quick Look and Spotlight searches, Cyberduck integrates seamlessly with Finder and is a stable candidate and a fun addition to anyone’s dock.

Debugging & Testing

Perhaps unsurprisingly, the top two plug-ins for debugging sites are Firebug and the Web Developer Toolbar for Firefox. If you don’t already have these, then where have you been?! A great find however is Q Emulator which is an open source, free of charge emulator for running Windows on a Mac. This is crucial for testing sites in IE on a PC and all the other Windows versions of browsers, not to mention the ability to run IIS as a web server if the need arises.

Firebug

For your local web server there is MAMP. It is still unsurpassed as a local testing server running Apache, MySQL and PHP and now easier to install than ever. Previous releases were notoriously troublesome and required tweaking to get services running reliably)but not anymore. MAMP has a very small footprint at 165Mb, comes bundles with PHPMyAdmin supporting version 5.2 and Apache 2.0.63.

Site Promotion

Two good tips here are the Xenu Link Checker and the GSiteCrawler. Both sadly are not the most attractive of applications, and require Windows to run – that said, they do perform their respective jobs very well indeed. Xenu Link Checker is a simple application that crawls a web site from a URL, and reports back on any dead links it finds. It is a great labour saving tool if you are working on a large, link- intensive site, or if you inherit someone else’s project and need to check the integrity of the structure or why specific pages might not be indexing as well as others on search engines. Xenu generates a report of dead links and error codes received, allowing you to quickly correct and run the test again. GSiteCrawler does a similar job for creating XML based sitemap files for submission to Google, Yahoo and Bing. Direct the application at your URL and it will generate a sitemap file for you – simple as that. Apply the appropriate charset based on which search engine you are submitting it to and there you have it. Lastly it is worth mentioning the Webmaster Tools available from Google as a vital part of both monitoring your sites indexing, producing robot.txt, blocking folders, checking incoming links, and much much more besides. Coupled with Google Analytics and Google Intelligence and you can see why the world’s most popular search engine invokes such a fanatical following amongst the development community.

Billing / Invoicing

FreshBooks

Show me the money. Surely this is the most important bit? From the list of possibilities we have drawn up two options. One an online solution, perhaps better suited to someone freelancing at client sites and not necessarily using their Mac at all times. The second is a desktop application for someone working from home, or at least from the same Mac. Our online solution is Freshbooks. This fully integrated suite of tools for creating customers, generating invoices, managing payments, and scheduling regular billings operates from within a browser or via an iPhone. Freshbooks offers a free startup account with a maximum of 3 clients allowable, which might just be enough if you are starting out. If you require more flexibility then Express Invoice is a desktop application that is certainly man enough to get you up and running as your own ‘accounts payable’ department. All without putting your hand in your pocket.

  • http://www.amorphousprojects.com SL

    I just discovered the file filter features of Filezilla last night. It’s brilliant that it filters out temporary files and subversion files. Previously I was uploading entire directories and then manually deleting .svn and .tmp files.

    • http://www.jeepstone.co.uk Pete Jones

      @SL – Not wanting to hijack this thread, but you shouldn’t be uploading .svn files. You should run an export – then you get the latest committed files and no .svn files.

      On thread – good selection of tools here. I’d be tempted to throw in Eclipse as a ‘proper’ developer tool for heavy PHP type stuff.

    • http://www.mcbwebdesign.co.uk Martin Bean

      I would like to brazenly state that I prefer e text editor (the Windows port of TextMate) over Notepad++.

  • http://anny.fm/ Anny

    Don’t forget TextMate, the only editor… http://macromates.com/

  • http://www.ticktockdesign.com David Horn

    In the CSS / Coding section, I’d recommend adding in SKEdit. It’s neat, clean, easy to use and has about 95% of the most commonly used Coda functions. It’s nice. It’s not had any releases since mid-08, but at version 4.something it’s pretty mature, and is only £20 or so.

    http://www.skti.org/

  • http://www.screengrabecommerce.com Gerry Hanratty

    That’s a great post , cheers.
    I’ve often used http://www.pixenate.com for a light image editor too.

  • http://www.griffin-david.co.uk Dave Griffin

    Excellent list of tools. A few personal favourites in there, and also some new tools for me which I think I may start adopting. Really liking the Express Invoice app. Save’s me having to faff about in Filemaker and get on with doing work that I can bill !

  • https://twitter.com/Lukelux Luke Lux

    It’s a great post, so useful.
    Thanks to share it!

  • fillister

    … and the other great free code editor is komodo edit, for windows, mac, linux

  • http://www.chriscowley.me.uk Chris Cowley

    In your testing debugging section I would add Sun VirtualBox.

    The problem with Q is that it is based on Qemu, which is not as fast as VirtualBox as it is an emulator. VirtualBox is virtualised and it has para-virtualised drivers which give you bare-metal performance.

    Also, Qemu has a problem with Centos/rhel 64bit editions which kernel panic as soon as the start booting the kernel.

  • http://www.chriscowley.me.uk Chris Cowley

    I also think that VirtualBox makes it easier to set up bridge networking (ie you just select “Bridge networking” ) which puts your VM directly on you host’s network.

    If I remember right, you can do that with Q, but it not easy.

  • http://www.chriscowley.me.uk Chris Cowley

    I would also add GNUCash to the billing/invoicing section. It available via Fink.

  • http://www.chriscowley.me.uk Chris Cowley

    Also in Fink (at least the unstable branch, which I have been using for years and is perfectly stable) is Bluefish, which is an excellent PHP, XML, CSS etc editor.

  • http://www.sgdoeschwitz.de BigM75

    thats so cool thanks for the list, nice article

  • http://www.karyx.co.uk Rob Layfield

    I made a conscious effort to drop Adobe product last year after getting fed up with the mindless cruft that Dreamweaver inserts into sites (& particularly check in/check out and Contribute-bloody-Contribute).

    I found the following replacements all reasonably priced:-

    Panic Coda $99 (which includes their excellent FTP client Transmit) and is exactly what I need as a developer. The only thing it lacks compared to Dreamweaver is the design view but I can live without that.

    Pixelmator £38.44 (http://www.pixelmator.com/) well put-together if basic Photoshop replacement (I’m a developer, it’s all I really need for image manipulation)

    DrawIt €29 (http://www.bohemiancoding.com/drawit/index.html) Similar to the above but to replace Illustrator

    Finally something that wasn’t really covered in this article but which is becoming increasingly important: Version Control.

    Dreamweaver CS4 has Subversion support integrated but because it depends on Dreamweaver’s particularly shoddy native FTP client it can be criminally slow, especially if you are using hosted Subversion repositories.

    Versions €39 (http://versionsapp.com/) is without doubt the best Subversion client available on a Mac and it is a great piece of software. For PC users, there’s always Tortoise (http://tortoisesvn.tigris.org/) which integrates with Explorer beautifully.

  • Grant

    If you are on windows then you can’t beat notepad++ for coding.

    • ryan

      Yes! Notepad++ is the best program out there!

  • Cork

    The vast majority of us who develop on Windows machines are annoyed at the vast majority of Mac-only program on any list, especially a list of free software.

  • http://www.shuttlebox.net/ Kieran Smith

    I like to think I get around the net and find the latest and greatest things – but this article definitely had some gems I wasn’t aware of yet. Thanks much for the list!

  • http://vam.si/ Vamsi Kancharla

    Google Webmaster tools and Google Analytics are free. Great for web designers.

    Firebug is by far the most useful! My website http://vam.si was all done thanks to Firebug and also Webdeveloper. Notepadd++ helps.

  • Yves Matthess

    Hello,

    great list of useful tools. But for extensive coding don’t forget the powerful Netbeans IDE.

  • http://tomdringer.com Tom Dringer

    Don’t forget HTML-tools. Awesome piece of software updated every few weeks. http://www.htmlkit.com/

  • http://www.s3d.co.uk Matt

    Not a single mention of eclipse!
    I personally use this for all my coding. The CSS isnt the best area of it, however for all other coding ive not found better (but will try some of the above!!

    Regards

  • http://lenkerdesign.com Jason Lenker

    Nice.

    A Mac app called Integrity will also run through your site to check for dead/missing links.

  • http://www.rjnewdesigns.com Richard J

    My favourite code editor is still Pspad as it allows you to create your own code shortcuts.

    As far as FTP programs you cannot go past Smart FTP but you do need to pay for it these days.

  • Sharon

    Extremely useful thread – thanks so much!!

  • http://askalot.org Arunan

    For invoicing take a look at http://www.curdbee.com/

  • http://askalot.org Arunan

    Also you can use Aptana Studio http://www.aptana.org/ or Komodo Edit http://www.activestate.com/komodo_edit/ for code editing.

  • http://lightiseverything.com.au Kym Dusting

    Great list, although one area I thought could do with some coverage is file diff’ing software. I have been looking for an affordable / free replacement for Beyond Compare (Windows) since switching to Mac last year. Anybody got any suggestions?
    Ta.

    • teebee

      For anyone looking for a Windows differencing tool I’ve been using “WinMerge” for years and LOVE it! It is free and there is a portable version of it as well. Find it here: http://winmerge.org/

  • http://www.sproutcreativity.com Jennifer Martinez

    I’ve been using Dropbox for a little while to help sync files across multiple computers. I can say that I love the software and it’s really simple to use.

    I no longer have to pull out that USB drive to transfer files plus there is a handy iPhone app that lets you transfer files from your iPhone.

    I also love Firebug and Freshbooks but I’ll definitely keep the list handy to check out those other free aps and software.

  • http://www.sitefloat.com SiteFloat

    Awesome post! Freshbooks is great but not exactly free software! haha

  • Davinder

    How about Microsoft Visual Studio Express for Asp.Net (MVC), Php, Css, Html, Javascript and software development. You can also use open source versions of Visual Studio for Windows, Lunix and Mac!

  • http://www.dmantra.com Arjun Rajiv

    Cool Stuffs!! very useful ones…

  • Moasa

    If I could add anything I will add FileZilla (FTP) and CurdBee (Invoicing). Both are great apps which i use often.

    I don’t think Freshbooks qualify to be a free tool at all as they only give a demo account for free. Where as I found CurdBee and they offer a fully free account without any restrictions on number of clients or invoices you can send per month. Besides they also support online payment acceptance via PayPal and Googlec Checkout for free.

  • zane walter

    Proofmini is an amazing tool and due to this my
    work load is just half. I think it is really cost effective and
    user friendly tool I have ever used.

  • http://www.facebook.com/people/Antima-Sharma/100002302088553 Antima Sharma

    I am very happy to
    read your articles it’s very useful for me, 

    and I am completely satisfied with your
    website. 

    All comments and articles are very useful
    and very good.

    Your blog is very attention-grabbing. I
    am loving all of the in

     turn you are sharing with each one!…

    website
    designing

  • http://www.facebook.com/rahmancpz Rms Rahman

    Very informative and useful article, i like to read your
    article very much. Thanks a lot for sharing with us.

Headscape

Boagworld