WYSIWYG edittors for web applications

For a long time I've been looking for a good open source on page WYSIWYG editor that is cross platform. There are a lot that are available exclusively for Windows, ektron's eWebEditPro editor comes to mind. I've used eWebEditPro on a few different projects over a few years, and have no complaints about it. But it doesn't really fit my requirements. It's not opensource you have to pay a licensing fee to deploy it, and more importantly it doesn't work on my mac.

Maybe two years ago I came across Ekit, a opensource java applet based on page WYSIWYG edittor. It looked promising, I even went so far to download the source and tweak it so that the modifier key for copy,cut, and paste would map to the command key rather than the control key. And then I ran into what I assumed was a bug in safari. I also realized that if I wanted to deploy the applet with copy and paste support I would need the "sign" the applet, which would mean purchasing a certificate to do so. I lost interest and lost track of ekit after that until recently when I discovered a version 1.0 had been released. Ekit meets my requirements, but something about the HTMLEditKit in Java just isn't right, and I found that I had to change the way I would go about editing html to avoid some of java's html editing quirks.

It was around then that I found out that Safari has supported "contenteditable" and "designMode" attributes since version 1.3. unfortunately it doesn't really fully support them. But I'm hoping that it will soon, maybe in the next subversion of version 2. In the mean time I went looking for cross browser editors that will be able to support Safari when Safari fixes its HTML Editing problems. I can across 3 different projects that essentially use the same technology but use different approaches, and they all work in IE on windows, and Netscape/Mozilla/Firefox everywhere.

TinyMCE which scales from the basics to the works in terms of buttons and tools.

Xinha which has a cool way of editing css properties.

FCKeditor which looks pretty mature and stable.

For a comprehensive listing of on page WYSIWYG edittors check out: www.htmlarea.com

DHTML is the new Flash, almost.

With google maps and google suggests among others, and a the choice of a catchy acronym like "AJAX". It looks like javascript remoting, or whatever you want to call it is starting to get some more "mainstream" press. http://www.adaptivepath.com/publications/essays/archives/000385.php

It's even getting coverage on slashdot.

You can even do some pretty nifty graphic effects in a standardized cross platform way with this javascript library. http://prototype.conio.net/

Check out some of the effects you can do with the next version of it here. http://mir.aculo.us/demos/effects/effects2.html

Note to self, use more PNGs.

Pretty much all browsers that can display images can also display PNGs. Most also support transparency using a PNG's alpha channel, with the notable exception of IE on windows.
Yeah, thats right IE doesn't support it by default. Thats a big deal because IE still has the lions share of users as far as browsers go. Fortunately you can force IE to respect the Alpha channel by applying a IE proprietary "Filter" to the image. It's been possible to do this for some time, so alot of clever solutions the have been thought up to make applying the filter easier. A number of these solutions can be found in the blog entry and in the comments here: http://blogs.msdn.com/dmassy/archive/2004/08/05/209428.aspx

A List Apart did a article on this 3 years ago, and IE7 is said to support the Alpha Channel on PNG files with out any filter fixes: http://blogs.msdn.com/ie/archive/2005/04/26/412263.aspx

The alpha channel support can be really helpful with certain layouts, and makes it that much easier to abandon table based layouts for CSS based ones. I hardly ever use PNG files in my work, but after some re-examination, there is no reason why I shouldn't be using PNGs and lots of reasons why I should.

BlogCFC was created by Raymond Camden. This blog is running version 5.5.003.