September 11, 2009

Gin Up A Quick Web Page With Kompozer

As a technology writer, I frequently have to build quick, easily maintained Web-type documents for client jobs or my personal Web sites.

I've used various Open Source programs and techniques over the years with varying degrees of success.  Some programs are very easy to use, like, but produce horrendously complicated HTML files.  Other applications are geared toward twiddling every single tag, like Bluefish.  For any kind of interesting look and feel, you'll need to have intimate knowledge of HTML coding, with that one.

Kompozer strikes a good balance with a nice user interface, clean tagging, and built-in publishing features.  Let's have a look, shall we?

Features and Benefits

Kompozer can be installed in Ubuntu using either the Synaptic package manager or apt-get.

The application has all the basics needed to build a Web page from scratch or to edit existing pages.

Kompozer graphical interfaceFigure 1 shows the Kompozer graphical interface.  Major functions, like opening and publishing files, adding anchors and links, and saving files are in a tool bar at the top.  Various toolbars can be opened by selecting View and then using the arrow keys to move around the menus.  Don't try to select items with the mouse, because it will crash the program.  It is a known problem, that has not been fixed as of version 0.7.10 (20090420). Just use the keyboard and everything works properly.  

Just above the main text editing area are the text tool bars.  Changing fonts, making the text larger/smaller, or bold are as easy as highlighting your desired text and clicking the appropriate button.  You can choose CSS style markup for body text and headings or simply change the text size and font characteristics, as needed.  For content that will go into a content management system, I just change things manually.  Web pages that will be maintained over time, would get the CSS treatment.

Along the bottom of the text area are tabs that let you view the page in different ways.  I use the Normal view for writing articles because what I create is pretty close to what the page will look like after posting on a Web site.  The Source tab is used when I want to verify some HTML construct or if I need to tweak the tags a bit.  The HTML Tags tab shows things with representative boxes around the text, which I've never found that helpful.  I usually don't use the Preview tab and prefer to start up Firefox to view the working file directly, after 95% or so of the article has been written.  It takes a couple of extra mouse clicks, but I can pretty much trust that the page will render correctly. 

Do It Fast, Make It Easy

Building Web pages has always been a huge timesink, for me.

I get paid for providing information that interests my readers, editors, and clients.  It's not cost effective to spend time hand coding HTML, if at all possible.  I need a workflow that is effective and helps me get the work out the door... fast.

Kompozer is a significant improvement over other methods that I've used.

Tags in KompozerUnlike Microsoft Word or Writer, the HTML code produced by Kompozer is simple and straightforward.  Paragraphs end in a terse <br>.  Spaces are represented by the respective  .  Kompozer doesn't put <font face=...whatever> tags around everything in sight.  Most of the time, you could actually take code generated in Kompozer and pretty easily edit it by hand in any text editor, such as vi.  Web editors and Web masters want simple, clean, and consistent tagging because that copy inevitably goes into a content manager.  Figure 2 gives you an idea of the tags produced by Kompozer.

Best of all, the tags are ready to go when I complete the document.

An article will start out as a new file that is immediately saved under an appropriate name.  An .htm extension is universally recognized as a Web page, so that is what I always use.

The next step is either a quick outline or an introductory paragraph, depending on my mood.  I use both to help form my framework for the story.  Normally, opening paragraphs will be four to six sentences with a bridge to the next main topic.  

Technical sections come next with significant space devoted to describing features and processes surrounding the topic.  Being able to create the content without worrying about the tags, during the writing phase is much easier than trying to navigate around tags, such as when an article is written with Bluefish.  Don't get me wrong, Bluefish is a very capable program and I used it for years.  For me, it is more suitable for things like PHP programming.  

Kompozer can also work with multiple files using tabs.  Sometimes I'll open an old file, pull out a link or short section of relevant text and paste it into the page I'm writing.  Other program have this capability, but are not able to show a normal untagged view or the source code, for each open file, with the flip of a tab.

Once all the technical details are wrapped up, I'll put together a summary paragraph that ties the whole story together.  

Lastly, I'll add the byline, which is usually pasted from a previous article.

For Web articles, graphics are submitted separately and not embedded in the HTML file.  

Graphics in KompozerPersonal pages are another story and Kompozer can easily add the code for your graphics, including sizing. spacing, and link information.  The graphic also shows up in the Normal view, making it easy to quickly see if the photo works for the topic of discussion.  The Source view, shows the usual <a href=....> tag, as you would expect.  Figure 3 shows how the graphic is displayed in the Normal view.

Kompozer keeps me on track by focusing my efforts on writing the content.

Extra Productivity Goodies

There are a couple of other goodies that help speed up my Web document production.

One, is the built-in spell checker.  For a long time I used the ispell command line application to check my HTML files.  It does a great job, but was always an extra step in the workflow.  In Kompozer, just place your cursor on the first word and under the Edit tab hit the Spell Checking menu item.  A new box will pop up where you can accept the word, add the suspect word to your dictionary, recheck the page, ignore suggestions, and so on.  That saves me the step of clicking over to a terminal and using ispell separately.

I also like the publishing feature.  First, click on Edit then Publishing Site Settings.  A new box will appear and you can define the site profile name, the Web page URL, the FTP server name, and user name/password.  Put that information in and then save it.

When you are ready to publish the page to your server, simply click the Publish button on the main tool bar and the latest changes to your file will be magically transferred to the Web site.

The only thing I miss that would be really helpful, is a word count button.  I've looked all around the menus and have not found a way to see how many words I've created in my stories.  I'm still forced to use wc on the command line.  Maybe some future version will include that capability.

Go Forth And Make Some Pages

Kompozer is a good WYSIWYG editor with a nice variety of features.  With a little practice, it will help speed up your Web-type document production.  If you need a quick way to put pages together that are clean and easy to maintain, then take a look at Kompozer.

RobReilly is a emerging technology consultant, writer, and portable computing expert. Tech trends, seminars, and writing projects are his stock-in-trade. His mission is to deliver exceptional value to his clients. Visit his Web site at

Click Here!