Revenue Journal®

I started using WYSIWYG Web Builder recently. It's an intuitive, non-irritating web page mockup tool that makes it easy for text approvers to work with the files.

You can quickly create website pages, in a matter of minutes, placing text, links, and graphics exactly where you want them on the page. The underlying HTML code is generated automatically, as you lay out the page and make changes.

Web Builder can be downloaded (for a free 30-day trial) from the company that created it (Pablo Software Solutions). I found it through a great site called SnapFiles, a site that showcases downloadable tools.

I'm currently helping several clients redesign their websites. I sent the marketing guy at one company a link to the Web Builder software. A couple of minutes later, I got this email: "This is a gas!" A few minutes later, I got another one: "Not satisfied? Make the edits! Yahoo!"His enthusiasm is justified. Here's a screen that I created for this article. It literally took me 3 minutes. I threw in a button and some other web page artifacts, just so you could see that it can handle things more sophisticated than just text. You just click on the button tool, put the cursor where you want the button, and drag and release. The button appears. You can edit the text on it with one click.

Web Builder as a reviewing tool

When it comes to writing copy and sending it around for review, marketers automatically turn to Word. Word makes copy review relatively easy with its "track changes" function. But Word is not the best tool for laying out a web page, for two reasons.

First, it really isn't a page layout program. Word does very strange, seemingly random things with placed images and sidebars. You can spend more time fussing with Word idiosyncrasies and formatting issues than you spend typing your document.

Second, the HTML code Word generates is bloated. To test the difference between code generated in Word and code generated in Web Builder, I typed one sentence into a Word document, then generated HTML for that document. I did the same thing with Web Builder.

The code generated by Web Builder was only 11 lines, and it contained just what you would want - the typed-in sentence, and the font and page placement properties for that sentence.

Without fussing with the "save as" settings, the code generated by Word ends up being 107 lines long. Even using the best settings, the Word code was still 25 lines, and was filled with Microsoft's own obscure tags (i.e., "MsoNormal") that need to be deciphered into standard HTML tags - so you don't need a Microsoft secret decoder ring to work on your pages.

The Word code saved the non-fussing way included all sorts of things that you would probably want to remove from your web page, such as "document properties" (who created the document and when it was created, etc.) in the form of XML metatags. Unnecessary code gets in the way every time you want to edit your web pages, it increases your page downloading times, and it takes up more room on your server.

What about document page layout programs like QuarkXPress? If you're already up to speed on Quark, you could create web page mockups pretty quickly. But Quark does not have web-specific items, such as navigation buttons, built into the program. And you'll have to buy separate HTML code generation software to generate HTML.

Plus, your text reviewers/approvers won't be able to make changes to your Quark files unless they also have a copy of this expensive ($1045) program. Remember, we're not just talking about creating mockups - after all, you can do that in Photoshop. We're talking about people reviewing and editing the copy in your mockups. I can guarantee that your typical higher-level executive will have no interest in learning QuarkXpress. It is not an intuitive program. Web Builder, on the other hand, is free, and anyone who uses Word will be able to figure out how to make basic edits to the copy you've placed in Web Builder pages.

When you send out website copy for review, it's essential that the copy is presented just as it will appear on the screen. People find it difficult to review web copy that is presented in manuscript form. They struggle to visualize the finished page. The writer's attempts to describe it ("this copy would appear to the right of the search box") just don't conjure up a clear enough picture. Those same people look at the same copy, presented as it will be displayed on a page, and say, "Oh, OK, I see. Sure. This looks good. I'd just change this here and here, and you're done."

Web Builder makes it easy to lay out text boxes without worrying much about the "look and feel." You can place things where they should logically appear, without fussing over the graphics, so your reviewers can focus only on the text and the actions that the visitor would take. Otherwise, it's easy to end up with pages dominated by pretty pictures and copy/navigation that doesn't make sense to the visitor or provide your web visitors with the information they're looking for.

Graphic decisions can - and should - be made separately. As we all know, changing copy on a text-only document is much easier than changing copy after graphic elements have been added.

Web Builder has its quirks, of course, which you'll run into as you use it. Fortunately there's a decent user forum at http://www.pablosoftwaresolutions.com/forum that will answer most of your questions. But compared to other methods, this program is the best method I've found so far to create copy-focused web pages, send them around for review, and end up with decent underlying HTML code.

Note: When I first wrote this piece, the program was free. As of November 2006, they are charging $29.95 for it. A bargain.