By Tim Schürmann
If you are familiar with HTML commands, you can use a simple text editor such as Emacs, Vi, or Kwrite to design your homepage. Most text editors recognize the HTML command set and give you syntax highlighting for tags.
For a few simple pages, this approach might look useful, but you will soon start to lose track of large-scale projects. Luckily, many third party tools provide additional features for more complex projects. Text-based HTML editors, that is text editors that specialize in HTML, expect the user to provide the necessary HTML skills. In contrast, web generators allow you to create a page as you would with a graphics package. After completing the layout, the tool then generates the Internet page. The results in the browser may be completely different from the view in the web generator due to the restrictions that HTML imposes. So-called WYSIWYG (What You See Is What You Get) editors provide a useful compromise. Again, you can click and point to create the layout, but the editor restricts you to HTML compliant features.
The number of Linux applications in both categories is fairly low. There are just a handful of WYSIWYG editors, and I have yet to find a true web generators. The figures for text-based editors are better. In this article, I'll show you some of the HTML editor options for Linux.
The August HTML editor [1] (Figure 1) is an old timer, and not exactly a famous representative of its species. The latest version, 0.63b, dates back to 2001, but it still does the job perfectly. August simply requires a working Tcl/Tk system, and this is something that any major distribution will give you. The documentation additionally recommends Image Magick and Weblint as external tools. August uses the former to check image proportions, and Weblint verifies the layout.
After upacking August, enter ./august in the new august0.63b.src directory to launch the editor. The GUI looks very much like a normal text editor with syntax highlighting. August has input boxes for some tags, allowing users to click to specify the required parameters - filenames for links, for example, or the aspect for an image.
August can save arbitrary strings of text as templates that form the basis for creating new documents. The default template, Basic Structure, creates a HTML version 3.2 document, although August understands both HTML 4.0 and CSS.
August can launch a selection of web browsers to Preview the results. The selection includes Netscape, Konqueror, KDE help, and the Lynx text browser. Users can extend the list. Selecting Tools | Weblint Check tells August to verify a file, but the program lacks a spellchecker. The help only gives you a rough overview of the program's features.
The Bluefish [2] HTML editor (Figure 2) has a GTK interface that perfectly matches a Gnome environment, and the program has an impressive set of features that have made it popular with users who favor the Gnome desktop. This said, the sheer mass of options can make life hard for newcomers. On the positive side, Bluefish supports customization, allowing web authors to assign frequently used functions to the quick-access toolbox. The program also has project management facilities and a style sheet manager. Bluefish does not have an integrated preview mode, and it uses an external browser.
The Dialogs menu has an assortment of wizards that handle critical HTML elements. The Quick Start wizard gives you a selection of meta-tags that fill the HTML file header with details of the author or date. Bluefish also has a wizard to help you publish photo collections. The wizard takes a pile of image files as input and gives you a page with thumbnails as output. None of the other candidates in our test had a comparable feature.
Other details reduce the web designer's load. For example, the extended Replace function automatically converts non-standard characters to HTML code. The dialog will replace expressions in any open files, if needed; this is a useful tool if you need to modify all the subordinate pages in a project at the same time.
Although Bluefish was designed for use with HTML, it can handle other formats. Syntax highlighting also works for XML and JavaScript, as well as for the C and Python programming languages.
Assuming you have installed Ispell, Bluefish will also spell check your documents. It uses the external Weblint or Tidy programs to validate the code itself. To avoid oversights, web authors can enable a number of input aids. For example, Bluefish will close any tags you have opened, or convert tags to lower case. Bluefish does not have online help, but you'll find an excellent manual at the project homepage.
Just like August, the Erwin [3] editor mainly focuses on performance and clarity (Figure 3). The project was founded in 1999, although the pace of development is fairly slow. The editor looks a lot like Bluefish without ever achieving the same kind of functionality. For example, Erwin has just one Quickstart wizard, and a handful of rudimentary tools for standard elements such as table and image integration.
Just like August, Erwin uses icons or menu items to add formating instructions. Pressing [Ctrl-P] closes the current tag, but without actually checking to see if this is actually necessary. Erwin also lacks a validation routine for the HTML document, but at least it has an integrated preview.
The editor that answers to the unwieldy name of (X)HTML-Format [4] is based on the multi-platform Java programming language and thus requires a working Java environment. The program is free, but the author has not disclosed the source code.
The features available through (X)HTML-Format are comparable to the features provided by Bluefish. The tool can replace text strings across multiple files and automatically convert non-standard characters to HTML code; (X)HTML-Format also has project management and an internal preview - although it does not render even the most simple of pages correctly. On the upside, you can opt for an external browser as your preview tool.
The Tools menu has a collection of useful programs and links, including search engine registration. Most menu items and many other program functions simply link to the developer website. The Edit | Format option is a useful exception to this rule, taking unformatted code and returning readable results.
(X)HTML-Format stores recurring constructions as Code Snippets. (X)HTML-Format also has wizards in the form of simple dialog boxes for common elements. The Quick Document feature creates the structure for a new document, giving you meta-tags, but lacking the DOCTYPE definition that the HTML standard stipulates. On the upside, (X)HTML-Format has a CSS editor with useful settings.
When you click on the paragraph icon, (X)HTML-Format inserts an opening <p> tag. Users have to close the tag manually or select a redundant menu item titled Edit | <p>|</p>.
The online help is useful, and it will take you to the Internet-based SelfHTML intro at the click of a button.
KDE's counterpart to Bluefish is known as Quanta+ [5] (Figure 4). Quanta+ is based on the free version of the commercial Quanta Gold editor, although development is no longer related to the commercial product and continues under a free license. In its KDEWebdev guise, Quanta now forms the core element of the KDE web development module.
The version number is oriented on the accompanying KDE version. As all major distributions provide Quanta+; you should use your distribution's package manager for the installation.
Quanta+ has more options than its Gnome Bluefish counterpart. Unfortunately, the feature overdose does make Quanta+ hard to work with and difficult to learn. The interface often displays multiple windows within the main window. For example, you always have the document structure, the online reference, and explanations for all HTML, PHP and JavaScript commands on view. The manual is less helpful and mainly describes the installation.
The program provides all the functionality you could wish for. For example, Quanta+ will upload your homepages directly to a server. Besides syntax validation, provided by the external Tidy tool, Quanta+ also has a link checker that checks the validity of any links in the document. Quanta+ also integrates the KImageMapEditor for image map editing. Additionally, Quanta+ provides a CVS version management tool based on Cervisia, making it a good choice for group projects.
Quanta+ supports visual modifications in the so-called VPL editor. To do this, users can point and click to put required elements together, although text input is not supported in this mode. As this view is still under development, you might like to restrict any experimenting to copies of your original documents.
Wizards help you set up common elements. For example, the quickstart wizard can handle various meta-tags and Document Type Definitions (DTDs). The CSS editor is easy to use, allowing users to put together a style sheet from a palette of options using a simple point and click approach.
Quanta provides automatic routines to ensure compliance with HTML conventions, such as modifying the opening tag when an author changes a closing tag. This feature allows authors to change bold text to italics just by modifying a single tag. Programmers used to working with integrated developer environments will expect to find auto-completion during command input, and Quanta+ will not disappoint you.
Quanta+ still has not completely removed one major issue known to affect previous versions. In the past, the program was known to crash regularly; this no longer happens as often as it did, but it still happens. So make sure you back up your work regularly.
All of the tools we have looked at thus far assume HTML skills on the part of the user. If you prefer to avoid manhandling source code, you might prefer one of the following WYSIWYG solutions.
Firefox was basically designed as a lean browser, and it therefore comes without an integrated HTML editor. cuneAform [6] is a plug-in that adds this functionality to Firefox. To install cuneAform in Firefox, select Tools | Extensions | Get more extensions. This opens a homepage where searching for cuneAform will take you to a link for the plug-in. You can then click Install now to take care of the details.
cuneAform is controlled via icons. At this time of writing, the editor only understands the most basic of HTML elements. In many ways, cuneAform is reminiscent of Mozilla Composer.
The Mozilla Internet Suite includes the Composer [7] HTML editor. Unfortunately, the future of the editor is uncertain. The Mozilla Foundation has announced that it will be discontinuing development of the whole Mozilla branch. The current version 1.7 is still maintained, and Composer still performs well in comparison with other HTML editors. After installing the Mozilla suite, go to the Window menu to look for the editor.
The Composer interface has four view modes, which are enabled via tabs at the bottom of the window. The first tab takes you to the GUI-based editor view, which adds guides and boxes to tables, allowing authors to scale these elements using a mouse. The HTML Tags tab also displays the homepage in the layout used later, but it adds the corresponding tags. HTML Source gives you a rudimentary text editor that does not even support syntax highlighting and fails to fulfill even minimal requirements.
Finally, the Preview tab shows you the results in the Mozilla browser. All elements and tables remain editable in all four views, and any changes are immediately reflected in all other tabs.
Working with Composer is just like using a simple word processor; anyone with experience using this kind of software should quickly feel at home. On the downside, the WYSIWYG editor does not support the composition of more complex pages.
Composer provides some useful wizards and input tools for most HTML elements. Some editing of the source code is inevitable if you are using another language, such as JavaScript, although an optional extension for CSS is available. On the downside, manual editing is not reflected in the automatically generated table of contents.
Composer does not have a project management feature, and that makes large-scale projects tricky. Again, on a positive note, the program does support automatic uploads to FTP servers.
The Linux distributor Linspire developed the NVU [8] HTML editor (Figure 5), version 1.0 of which was released recently, on the basis of Composer. Just looking at the main window reveals the close relationship to Mozilla Composer. For example, NVU uses the four views that you may be familiar with from Composer. This said, the views have learned some new tricks: for example, the NVU source code editor now supports syntax highlighting, and the other views display the page dimensions on the left and at the top of the window. The NVU developers have also extended most dialog boxes and completely redesigned some. For example, users now add a table by drawing a frame with the mouse. The CSS editor, which was an optional extension with Composer, is a standard feature with NVU.
NVU not only validates your source code, it can also clean your source code up. This includes removing redundant newlines, which are caused when an author composes a page in the WYSIWYG editor. This function is useful for applying the finishing touches to a homepage that you have already completed.
Just like the Firefox browser, NVU also supports extensions and themes from the http://nvuext.mozdev.org page, where you can select new features and outfits. These extensions include additional dictionaries for integrated spell checking. The help feature is comprehensive and definitely one of the best of all our test candidates.
The World Wide Web Consortium itself develops the Amaya HTML editor [9]. The current version is targeted at XML and XHTML, although it understands older standards and HTML versions.
Amaya is not included with every Linux version, but you can obtain a copy of Amaya through W3C. In contrast to the other candidates in our test, Amaya goes to great lengths to comply with W3C standards, although the interface is quite quirky at times. For example, Amaya opens a new window for each view. Besides the WYSIWYG mode, there are source code and page hierarchy views (Figure 6), an internal preview, an alternative text browser view, and a list of all links. Amaya does not automatically update the views; in fact, you need to click on Synchronise to sync the current window content with all other modes.
Amaya converts documents to the XHTML standard at the click of your mouse, automatically modifying the syntax at the same time. This said, you might like to verify that the results are correct. Another advantage that Amaya offers in comparison with other editors is its ability to add annotations to pages. These annotations are comments for elements and text passages that the web browser only displays if needed.
Choosing the right HTML editor is not easy. Bluefish and Quanta+ definitely take the lead over the other text-based editors described in this article, although their feature-richness comes at the price of complex controls.
Users with older hardware, or Tcl fans, might prefer August thanks to its frugal use of resources. Erwin is also easy on resources, but neither August nor Erwin gives the kind of functionality you would expect of a modern editor. This can be difficult if you need to encode non-standard characters: if you violate HTML conventions by using non-standard characters such as German umlauts, other editors may not be able to handle your results due to a lack of UTF-8 support.
(X)HTML-Format left us with mixed feelings. Some functions seem immature, and this clouds the positive overall view. On the upside, the tool will run on any operating system, and this could be useful if you want to change operating systems without re-inventing the wheel.
In the WYSIWYG editor stakes, the cuneAform Firefox extension loses out to its competitors. It is fine for patching together a quick and dirty page, but otherwise you will want to use Composer or NVU. The Mozilla editor is useful for smaller pages, but the generated code tends to be cluttered and include redundant tags. NVU's extras put it in the lead.
| INFO |
|
[1] August: http://www.bostream.nu/johanb/august
[2] Bluefish: http://bluefish.openoffice.nl [3] Erwin: http://lisas.de/erwin [4] (X)HTML-Format: http://www.homepagehelper.de/software/html-format (The site is in German; search for (X)HTML-Format through Google to view a translated version.) [5] Quanta+: http://quanta.kdewebdev.org [6] cuneAform: http://cuneaform.mozdev.org [7] Mozilla Composer: http://www.mozilla.org/editor [8] NVU: http://www.nvu.com/ [9] Amaya: http://www.w3.org/Amaya |