Website Options for Nonprofits — Part 2: Web Editing Software

A Home Button

This is the sec­ond in a three-part series dis­cussing web­site options for nonprofits.

Part 1 gave back­ground infor­ma­tion about what a web­site really is and dis­cussed options for where yours can live.

But whether you’re build­ing a new site or need to update an exist­ing site, you need some way to edit pages. Today we’ll dis­cuss your options for edit­ing or cre­at­ing a tra­di­tional web­site: one where some­one (you, a vol­un­teer, or some­one you hire) hand-crafts a web­site using a web edi­tor installed on their computer.

Series overview

  • Part One cov­ers fun­da­men­tal con­cepts and con­sid­ers tra­di­tional web­site host­ing options.
  • Part Two cov­ers options for cre­at­ing web pages using a tra­di­tional web edit­ing program.
  • Part Three cov­ers cover tools that let you build a web­site using just your web browser.
Who this arti­cle is for.
  • Peo­ple who don’t have a web pres­ence but want one.
  • Peo­ple who have a web pres­ence and want to eval­u­ate tools for updat­ing it.
What to expect.
  • A quick refresher on what a web page is.
  • A brief look at arcane tools for the hard-core enthusiast.
  • A dis­cus­sion of tools that nor­mal peo­ple could use.
Top­ics.

What is a web page, really?

As we dis­cussed last time, this is what a web page really looks like in its secret heart:

Web page source code

Web page source code

A web page is one or more files that describe in cryp­tic text how the page should look. Web browsers fig­ure out how to turn the cryp­tic text into some­thing a human being wants to look at. For a full review, check out What is a web page? in Part 1.

That leaves us won­der­ing how to cre­ate the cryp­tic doc­u­ment. That’s what this post is about.

Doin’ it old-school

What’s the most down-home, hard-core, eat-my-shorts way to make a web page? By typ­ing the cryp­tic code into a blank page.

By hand.

Nearly twenty years into the era of the World-Wide Web, many seri­ous web devel­op­ers build web pages the same way peo­ple did in Web Year Zero: by typ­ing the cryp­tic code, largely from mem­ory, into a text edi­tor. That’s how I started in the nineties, and that’s how I still do a good part of my web development.

Gen­er­ally these are sim­ple text edi­tors with some pow­er­ful mutant fea­tures added to make web page devel­op­ment a lit­tle easier.

Tools in this class include Notepad++, UltraEdit, and my per­sonal favorite, TextPad.

This option is absolutely not for the tech­ni­cally curi­ous or the faint of heart, but for peo­ple who are seri­ous and excited about learn­ing the guts of web programming.

A more rea­son­able approach: WYSIWYG

The per­cent­age of peo­ple who are that into build­ing web pages is awfully tiny, and you’re prob­a­bly not in it.

You and most other peo­ple would prob­a­bly rather build a page by doing some­thing more like writ­ing a Word doc­u­ment. Thank­fully, there are pro­grams that let you do that.

Or rather, there are pro­grams that let you do it to a cer­tain degree. I’ll end this post talk­ing about the trade-offs of these tools.

A dog in a curly-haired wig

A Wizzy Wig

Image credit: heather

What’s WYSIWYG?

I’m talk­ing here about “WYSIWYG edi­tors” (pro­nounced “wizzy-wig”), as in What You See Is What You Get.

The goal is to give you an expe­ri­ence like edit­ing a word pro­cess­ing doc­u­ment, let­ting you mess with text and images with­out wor­ry­ing about the fact that they’re really on a web page.

With a solid WYSIWYG editor:

  1. When you open a page to edit it you can expect it to look rea­son­ably sim­i­lar to the page in a web browser.
  2. If you edit the page you can be rea­son­ably con­fi­dent that your changes will have roughly the effect you intended.

Here are a few options.

Microsoft Word

  • $0 if you already own it, which is rea­son­ably likely
  • $125 from Ama­zon
  • $24 from Tech­Soup (non­prof­its only; full Microsoft Office suite)

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.

Every­one I know who’s tried this has ended up very, very sad. In fact, just typ­ing this sec­tion is enough to make me uneasy. Like a zombie’s star­ing hun­grily over my shoul­der or something.

My strong advice: never use Microsoft Word to edit a web page. Ever. Seriously.

Screaming man

This man used Microsoft Word to edit a web page.

Image credit: cdresz

Three free­ware options

These three tools are free, light­weight, and designed for non-technical users. They work on Win­dows, Mac, and Linux.

Because of their focus on the basics, these tools give you only a frac­tion of the bells and whis­tles you’ll find with a pro­fes­sional edit­ing tool like DreamWeaver or Expres­sion Stu­dio, which are dis­cussed below. But they do a decent job of let­ting you cre­ate or edit a page.

Amaya and Sea­Mon­key are inter­est­ing crit­ters: they’re both web browsers and web page editors.

The SeaMonkey Editor

The Sea­Mon­key Editor

Microsoft Expres­sion Studio

(Share­Point Designer is essen­tially the same soft­ware pack­age as Expres­sion Stu­dio, but it adds fea­tures for inte­gra­tion with Microsoft Share­Point.)

Expres­sion Stu­dio was cre­ated with pro­fes­sional web devel­op­ers in mind, though it’s cer­tainly pos­si­ble for nor­mal human beings to use it too. Unless you’re a seri­ous web geek expect to use only a small frac­tion of the power and fea­tures it has to offer.

That said, among its myr­iad other fea­tures it does offer solid WYSIWYG edit­ing, so you can use it to edit or cre­ate web pages with­out hav­ing to write cryp­tic code.

The ben­e­fit of using a professional-grade tool is that, even though you’ll be rid­ing a raft of fea­tures that you’ll never use, you know lots of pro­fes­sion­als have used it for lots of years, which has helped to work out some kinks.

Microsoft Expression Studio screenshot

Microsoft Expres­sion Studio

Adobe DreamWeaver

We round out the parade with DreamWeaver, the most pow­er­ful web page edit­ing tool on this list.

As with Expres­sion Web, DreamWeaver was devel­oped with pro­fes­sional web devel­op­ers in mind, so the same ben­e­fits and caveats apply.

I use DreamWeaver and like it, but I’m in their geeky tar­get audi­ence. How­ever, it’s more feature-packed and there­fore poten­tially intim­i­dat­ing than the other tools. Still, it’s a good product.

Adobe DreamWeaver screenshot

Adobe DreamWeaver

What’s the catch? The trou­ble with WYSIWYG

So you’ve got a pro­gram that lets you edit a web page as though you were edit­ing a Word doc­u­ment. What’s not to like?

Catch #1: The bro­ken bent promise of WYSIWYG

Let’s go back to what I said about WYSIWYG edi­tors earlier:

  1. When you open a page to edit it you can expect it to look rea­son­ably sim­i­lar to the page in a web browser.
  2. If you edit the page you can be rea­son­ably con­fi­dent that your changes will have roughly the effect you intended.

Notice the wig­gle words?

Rea­son­ably” and “roughly” aren’t ring­ing endorse­ments. Even the best WYSIWYG edi­tors some­times do bewil­der­ing things (see the side­bar for examples).

With the first gen­er­a­tion of WYSIWYG edi­tors I was annoyed that their cre­ators couldn’t get it right. Over the last fif­teen years I’ve come to real­ize WYSIWYG edit­ing is just a very com­pli­cated thing to pull off.

Catch #2: The lie half-truth of hid­den complexity

The the­ory: WYSIWYG edi­tors let you cre­ate or edit a web page with­out hav­ing to know any­thing about the cryp­tic HTML code that lurks behind the scenes.

The real­ity: not so much.

Don’t get me wrong. WYSIWYG edi­tors are remark­able things, and do a great job of hid­ing the tech­ni­cal details when they can.

But those details are always just below the sur­face, and they some­times break through.

This por­tion of Kom­pozer screen­shot illus­trates the point.

An image of the Kompozer editor

An image of the Kom­pozer editor

You can see the web page you’re edit­ing, but it’s over­laid with yel­low tags. What does H1 mean? How about LI? DIVDT?

These are extremely help­ful queues if you under­stand the HTML code under­ly­ing the page. If you don’t, they can be unhelp­ful and intimidating.

That barely-concealed tech­ni­cal com­plex­ity is nec­es­sary because really, you’re not edit­ing a Word doc­u­ment. You’re edit­ing a hyper­text doc­u­ment that acts a lit­tle like a com­puter pro­gram in some ways, one that’s awfully par­tic­u­lar about its behind-the-scenes tech­ni­cal structure.

The com­plex­ity is also good since some­times you, a vol­un­teer, or some­one you hire needs to use it.

Still, most of the time when the edi­tor reminds you that an item in a num­bered list is really an “LI” behind the scenes, you prob­a­bly wish you could just do this:

Woman with fingers in ear and eyes closed tight.

Aiigh! It keeps talk­ing HTML! Make it stop!

Image credit: hebe­design

So. Is a WYSIWYG edi­tor right for you?

The sim­ple answer

Try one and see.

Some are free. The ones that aren’t often offer a free trial.

The more thought­ful answer

I have very mixed feel­ings about these tools for non-geeks.

Just about every time I talk with non-geeks about using one of these tools, I hear an edge of ten­sion in their voices.

If you’re edit­ing an exist­ing site, chang­ing just the words and not trick­ier things like struc­ture and nav­i­ga­tion, WYSIWYG edi­tors can do a great job for you.

If you’re cre­at­ing a new site, and if your needs align with the tool’s fea­tures, you can make a good, basic site for the price of some learn­ing and the occa­sional mistake.

Here’s why I have reser­va­tions: just about every time I talk with non-geeks about using one of these tools, I hear an edge of ten­sion in their voices.

They talk about feel­ing fairly com­fort­able with one kind of update, or with updat­ing one par­tic­u­lar page. But they also worry that they might be a key-press away from break­ing some­thing, or a mouse-click away from some­thing mys­te­ri­ous hap­pen­ing that leaves them scratch­ing their heads.

To get a basic com­fort with a WYSIWYG soft­ware pack­age you need to devote time to learn­ing it, and you need to use it often enough to remem­ber how it works. To be really com­fort­able with it you also need to under­stand the under­ly­ing technology.

Which is exactly the tech­ni­cal stuff that you were using a WYSIWYG edi­tor to avoid in the first place.

Is there hope?

Absolutely!

First, WYSIWYG edi­tors are good tools, and a good option for many peo­ple. Even with­out a tech­ni­cal back­ground or sig­nif­i­cant train­ing, you can learn to use them for at least the basics.

But there are other tools that I’ll dis­cuss in the third part of this arti­cle: tools that give you a dif­fer­ent kind of WYSIWYG—and more impor­tantly, tools that I’ve heard non-geeks dis­cuss with­out that edge of ten­sion in their voices.

There are 3 responses to this post.

By Janna Owens on December 16, 2010 at 10:55 am

After get­ting a fan­tas­tic foun­da­tional edu­ca­tion on the mys­te­ri­ous world of design­ing web­sites, I am really anx­ious to read Part 3 so I can begin a web­site!!! Thanks so much for the guid­ance so far :)

By Randy Wood on February 3, 2011 at 12:02 pm

That must make me a Geek. I use Notepad++ for most of my editing!

 

By Andy on February 3, 2011 at 2:55 pm

No ques­tion about it, you’re a geek. Con­grat­u­la­tions or con­do­lences, depend­ing on your point of view.

You aren't currently logged in. You can use the fields below to post a comment without logging in or registering, or you can log in or register now.




By submitting a comment here you grant Blazing Moon a perpetual license to reproduce your words and name/web site in attribution. Inappropriate comments will be removed at admin's discretion.

Blazing Moon RSS Feed