The Mac is the web builder’s weapon of choice – at least, it is among the web designers I know – and practically all pro web design software is available on the Mac as well as Windows. But what about those of us who don’t want to fork out thousands of dollars to build websites with our Macs? In this series of posts I’ll explore how to create great websites on the Mac using low-cost – and in some cases, free – applications.
This first post takes a look at creating your website’s graphics.
Photoshop is, of course, the granddaddy of image editors, and it’s well suited to designing websites. However, it does come with a hefty $650 price tag for the basic version. There’s also Fireworks, which was designed as a web image editor from the ground up, and is priced at a more affordable $300.
If you’re a pro then you can afford these prices, but they’re a bit steep for the average web designer on a budget. So what other options are there?
Photoshop Elements is Adobe’s cut-down version of Photoshop aimed at hobbyist photographers, and it has a mini-me price of $90 to match. Elements on the Mac lagged behind the Windows version for a while, but Adobe recently released Elements 6 for the Mac, bringing it into line with the Windows version.
On the whole, Elements includes most of the important Photoshop features that you want for web design, such as a fully-featured Save for Web command and limited layer styles. One notable omission is layer masks, but you can cheat and use a Levels adjustment layer to get a layer mask if you need to. It also doesn’t support editable layer groups or guides, so if you open a Photoshop file containing these features then there’s not a lot you can do with them.
You can download a trial version from the above link (but beware, it’s a monster download at 1.27GB).
Pixelmator is a relative newcomer to the image editing scene. It’s a Mac-only app, and integrates very nicely with the Mac too, with a lovely, snappy user interface. Its menu options and keyboard shortcuts are pretty similar to Photoshop’s, and it behaves in a similar way. Like Photoshop, it has guides, layers and layer masks, which are great for web work. It can also open layered Photoshop files.
However the current version lacks certain features of both Photoshop and Photoshop Elements, such as Save for Web, shape layers, fully editable vector type layers, and layer styles. Still, the price is a very reasonable 60 bucks, and you can download a 30-day trial to see if it works for you.
Another affordable “Photoshop lite” option is Acorn. Again, this has all of the basic image editing features such as layers, text, fills, and some pretty original filters. It also has a Web Export, though its options are somewhat limited. Also limited are its shape layers, which only allow for rectangles, ellipses and lines, and it has no layer effects to speak of. It also has trouble opening layered Photoshop files, discarding the layers and flattening the image.
In all, Acorn is nice to use and fine for simple designs, but its small feature set might cause you problems if you want to do anything complicated. On the plus side, it’s the cheapest of the commercial offerings here at just $50. What’s more, the download is a blissfully small 5.8MB, which makes it easy to try and buy!
Finally, there’s the venerable GIMP, a cross-platform, open-source image editor that’s been around for almost as long as Photoshop itself. It has tons of features, is very customizable, and best of all, it’s free! To use it on the Mac, though, you need to have the X11 package installed (also free). This is available on the Mac OS X DVD, or you can grab a version from the web. This Mac install guide has more details.
While The GIMP lacks some of the niceties of Photoshop – such as adjustment layers, layer styles, and clipping masks – and its user interface takes some getting used to, it’s a very capable app, and these days it does a reasonable job of reading Photoshop files. You can also use plug-ins to get some Photoshop-like functions such as layer effects. If you’re on a tight budget, want a decent feature set, and have the patience to learn its various quirks, then The GIMP might suit you down to the ground.
Believe it or not, it’s also possible to edit images via your web browser! There are several online image editors out there – most of them free – but the one most suited to web image editing is probably Splashup. It’s nowhere near as feature-rich as Photoshop, or even Photoshop Elements, and it can’t open Photoshop files. However, it does have the basics, such as layers, layer effects, cropping, and the ability to create text, fills, and shapes. And you can’t argue with the price!
In the next post I take a look at affordable web page editors for the Mac.