This is the second in a three-part series discussing website options for nonprofits.
Part 1 gave background information about what a website really is and discussed options for where yours can live.
But whether you’re building a new site or need to update an existing site, you need some way to edit pages. Today we’ll discuss your options for editing or creating a traditional website: one where someone (you, a volunteer, or someone you hire) hand-crafts a website using a web editor installed on their computer.
As we discussed last time, this is what a web page really looks like in its secret heart:
A web page is one or more files that describe in cryptic text how the page should look. Web browsers figure out how to turn the cryptic text into something a human being wants to look at. For a full review, check out What is a web page? in Part 1.
That leaves us wondering how to create the cryptic document. That’s what this post is about.
What’s the most down-home, hard-core, eat-my-shorts way to make a web page? By typing the cryptic code into a blank page.
Nearly twenty years into the era of the World-Wide Web, many serious web developers build web pages the same way people did in Web Year Zero: by typing the cryptic code, largely from memory, into a text editor. That’s how I started in the nineties, and that’s how I still do a good part of my web development.
Generally these are simple text editors with some powerful mutant features added to make web page development a little easier.
This option is absolutely not for the technically curious or the faint of heart, but for people who are serious and excited about learning the guts of web programming.
The percentage of people who are that into building web pages is awfully tiny, and you’re probably not in it.
You and most other people would probably rather build a page by doing something more like writing a Word document. Thankfully, there are programs that let you do that.
Or rather, there are programs that let you do it to a certain degree. I’ll end this post talking about the trade-offs of these tools.
I’m talking here about “WYSIWYG editors” (pronounced “wizzy-wig”), as in What You See Is What You Get.
The goal is to give you an experience like editing a word processing document, letting you mess with text and images without worrying about the fact that they’re really on a web page.
With a solid WYSIWYG editor:
Here are a few options.
You can open, edit, and save a web page using Microsoft Word.
You also can drive with your eyes closed.
Doesn’t mean you should.
Everyone I know who’s tried this has ended up very, very sad. In fact, just typing this section is enough to make me uneasy. Like a zombie’s staring hungrily over my shoulder or something.
My strong advice: never use Microsoft Word to edit a web page. Ever. Seriously.
These three tools are free, lightweight, and designed for non-technical users. They work on Windows, Mac, and Linux.
Because of their focus on the basics, these tools give you only a fraction of the bells and whistles you’ll find with a professional editing tool like DreamWeaver or Expression Studio, which are discussed below. But they do a decent job of letting you create or edit a page.
Amaya and SeaMonkey are interesting critters: they’re both web browsers and web page editors.
(SharePoint Designer is essentially the same software package as Expression Studio, but it adds features for integration with Microsoft SharePoint.)
Expression Studio was created with professional web developers in mind, though it’s certainly possible for normal human beings to use it too. Unless you’re a serious web geek expect to use only a small fraction of the power and features it has to offer.
That said, among its myriad other features it does offer solid WYSIWYG editing, so you can use it to edit or create web pages without having to write cryptic code.
The benefit of using a professional-grade tool is that, even though you’ll be riding a raft of features that you’ll never use, you know lots of professionals have used it for lots of years, which has helped to work out some kinks.
We round out the parade with DreamWeaver, the most powerful web page editing tool on this list.
As with Expression Web, DreamWeaver was developed with professional web developers in mind, so the same benefits and caveats apply.
I use DreamWeaver and like it, but I’m in their geeky target audience. However, it’s more feature-packed and therefore potentially intimidating than the other tools. Still, it’s a good product.
So you’ve got a program that lets you edit a web page as though you were editing a Word document. What’s not to like?
Let’s go back to what I said about WYSIWYG editors earlier:
Notice the wiggle words?
“Reasonably” and “roughly” aren’t ringing endorsements. Even the best WYSIWYG editors sometimes do bewildering things (see the sidebar for examples).
With the first generation of WYSIWYG editors I was annoyed that their creators couldn’t get it right. Over the last fifteen years I’ve come to realize WYSIWYG editing is just a very complicated thing to pull off.
The theory: WYSIWYG editors let you create or edit a web page without having to know anything about the cryptic HTML code that lurks behind the scenes.
The reality: not so much.
Don’t get me wrong. WYSIWYG editors are remarkable things, and do a great job of hiding the technical details when they can.
But those details are always just below the surface, and they sometimes break through.
This portion of Kompozer screenshot illustrates the point.
You can see the web page you’re editing, but it’s overlaid with yellow tags. What does H1 mean? How about LI? DIV? DT?
These are extremely helpful queues if you understand the HTML code underlying the page. If you don’t, they can be unhelpful and intimidating.
That barely-concealed technical complexity is necessary because really, you’re not editing a Word document. You’re editing a hypertext document that acts a little like a computer program in some ways, one that’s awfully particular about its behind-the-scenes technical structure.
The complexity is also good since sometimes you, a volunteer, or someone you hire needs to use it.
Still, most of the time when the editor reminds you that an item in a numbered list is really an “LI” behind the scenes, you probably wish you could just do this:
Try one and see.
Some are free. The ones that aren’t often offer a free trial.
I have very mixed feelings about these tools for non-geeks.
If you’re editing an existing site, changing just the words and not trickier things like structure and navigation, WYSIWYG editors can do a great job for you.
If you’re creating a new site, and if your needs align with the tool’s features, you can make a good, basic site for the price of some learning and the occasional mistake.
Here’s why I have reservations: just about every time I talk with non-geeks about using one of these tools, I hear an edge of tension in their voices.
They talk about feeling fairly comfortable with one kind of update, or with updating one particular page. But they also worry that they might be a key-press away from breaking something, or a mouse-click away from something mysterious happening that leaves them scratching their heads.
To get a basic comfort with a WYSIWYG software package you need to devote time to learning it, and you need to use it often enough to remember how it works. To be really comfortable with it you also need to understand the underlying technology.
Which is exactly the technical stuff that you were using a WYSIWYG editor to avoid in the first place.
First, WYSIWYG editors are good tools, and a good option for many people. Even without a technical background or significant training, you can learn to use them for at least the basics.
But there are other tools that I’ll discuss in the third part of this article: tools that give you a different kind of WYSIWYG—and more importantly, tools that I’ve heard non-geeks discuss without that edge of tension in their voices.