Web design on the Mac

It has been said that “a good workman never blames his tools”.  While this is true in many cases, when it comes to design I am very much of the opinion that good tools can greatly contribute to the quality and success of the finished product.  As a web designer I am constantly on the lookout for anything that would make my life easier, and from a design point of view anything that looks good and works well generally puts me in a good creative mood, which has clear implications for a well-designed web site.  Since migrating from PC to Mac I have tried various different programs, some free, some not, and after a recent discovery I have been prompted to think again about the options available.

The first thing to make clear is that not all web designers are the same, and as such there will never be one program that will suit everyone’s needs perfectly.  I have my own criteria, and while they may not match up to yours, they are criteria nonetheless.  I generally prefer to hand-code as much as possible, partly because I’m a control freak, partly because I have yet to find a WYSIWYG editor that is as good as me.  As such, good text editing features are a must for a web design program, and extras that speed that process up without getting in the way are obviously a bonus.

jEdit

jEditThis is arguably one of the most flexible text editors around, with hoards of plugins to make jEdit do practically anything you might find useful.  Cross-platform compatibility means you can use the same tool on any operating system, and the ability to split the window into various different panes makes it easy to compare documents, load up more files from a folder list, check for errors, and much more.

On the Mac, though, I found the interface somewhat clunky – while some may see cross-platform as a good thing, jEdit just doesn’t look comfortable enough on my Mac for me to happily work with it on a daily basis.  If all you want to do is edit text, this program would be fine, but when I am designing I like to be inspired by the tools I’m using, and jEdit leaves me cold on that front.  It’s ugly, a little slow, and just doesn’t have the wow-factor I would like.

GoLive

Part of the Adobe Creative Suite, this is a fully-fledged, paid-for web design application.  It has a built-in preview engine, solid text editing features, plus one of the better WYSIWYG editors I’ve used.  Not perfect, but pretty good.  Apparently GoLive integrates seamlessly with Photoshop and Illustrator, though I have yet to make that work convincingly.  There are also some useful site management tools, such as graphical site mapping, project management, uploading to the web, it’ll probably even offer to make you a cup of tea.  The trouble is, in trying to do everything it has only just managed to do any of them properly.

Text editing is fairly solid, apart from the auto-complete which gets confused regularly and takes some time to get used to.  The graphical editor is fine if you’re just editing a simple web page, but as a web designer I rarely work with simple designs, and the layout goes to pot very easily.  The preview engine is fairly reliable, but since it is a unique engine it’s not comparable to Firefox, IE or Safari, which makes it pretty much useless.  Something that you know works in mainstream browsers will fail to work in GoLive, and relying on the GoLive engine runs the risk of it looking fine in the preview but failing miserably in everything else.  There are plenty of features built in, but there doesn’t seem to be any scope for user plugins to extend functionality.  But one of my biggest gripes is the font-rendering – text is not anti-aliased, which makes the code look ugly and uninspiring.  Not a huge concern, but one of those background issues that seem to affect me in my design process.  Oh, and it’s expensive to boot, and since Adobe recently bought Dreamweaver it seems unlikely that they’ll do much development on future releases of GoLive, which means I’ll have to review DW at some point too.

Coda

CodaI recently discovered this application through the Apple Design Awards, where Coda won the 2007 award for the “Best Mac OS X User Experience”.  Their own web site is nicely designed, and I was quick to download the trial version to take Coda for a spin.  As you might expect from an award winning program in this category, it was superb.  The interface is smooth, tidy, intuitive, and takes advantage of the built-in Mac OS X graphical capabilities to add a touch of “wow” to what might otherwise be a dull task.  Coda doesn’t come with a WYSIWYG editor of any description, but makes up for that with an easy-to-use text editor, incorporating an attractive and easy to use list of snippets of code that you can drag into your document to save time.  The CSS editor is also the best I’ve come across, and I actually found myself using it a lot in preference to writing the code by hand, which was a pleasant surprise.  Coda uses the Safari engine for previewing pages, which means you can actually road test your web pages using a browser that people are likely to use.  Safari does have a few flaws in its rendering (nothing is perfect), but on the whole it works very well and is very encouraging to use.  They also bundle in documentation e-books for HTML, CSS, Javascript and PHP, which are useful reference sources that can be accessed quickly should you find yourself wondering exactly what a particular syntax is.

Coda is not without its niggles though.  Branding itself as the “One-Window Web Development” option, everything is contained in one window by default.  While this is a neat and tidy way of keeping all your web pages in order, I have found it to be restrictive at times when I want to compare two or more documents, or put the preview next to the code so I can see what needs changing.  True, you can have more than one window open if you want to, but trying to fit three or four windows on the screen, all of which prefer to be nice and big, makes little sense and doesn’t work as well as it could.  It’s also not free, and the 15 day trial is non-negotiable (I did wonder if I could just ignore the plea for money, but they won’t let me, which is fair enough I guess).

Nvu

Yes, this is one of the few WYSIWYG web editors I would actually recommend.  The graphical editor is actually fairly easy to use, and I was pleasantly surprised how well it wrote the resulting HTML code, with standards-compliant use of tags, and even an intelligent approach to tab indents.  Of course you do still have the option to edit the raw HTML, and while it may not have all the bells and whistles of some other programs it does have the basic tools and they work very well.  The code looks attractive and tidy on the screen, and the program itself is very responsive too, alluding to its non-bloated coding – impressive, given that it’s another cross-platform application.  Nvu is free too, which is always a nice bonus.

However, Nvu falls down most noticeably when dealing with any document that isn’t an HTML file.  While the preview reads external CSS files from your computer or live off the internet, it won’t actually open CSS files itself.  Neither does it know what to do with PHP or Javascript, which means it’s only actually good for editing HTML, which in my line of work is only one component of web design, and not necessarily the most important one either.  There are also no project tools to speak of, and although it looks pretty it just doesn’t do enough to be truly indispensible.

So, that’s a run-down of some of the web editors I’ve used recently on my Mac.  Working on a budget I can’t necessarily afford the best, most flashy, most expensive products, and I’m guessing others out there will be in the same boat, where freeware and open source applications are a tempting option.  At the end of the day I can’t tell you what the best product is – each is good at different things for different reasons for different people.  For me, Coda was a dream to work with, and if I could afford to buy it I definitely would, but since I can’t afford it right now and my 15 day trial has run out it looks like I’ll be falling back on GoLive for the time being.

If you use something else for your web design needs that you think deserves a mention, do leave me a comment – I’m always willing to try something else to see how it performs.

One thought on “Web design on the Mac

  1. Just discovered a few smaller web editors – Smultron, Tag and HyperEdit. All have live preview panes, which is pretty cool, but the source editing leaves something to be desired and forces you to hand-code absolutely everything, which kinda sucks. I’ll try using them properly in the days to come, see if any of them stick…

Leave a Reply

Your email address will not be published. Required fields are marked *