In this short series of posts I’m looking at Mac software that lets you build a decent website without costing the earth. I’ve already covered image editors; in this post I delve into the murky and varied world of web page editing apps.

When it comes to web page editors, Adobe once again rules the posh end of the market with Dreamweaver ($400), which is great for both visual- and text-based page editing. So what else is available?

Web page editing software seems to me to fall into three broad categories these days:

• Text-based page editors. With these editors you essentially work with the raw HTML and CSS code. The editor may have some sort of preview facility so you can view your page visually as you go, but all the editing is done in text mode. Examples include Coda, TextWrangler, and practically any text editor you can imagine!
• WYSIWYG editors. These let you work with your web pages visually, much like using a word processor. You can enter and format text, and drag images and other media into the page. Under the hood, though, you’re still working with an HTML page, and can usually go in and edit the raw HTML if you need to. Examples include Dreamweaver, KompoZer and Amaya.
• Template-based page creators. These are a relatively new breed of web-building apps. Rather than editing HTML pages, you build your pages using templates built into the app, then publish, or export, your finished site as HTML, CSS and images. It’s usually not possible to flip to a text editing mode and edit your HTML page in its entirety. Examples include iWeb, RapidWeaver and Sandvox.

Let’s take a look at some example Mac apps in each category.

Text-based editors

Coda

Panic’s Coda ($80) is a powerful text-based HTML and CSS editor that also features a file uploader. The idea of Coda is to have all the tools you need to build web pages – a text editor, a CSS inspector, a preview mode, and an FTP/SFTP/WebDAV uploader – all in one handy package. To this end, Coda does a fantastic job; it’s intuitive, easy to use, looks great, and really speeds up the website building process.

I particularly like the Sites feature that records everything about the current site you’re editing – open windows, your position in each file, and the connection to the FTP server – in a single, pretty-looking page icon. Double-click the icon in Sites, and you’re back to working on your site, exactly where you left off. Other really nice touches include a built-in terminal window for those times when you simply have to drop to a shell, and the built-in – and very nice-looking – reference books for HTML, CSS, JavaScript, and PHP. Highly recommended.

skEdit

At the other end of the text-based spectrum is the $35 skEdit. Where Coda is the Swiss army knife of text-based editing, skEdit gives you just the bare essentials: a capable editor, and a file uploader. It features syntax highlighting for most web file formats, including HTML, CSS, Perl, Python, ASP, and JavaScript – though, for some bizarre reason, not PHP. It also lets you do simple HTML auto-formatting, such as highlighting text and pressing Command-Option-B to bold it; a feature sorely missing from Coda.

Another nicety is the way you can open a remote folder on an FTP server, then edit and save the files as if they were local. skEdit also features snippets – macros that you can use to quickly do common tasks, such as turn some text into a link.

While not as full-featured as Coda, or as slick, skEdit does a decent enough job for the price.

Other worthy apps in the text-based category include Aptana Studio (professional edition: $100, community edition: free), the free TextWrangler text editor, and your favourite UNIX text editor of choice, built right into your Mac! (Mine happens to be vim.)

WYSIWYG editors

KompoZer

KompoZer is a free, open-source WYSIWYG editor with a venerable lineage that can be traced back to the original Netscape Composer. It’s not the prettiest-looking app around, but it does a great job of editing web pages. And that’s what counts, right? It’s stable, it has lots of features, and it hardly messes up your HTML at all (unlike some editors I could mention). Unfortunately it’s a bit slow on Intel Macs, because it’s only available as a PPC application (at the time of writing).

As well as full WYSIWYG editing, you can also switch to Source mode if you need to dip in and edit some HTML by hand. It also has a nice CSS editor built in, as well as FTP publishing and site management capabilities. Overall, KompoZer makes a good alternative to Dreamweaver if you’re on a tight budget.

Other budget WYSIWYG editors include the also-free Amaya and the $80 Freeway Express.

Template-based page creators

iWeb

Chances are you already have iWeb – it’s part of the iLife suite that comes with the Mac (I’m currently playing with iWeb ’06). You might be led into thinking that you need a .Mac account to use it as it tries to force you to sign up for one when you start it up. However, this is not the case – it’s perfectly possible to publish your iWeb site to a folder on your Mac, which you can then upload anywhere via FTP.

The app is remarkably easy to use, as you’d expect from an Apple app. Simply choose a theme and page type to create a page, then add your own text and images. You can link between pages easily, and iWeb even puts together a navigation menu and RSS feeds for you. Once you’re done, choose File > Publish to a Folder then upload your folder to the web.

iWeb comes with a few ready-made themes, and it’s possible to purchase additional themes or even roll your own, though the process is somewhat daunting.

What iWeb can’t do, however, is edit existing websites. iWeb pages are stored in a custom Apple XML format, and converting to HTML with the Publish command is strictly a one-way affair; there’s no way to get that HTML back into iWeb. As such iWeb isn’t much use as an everyday web page editor, but it’s great for knocking together a quick site.

RapidWeaver

RapidWeaver ($80) predates iWeb; in fact many would say that iWeb was somewhat “inspired” by RW. As with iWeb, the basic idea is that you choose a theme, then simply drag your images and other media into the page and add your text. When you’re done, hit the Publish button to publish your finished site to your web server via FTP, or to your .Mac/MobileMe account.

RapidWeaver is more flexible and extensible than iWeb, and there are plenty of free and commercial themes available for it. You can use RapidWeaver to create a wide variety of sites, from simple static sites through to blogs, image galleries, slideshows and contact forms. What’s more, third-party plugins extend the feature list further.

I confess I’m not a fan of these template-based page creators. I don’t like the way you can’t edit existing HTML pages, or the way your website is squirreled away in these apps’ non-standard file formats. Furthermore, I don’t find them flexible enough – what if I want to create a web page without a sidebar in RapidWeaver? For that matter, what if I want to build a site that isn’t based on a predefined template at all? (Well I guess there’s always Coda for that!)

There are also a few quirks about RapidWeaver itself that irritate me: Why can’t I insert an image via a menu option? (We don’t all love dragging and dropping.) What’s with the separate Edit window? Why can’t I edit my text in the same WYSIWYG window?

That said, I’m probably not RapidWeaver’s target market. I prefer to code my websites by hand for flexibility, and am comfortable with HTML and CSS. If you just want to get a site out the door, don’t want to get bogged down in the niceties of cross-browser CSS, and don’t mind its inherent inflexibility, then RapidWeaver could be just the ticket for you. It really does live up to its name, letting you put together a nice-looking website very quickly. And the XHTML it generates looks halfway decent too – rare for this type of software.

Other apps in the template-based creator category that are worth checking out are Sandvox and Goldfish.

Summary

If you don’t fancy spending hundreds of dollars on apps like Dreamweaver, then there are some good options for you, depending on your preferred style of website creation.

If you prefer tinkering with HTML and CSS then check out Coda for a lovely all-in-one solution, while KompoZer is a good bet if you like to edit your web pages as if they were Word documents. On the other hand, if you absolutely abhor HTML and want an idiot-proof, drag-and-drop way to build your site – and you don’t mind being constrained a little along the way – then give RapidWeaver or iWeb a go.

This entry was posted on Thursday, July 17th, 2008 at 10:40 pm and is filed under Software. You can follow any responses to this entry through the RSS 2.0 feed. Both comments and pings are currently closed.