sign in sign up
<<
Home , Amaya (web editor), CSS HTML Validator, HTML editor, Mozilla Composer, Nvu

REVIEWS HTML Editors

A tour of HTML Editors SPINNING THE WEB www.photocase.de

The right HTML Editor can save you plenty of time and trouble. Read on for a roundup the best free editors for Linux. the page. The results in the and this is something that any major dis- browser may be completely different tribution will give you. The documenta- BY TIM SCHÜRMANN from the view in the web generator tion additionally recommends Image due to the restrictions that HTML Magick and Weblint as external tools. imposes. So-called WYSIWYG (What August uses the former to check image You See Is What You Get) editors pro- proportions, and Weblint verifies the f you are familiar with HTML com- vide a useful compromise. Again, you layout. mands, you can use a simple text can click and point to create the layout, After upacking August, enter ./ august Ieditor such as , Vi, or Kwrite but the editor restricts you to HTML in the new august0.63b.src directory to to design your homepage. Most text compliant features. launch the editor. The GUI looks very editors recognize the HTML command The number of Linux applications in much like a normal with syn- set and give you for both categories is fairly low. There are tax highlighting. August has input boxes tags. just a handful of WYSIWYG editors, and for some tags, allowing users to click For a few simple pages, this approach I have yet to find a true web generators. to specify the required parameters – file- might look useful, but you will soon The figures for text-based editors are bet- names for , for example, or the start to lose track of large-scale projects. ter. In this article, I’ll show you some of aspect for an image. Luckily, many third party tools provide the HTML editor options for Linux. August can save arbitrary strings of additional features for more complex text as templates that form the basis for projects. Text-based HTML editors, that August creating new documents. The default is text editors that specialize in HTML, The August HTML editor [1] (Figure 1) template, Basic Structure, creates a expect the user to provide the necessary is an old timer, and not exactly a famous HTML version 3.2 document, although HTML skills. In contrast, web generators representative of its species. The latest August understands both HTML 4.0 and allow you to create a page as you would version, 0.63b, dates back to 2001, but it CSS. with a graphics package. After complet- still does the job perfectly. August sim- August can launch a selection of web ing the layout, the tool then generates ply requires a working Tcl/ Tk system, browsers to Preview the results. The

44 ISSUE 59 OCTOBER 2005 WWW.LINUX - MAGAZINE.COM HTML Editors REVIEWS

non-standard ity (Figure 3). The project was founded characters to in 1999, although the pace of develop- HTML code. The ment is fairly slow. The editor looks a lot dialog will replace like without ever achieving the expressions in any same kind of functionality. For example, open files, if Erwin has just one Quickstart wizard, needed; this is a and a handful of rudimentary tools for useful tool if you standard elements such as table and need to modify all image integration. the subordinate Just like August, Erwin uses icons or pages in a project menu items to add formating instruc- at the same time. tions. Pressing [Ctrl-P] closes the current Although Blue- tag, but without actually checking to see fish was designed if this is actually necessary. Erwin also for use with lacks a validation routine for the HTML HTML, it can han- document, but at least it has an inte- Figure 1: Click on the buttons in the August GUI to add HTML tags to dle other formats. grated preview. your document. Syntax highlight- ing also works for (X)HTML Format selection includes , , XML and JavaScript, as well as for the The editor that answers to the unwieldy KDE help, and the text browser. and Python programming languages. name of (X)HTML-Format [4] is based Users can extend the list. Selecting Tools Assuming you have installed Ispell, on the multi-platform Java programming | Weblint Check tells August to verify a Bluefish will also spell check your docu- language and thus requires a working file, but the program lacks a spell- ments. It uses the external Weblint or Java environment. The program is free, checker. The help only gives you a rough Tidy programs to validate the code itself. but the author has not disclosed the overview of the program’s features. To avoid oversights, web authors can source code. enable a number of input aids. For The features available through Bluefish example, Bluefish will close any tags you (X)HTML-Format are comparable to the The Bluefish [2] HTML editor (Figure 2) have opened, or convert tags to lower features provided by Bluefish. The tool has a GTK interface that perfectly case. Bluefish does not have online help, can replace text strings across multiple matches a Gnome environment, and but you’ll find an excellent manual at files and automatically convert non- the program has an impressive set of fea- the project homepage. standard characters to HTML code; tures that have made it popular with (X)HTML-Format also has project man- users who favor the Gnome desktop. Erwin agement and an internal preview – This said, the sheer mass of options can Just like August, the Erwin [3] editor although it does not render even the make life hard for newcomers. On the mainly focuses on performance and clar- most simple of pages correctly. On the positive side, Bluefish supports custom- ization, 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 ele- ments. 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 wiz- ard to help you publish photo collec- tions. 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 - er's load. For example, the extended Replace function automatically converts Figure 2: Editing HTML in Bluefish.

WWW.LINUX - MAGAZINE.COM ISSUE 59 OCTOBER 2005 45 REVIEWS HTML Editors

based on the free The manual is less helpful and mainly version of the describes the installation. commercial The program provides all the function- Quanta Gold edi- ality you could wish for. For example, , although Quanta+ will upload your homepages development is no directly to a server. Besides syntax vali- longer related to dation, provided by the external Tidy the commercial tool, Quanta+ also has a link checker product and con- that checks the validity of any links in tinues under a free the document. Quanta+ also integrates license. In its the KImageMapEditor for image map KDEWebdev editing. Additionally, Quanta+ provides guise, Quanta now a CVS version management tool based forms the core ele- on Cervisia, making it a good choice for ment of the KDE group projects. web development Quanta+ supports visual modifica- module. tions in the so-called VPL editor. To do The version this, users can point and click to put number is ori- required elements together, although text ented on the input is not supported in this mode. As accompanying this view is still under development, you KDE version. As might like to restrict any experimenting all major distribu- to copies of your original documents. Figure 3: Erwin provides few options, but it is very frugal with tions provide Wizards help you set up common ele- system resources. Quanta+; you ments. For example, the quickstart wiz- should use your ard can handle various meta-tags and upside, you can opt for an external distribution’s package manager for the Document Type Definitions (DTDs). The browser as your preview tool. installation. CSS editor is easy to use, allowing users The Tools menu has a collection of Quanta+ has more options than its to put together a style sheet from a pal- useful programs and links, including Gnome Bluefish counterpart. Unfortu- ette of options using a simple point and search engine registration. Most menu nately, the feature overdose does make click approach. items and many other program functions Quanta+ hard to work with and difficult Quanta provides automatic routines to simply link to the developer website. to learn. The interface often displays ensure compliance with HTML conven- The Edit | Format option is a useful multiple windows within the main win- tions, such as modifying the opening tag exception to this rule, taking unformat- dow. For example, you always have the when an author changes a closing tag. ted code and returning readable results. document structure, the online refer- This feature allows authors to change (X)HTML-Format stores recurring con- ence, and explanations for all HTML, bold text to italics just by modifying a structions as Code Snippets. (X)HTML- PHP and JavaScript commands on view. single tag. Programmers used to working Format also has wizards in the form of simple dialog boxes for common ele- ments. The Quick Document feature creates the structure for a new docu- ment, 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

tag. Users have to close the tag manually or select a redundant menu item titled Edit |

|. The online help is useful, and it will take you to the Internet-based SelfHTML intro at the click of a button. Quanta+ KDE’s counterpart to Bluefish is known as Quanta+ [5] (Figure 4). Quanta+ is Figure 4: Quanta+ is the KDE counterpart to Bluefish.

46 ISSUE 59 OCTOBER 2005 WWW.LINUX - MAGAZINE.COM REVIEWS HTML Editors

dling source code, nately, the future of the editor is uncer- you might prefer tain. The Foundation has one of the follow- announced that it will be discontinuing ing WYSIWYG development of the whole Mozilla solutions. branch. The current version 1.7 is still maintained, and Composer still performs with well in comparison with other HTML cuneAform editors. After installing the Mozilla suite, Firefox was basi- go to the Window menu to look for the cally designed as a editor. lean browser, and The Composer interface has four view it therefore comes modes, which are enabled via tabs at the without an inte- bottom of the window. The first tab grated HTML edi- takes you to the GUI-based editor view, tor. cuneAform [6] which adds guides and boxes to tables, is a plug-in that allowing authors to scale these elements Figure 6: is developed and distributed by the adds this function- using a mouse. The HTML Tags tab also Consortium. ality to Firefox. To displays the homepage in the layout install cuneAform used later, but it adds the corresponding with integrated developer environments in Firefox, select Tools | Extensions | Get tags. HTML Source gives you a rudi- will expect to find auto-completion dur- more extensions. This opens a homepage mentary text editor that does not even ing command input, and Quanta+ will where searching for cuneAform will take support syntax highlighting and fails to not disappoint you. you to a link for the plug-in. You can then fulfill even minimal requirements. Quanta+ still has not completely click Install now to take care of the details. Finally, the Preview tab shows you the removed one major issue known to cuneAform is controlled via icons. At results in the Mozilla browser. All ele- affect previous versions. In the past, the this time of writing, the editor only ments and tables remain editable in all program was known to crash regularly; understands the most basic of HTML four views, and any changes are imme- this no longer happens as often as it did, elements. In many ways, cuneAform is diately reflected in all other tabs. but it still happens. So make sure you reminiscent of . Working with Composer is just like back up your work regularly. using a simple word processor; anyone All of the tools we have looked at thus Mozilla Composer with experience using this kind of soft- far assume HTML skills on the part of The Mozilla includes the ware should quickly feel at home. On the user. If you prefer to avoid manhan- Composer [7] HTML editor. Unfortu- the downside, the WYSIWYG editor does

Table 1: Summary of HTML Editors Amaya 0.91 August 0.63b Bluefish 1.0 Erwin 0.8 Firefox 1.0.x (X)HTML- Mozilla 1.0 Quanta+ 3.4 cuneAform 0.3.1 Format 8 R85a Composer 1.7.8 License own (W3C) GPL GPL GPL MPL own () MPL MPL GPL Interface English English English, English English English, Multilingual Multilingual Multilingual, language Multilingual Multilingual English Syntax – yes yes yes – yes – yes yes highlighting Help creating Automatic Template Wizard Wizard Automatic, Wizard Automatic Automatic Wizard a skeleton page (WYSIWYG) WYSIWYG (WYSIWYG) (WYSIWYG) Spell yes – yes (ispell) – – – yes yes yes verification Preview yes external external internal internal internal, internal internal internal, (immediate) external external Standard XHTML HTML 3.2 HTML 4 HTML 4 HTML 4 HTML 4 HTML 4 HTML 4, HTML 4 language XHTML Image Maps – – – – – – – – yes (Plugin KImage MapEditor) Code yes external external – – external – yes external validation (weblint) (weblint, tidy) (Internet) (tidy) Link checks – – – – – – – – yes (Plugin Link Checker) Project – – yes – – yes – yes yes management (rudimentary) Upload page – – – – – – yes yes yes to server (FTP)

48 ISSUE 59 OCTOBER 2005 WWW.LINUX - MAGAZINE.COM HTML Editors REVIEWS

up. This includes that the only displays if removing redun- needed. dant newlines, which are caused Conclusions when an author Choosing the right HTML editor is not composes a page easy. Bluefish and Quanta+ definitely in the WYSIWYG take the lead over the other text-based editor. This func- editors described in this article, although tion is useful for their feature-richness comes at the price applying the fin- of complex controls. ishing touches to Users with older hardware, or Tcl fans, a homepage that might prefer August thanks to its frugal you have already use of resources. Erwin is also easy on completed. resources, but neither August nor Erwin Just like the gives the kind of functionality you would Firefox browser, expect of a modern editor. This can be Figure 5: NVU is based on Mozilla Composer. NVU also supports difficult if you need to encode non-stan- extensions and dard characters: if you violate HTML not support the composition of more themes from the http:// nvuext. mozdev. conventions by using non-standard char- complex pages. org page, where you can select new fea- acters such as German umlauts, other Composer provides some useful wiz- tures and outfits. These extensions editors may not be able to handle your ards and input tools for most HTML ele- include additional dictionaries for inte- results due to a lack of UTF-8 support. ments. Some editing of the source code grated spell checking. The help feature is (X)HTML-Format left us with mixed is inevitable if you are using another lan- comprehensive and definitely one of the feelings. Some functions seem immature, guage, such as JavaScript, although an best of all our test candidates. and this clouds the positive overall view. optional extension for CSS is available. On the upside, the tool will run on any On the downside, manual editing is not Amaya , and this could be use- reflected in the automatically generated The World Wide Web Consortium itself ful if you want to change operating sys- table of contents. develops the Amaya HTML editor [9]. tems without re-inventing the wheel. Composer does not have a project The current version is targeted at XML In the WYSIWYG editor stakes, the management feature, and that makes and XHTML, although it understands cuneAform Firefox extension loses out large-scale projects tricky. Again, on a older standards and HTML versions. to its competitors. It is fine for patching positive note, the program does support Amaya is not included with every together a quick and dirty page, but automatic uploads to FTP servers. Linux version, but you can obtain a otherwise you will want to use Com- copy of Amaya through W3C. In contrast poser or NVU. The Mozilla editor is use- NVU to the other candidates in our test, ful for smaller pages, but the generated The Linux distributor developed Amaya goes to great lengths to comply code tends to be cluttered and include the NVU [8] HTML editor (Figure 5), with W3C standards, although the inter- redundant tags. NVU’s extras put it in version 1.0 of which was released face is quite quirky at times. For exam- the lead. ■ recently, on the basis of Composer. Just ple, Amaya opens a new window for looking at the main window reveals the each view. Besides the WYSIWYG mode, INFO close relationship to Mozilla Composer. there are source code and page hierarchy [1] August: http:// www. bostream. nu/ For example, NVU uses the four views views (Figure 6), an internal preview, johanb/ august that you may be familiar with from Com- an alternative text browser view, and [2] Bluefish: http:// bluefish. openoffice. nl poser. This said, the views have learned a list of all links. Amaya does not [3] Erwin: http:// lisas. de/ erwin some new tricks: for example, the NVU automatically update the views; in fact, [4] (X)HTML-Format: source code editor now supports syntax you need to click on Synchronise to http:// www. homepagehelper. de/ highlighting, and the other views display sync the current window content with / -format (The site is in the page dimensions on the left and at all other modes. German; search for (X)HTML-Format the top of the window. The NVU devel- Amaya converts documents to the through Google to view a translated opers have also extended most dialog XHTML standard at the click of your version.) boxes and completely redesigned some. mouse, automatically modifying the [5] Quanta+: http:// quanta. kdewebdev. org For example, users now add a table by syntax at the same time. This said, drawing a with the mouse. The you might like to verify that the results [6] cuneAform: http:// cuneaform. mozdev. org CSS editor, which was an optional exten- are correct. Another advantage that [7] Mozilla Composer: sion with Composer, is a standard fea- Amaya offers in comparison with other http:// www. mozilla. org/ editor ture with NVU. editors is its ability to add annotations [8] NVU: http:// www. nvu. com/ NVU not only validates your source to pages. These annotations are com- [9] Amaya: http:// www. w3. org/ Amaya code, it can also clean your source code ments for elements and text passages

WWW.LINUX - MAGAZINE.COM ISSUE 59 OCTOBER 2005 49