It has been three years since I did my review of Mozilla Composer, a free WYSIWYG web editor, on thesitewizard.com. In that period, the source code for Composer has been taken out of the Mozilla Suite and revised so that it can work as a standalone application. The program has also been improved, some of the minor complaints that I had about the old Composer appear to have been fixed, and many new features added. This new standalone WYSIWYG web editor is named Nvu.
Nvu (pronounced as "N view") can be obtained, free of charge, from [update: link removed, see box below for reason]. There's also a tutorial on How to Design a Website with Nvu on this site.
Update (12 September 2008): Nvu has been officially discontinued and is no longer available for download. Please use KompoZer, a free updated version of Nvu (with a new name) instead. See the KompoZer tutorial, How to Design and Publish Your Website with KompoZer, for details.
WARNING (16 January 2009): do NOT download Nvu from some random site on the Internet that you dug up from a Google search. Some of those sites may be scam sites, asking for donations for Nvu or asking you to pay for some additional software. You don't even know if those downloads install some viruses or malware on your system as well. Always get software from their official sites only. Since there are no longer any official sites for Nvu, please use KompoZer instead. (KompoZer is really Nvu anyway. It's just a name change to avoid trademark problems, along with some fixes to remove bugs in Nvu. It's also free.)
I used Nvu 0.90 (the Windows version) for this review. Please note that this is an early development version (even pre-Beta, which means that it's not ready for general public use since things are still being added, changed and tested), so there are bugs in its functionality. Although I encountered a few bugs as I tested the editor, for the most part, I will not mention the bugs here since they will probably be squashed by the time the release version is out.
I'm reviewing this from the point of view of its being used as a tool by novice web designers to create a website. Such a web designer will not know how to read or write "raw" HTML or CSS code and will rely on the WYSIWYG component to do all the work.
| WYSIWYG Features | Supported? |
|---|---|
| Generates CSS Code (eg, for font changes, etc) | Yes |
| Support creation of columns in CSS with WYSIWYG interface | No |
| Arbitrarily drag and drop graphics to any location | Partial |
| Table Management | Yes |
| Form Management | Yes |
| Built-in Publishing (FTP) | Yes |
| Advanced Features | Supported? |
|---|---|
| View/Edit HTML Source | Yes |
| CSS Editor | Yes |
| Generates valid HTML Code | Yes |
| Support for Templates | Yes |
| Support for Multiple Websites | Yes |
Details for the above follow in the sections below.
If you are familiar with Mozilla Composer, Nvu is not much different in terms of user interface. You are presented with a blank screen, much like a word processor, where you can proceed to write your page and insert graphics. Facilities that you typically need to create a page, such as the insertion of links, images, tables and forms, are available either from the toolbar, the menus or keyboard shortcuts, which make the editor convenient to use for people who are accustomed to working in different ways. For example, novices who like big self-explanatory buttons will find the toolbars helpful, while seasoned users who prefer not to lift their fingers off the keyboard can operate almost entirely using the keyboard. (You still need to use the mouse for some things: for example, you cannot switch between Normal, Tags, Source and Preview modes using the keyboard in Nvu 0.90.)
More so than its predecessor, Mozilla Composer, it is possible to create your entire site using Nvu's WYSIWYG editor. Basic tasks like insertion of images and links are easily accomplished, while more complex tasks such as table management are made easier with the use of the WYSIWYG interface.
Nvu also allows you to easily switch between the WYSIWYG editing mode ("Normal" mode), the HTML source mode where you can view the HTML code that the web editor generates ("Source"), a preview mode which allows you to see the page as the Gecko engine (the browser engine that powers the Mozilla browser and Firefox) would render it, and a "Tags" mode (which mystifies me till this day as to its purpose for existence) that shows your page with the HTML tags highlighted.
Nvu's table management is, in my opinion, one of its strongest features. Creating a table, resizing it, adding rows to it is fairly easy. For example, resizing the table to a different fixed size is a matter of dragging the edges inwards or outwards. You can add rows to an existing table pretty much the same as you can in word processors like Microsoft Word - just tab from the bottommost cell in the table and another row is automatically created for you.
The only faults I can find with it at this time, for this version, are relatively minor. For example, the default width for the table that is created is only 100 pixels. In my opinion, the editor should leave the table size unspecified by default, allowing the browser to resize the table to suit the content. In any case, as I said earlier, this is a minor issue: it's a relatively simple matter to either resize the table with your mouse, or, if you prefer relative sizes, to invoke the table properties page with the "Table | Table Properties" menu and adjust from there.
Form management is new in Nvu (that is, relative to Composer). The interface allows you to create forms for your site along with elements that you usually need for a form, like buttons, text input fields, text areas, etc.
As it stands in this development version, it is somewhat buggy, but I guess it will be fixed before Nvu reaches its release version. For example, while you can create a button using the interface, there is no way for you to specify the text to appear on the button using the WYSIWYG interface. Or at least, it's not obvious to me how you can do it, short of switching to the Source mode and adding it between the <button> and </button> tags. There are other glitches, but that is to be expected for a pre-Beta.
Nvu's CSS support, while improved over Mozilla Composer in some respects, must be counted as partial. On the plus side, all presentational aspects designed in the WYSIWYG editor appear to use CSS. For example, fonts, table sizes, etc, are all done using CSS.
The major failing in its CSS support is, however, its lack of support for users to design a multi-column layout using the WYSIWYG interface. As far as I can tell, there is no way (in this version) to create DIV blocks (or "layers" as commercial WYSIWYG web editors like DreamWeaver call it) that you can position arbitrarily. Sure you can invoke the CSS editor to do it yourself, or you can type it manually into the source editor, but a user who does not know CSS would have to resort to using the old metaphor of tables to create a site with more than one column. Bear in mind that the creation of multiple columns for layout is not an esoteric feature that only a few web designers want - it is a design used by many websites you see today.
Related to this is the web editor's inability to arbitrarily position a graphic at any point in a document. That is, you cannot drag an image and put it at any spot in the window. The position on the page where the image will land depends on the flow of your document. You cannot, thus, drag it (say) to the center of the screen and expect the editor to create the necessary CSS code to position it at the spot.
Having said that, in case someone new to web design is reading this, I must reiterate that it doesn't mean that there is no way to do these things in Nvu in the WYSIWYG mode. These failings merely relate to Nvu's CSS support in the WYSIWYG mode. You can still accomplish arbitrary positioning of images and create multi-column sites using the age-old method of using invisible tables to lay out your site.
Nvu includes built-in FTP support that allows you to upload your pages to your web host. It is usable as far as built-in FTP clients go and suffices for the basic task of uploading your pages to your site.
There are numerous other features in Nvu. I will only mention the following:
CSS Editor
The web editor includes a built-in CSS editor that allows you to create your CSS styles interactively. It requires you to have a basic understanding of CSS so is probably only useful for people who already know CSS and just want something interactive to write the style sheet for them.
Templates
Nvu comes with support for templates. You can, for example, create a basic layout that you want for all your pages and save it as a template file. That template can then be loaded for each page you create for your site.
Table of Contents
The editor is able to generate a table of contents from all the header elements (eg H1, H2, etc) in your current document. It may be a useful feature if your document is long, and you want to have a table of contents at the beginning that links to various sections on your page.
Markup Cleaner
The Nvu web editor has a facility called "Markup Cleaner" which is able to remove some of the artifacts introduced by the WYSIWYG editing mode, such as empty blocks and trailing <br> tags. It's better than nothing, although when I tested it, it wasn't able to remove all the empty blocks or trailing <br> tags the Normal mode editor created, even when run a few times. (It needed to be run a few times in succession because each run appeared only to catch some of the instances of the things it was suppose to clean.)
Nvu is an easy-to-use free WYSIWYG web editor with many features that allow you to create and maintain a fully functional website, complete with forms. Its current packaging as a standalone web editor, divorced from the Mozilla Suite in which it was born, is a factor in its favour, since it is now possible to recommend people to use it without introducing needless confusion. As it stands, it's primary deficiency is that it does not allow the user to create and arbitrarily position DIV blocks (so that one can, for example, create multiple columns and position graphic images), but this lack can be worked around by using other facilities already provided by the editor.
Copyright 2005-2014 by Christopher Heng. All rights reserved.
Get more free tips and articles like this,
on web design, promotion, revenue and scripting, from https://www.thesitewizard.com/.
Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at https://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.
This article is copyrighted. Please do not reproduce or distribute this article in whole or part, in any form.
It will appear on your page as:
Review of Nvu, a Free Standalone WYSIWYG Web Editor
