TV version (Display Regular Site)

Skip to: Navigation | Content | Sidebar | Footer


Weblog Entry

Interview, Open Component

August 19, 2003

DMXZone publishes an interview with yours truly (goofy head shot and all), and thoughts on rich-text web-based editors.


Dave Shea Head Shot

All things considered, I think my photo came out okay. That’s right, I got the DMXZone treatment that we’re all coming to know and love.

Bruce Lawson asked some great questions, and I think I managed to give some rather thoughtful answers in my interview. Go read a few scattered thoughts on coding CSS, the on-going success of the Zen Garden, and Comic Sans MS. Meanwhile, Molly may be over-doing it just a tad, but colour me flattered. §

A recurring thought of mine that might be worth consideration, if you’re a coder: there exists a graphical, rich-text editing component by a certain software giant out of Redmond that comes bundled with its flagship browser. This component has caught on like wildfire thanks to its price and universality. Many large-scale content management systems, weblog tools, and other web-based applications use the component to allow a familiar Word-like editor for their, well, less-than-technical clientele.

The problem with this component is that no matter how well-intentioned a page author is, they are shackled by the markup that it spits out. And it’s ugly. Oh, is it ugly. <FONT> tags, unquoted attributes, the whole nine yards.

Alternatives exist that allow customization of the code, but they’re pricey and can’t compete with a free component in this space. A CMS vendor already charges a certain price; adding an extra $159 per license just for an editor is not an option.

It occurs to me that an open-source, hackable version of this component would be an incredibly Good Thing for broader standards adoption. Offering it free for commercial purposes would ensure consideration, and if it were easily hackable for custom purposes, it might be integrated in a heartbeat by a huge number of very expensive and well-deployed software systems.

I can’t give you any leads for Google. I don’t know what the component is called, and I can’t remember who provides alternatives. I’m sure someone reading this site knows what I’m talking about and can fill in that gap. My point however is to say that if an open alternative existed, a lot of people would be very happy, and the creator might see a very large amount of indirect benefit as a result. It’s just a thought. §


Reader Comments

paul says:
August 19, 01h

any article where myself or my company is mentioned rules. sweet! now if you could write top10 lists as well as you code…

August 19, 02h

I’ve got a structural XHTML editor for IE using the built-in editing, tried and tested, with a nice interface and modular features… but it was developed at my day job so I can’t give it away. Bah.

One thing we’ve found is that document structure can be clearly & unambiguously displayed with careful use of borders and backgrounds. For example, blockquotes have a border and a quotes ‘watermark’ background, a level 2 heading has a background tint and a subtle ‘2’ in the top-right.
The biggest training challenge is getting people to let go of control over presentation, Word has encouraged bodging for years now and some users struggle to grasp even the idea of headings.

August 19, 06h

Just to throw in my two cents on htmlArea mentioned above, in IE it spits out ugly markup, although I haven’t tried hacking at it to change that. A run through tidy (http://www.w3.org/People/Raggett/tidy/), followed by a few server-side regular expressions might do the trick. Version 3.0 (beta right now) will work in the latest Firebird, and *that* generates code that I can best describe as “leaps and bounds above IE’s editor but still in need of a good scrubbing”.

4
Joe says:
August 19, 08h

I don’t think it’s exactly what you’re looking for, but Textism has a semi-solution. It’s not too user-friendly I guess, but a ton of people use it apparently: http://textism.com/tools/textile/index.html

And Dave, please don’t check the site at the end of my email address…it looks horrible and I’m redesigning it. :)

haze says:
August 19, 10h

will the shea shutter in the limelight? ;0)

Kevin says:
August 19, 10h

Dave,

I wanted to try to be helpful and post some links, but I’ve pondered the same question.

Are there open WYSIWYG editors? - yes.

Do they spit out prettier source than our friends in Redmond? - sort of.

Daniel Glazman is developing a stand-alone version of Mozilla Composer, and he is also responsible for the CaScadeS style sheet editor that is currently part of composer.

The generated markup is better here, but still, you may have occassions when editing is necessary.

Then, there is TopStyle for nice CSS editing with previewing, etc that you can use for free (the Lite version).

Macromedia Homesite integrates well with TopStyle.

But as for an open editor that does a good job, I’d be interested as well to see if anyone comes up with something here.

As for me, I used to write all my sites in vim before I switched to movable type. This crazy template stuff is a little frustrating. Rebuilding all the time is a pain.

Hope some of that was useful.

-K

7
chris m cooper says:
August 19, 10h

on a web where people do a lot of talking about stuff, mr. dave is actually throwing out these new ideas, whether or not they are adopted by others. that’s cool. i wish more people had that sort of passion right now. my fellow design students don’t even have that kind of passion. where can i pick up some of that?

GO DAVE!

Kevin says:
August 19, 10h

In fact, I partially blame rebuilding movabletype for my sluggish-ness in getting my website looking cool again. The front page is a little better now, but I still want to do so much more.

Dave S. says:
August 19, 10h

Let me clarify a little - I’m not talking stand-alone apps, but an embeddable component that can live on a web server. If you’ve got a Hotmail account, log in with IE (important that you run it in IE) and compose a new message. From the drop-down, turn on the Rich-Text editor. That’s the component; it’s a front-end for a built-in IE-only ActiveX control.

It’s that kind of embeddability (if that’s even a word) that I have in mind.

Kevin says:
August 19, 11h

There is some work being done for Mozilla ActiveX support. http://www.iol.ie/~locka/mozilla/mozilla.htm ironically enough.

But, if you’re looking for something a little more cross-platform than ActiveX, a little project called netWindows http://www.netwindows.org/ (they are currently redesigning the site) has a widget library that perhaps could be extended to do something like this. They may even have the beginnings of an editor by now. It’s been a while since I was involved with the project.

I’ve also seen some editors like what you’re talking about somewhere, but I unfortunately don’t remember where.

Matt says:
August 19, 11h

Drop what you’re doing and go check out http://www.dynarch.com/htmlarea/ . It’s free, has some kickass features, and generates decent markup. The spell checker is incredibly useful too. :) We’re considering adapting this tool for WordPress, basically taking out some of the options that wouldn’t be useful to most blog posts and cleaning up small things like changing <b> to <strong>, etc. Let me know what you think.

Dave S. says:
August 19, 11h

Matt - yes, exactly! I think I’ve even seen this one before. Now how’s the hackability? By default it’s spitting out bad code.

Kevin - I believe the Mozilla ActiveX control is also similar. The Hotmail example I gave relies on the IE API, but I believe the editing components sit on top of it separately. So once Mozilla has the control, the extra editing features will need to be built (or ported from an existing IE editor)

forgetfoo says:
August 19, 11h

there are a few cross-browser DHTML attempts at a WYSIWYG component (Moz/IE), but i havent come across one that’s OSS, free, and spits out nicely formatted (X)HTML code… and i’ll be damned if i drop $200(+) on a dhtml/wysiwyg editor,

like eWebEditPro: http://www.ektron.com/ewebeditpro.cfm

many have complained about Moz’s lack of “contentEditable” or “designMode” support for years, but Mozilla 1.4+ and now Firebird 0.6.1 support a version of it, entitled Midas:

http://www.mozilla.org/editor/midas-spec.html

personally, i think it’s awesome to read this here on mezzoblue ;)

forgetfoo says:
August 19, 11h

oh sweet, forgot about HTMLArea!

/bookmarks it… again :)

August 19, 11h

Maybe this is the cross-browser rich text editor with nice markup that you’re looking for?

Works great using vanilla firebird 6.

http://www.kevinroth.com/rte/demo.htm

August 19, 11h

Since I’m not doing anything better with my homepage, I thought I might put up an example of the “modified” HTMLAREA that I’ve hacking up.

http://www.urbandude.com

It works in IE5.5+ and Mozilla (1.3+ I think). It’ll turn out pretty decent xhtml, but it does have issues, like the FONT tag (you can limit what a user is actually allowed to do by modifying the javascript). The image uploading and file management is my own little ASP modification/add-on.

August 19, 11h

For a guy wearning a red and black cape, you actually manage to look half decent.

:)

Jai says:
August 19, 12h

“you know, it’s good to be intimidated by other people’s work. It gives you something to shoot for.” - Personally, I find this statement ironic comming from YOU.

foO says:
August 19, 12h

thx Lloyd! that’s a great link, man :)

/bookmarks that one, too

bryan, are you planning on making your changes publically available? looks awesome, man

Stv. says:
August 19, 12h

Just as a note, there is a COM version of HTMLTidy, which can be used to clean up the output of the MS ActiveX component, pretty much automatically, and spit out validating XHTML. I was using this for a while, and while the object appears to no longer be in development, it will at least clean up font tags, lowercase the tags and attributes, etc, etc.
For those true super-geeks, writing some Regular Expressions to clean up HTML is actually fairly straight forward - again, the less HTML to deal with, the easier it is, but for most CMS systems using the MS ActiveX box, it spits out highly predictable garbage, which makes it easy enough to clean up, leaving beautiful code behind.
Of course, it still doesn’t sold the cross-browser issue, but it looks like previous posters have that covered.

August 19, 12h

I guess I could make it available. Never really thought anyone would have a use for it. I guess I should comment the code before I start zipping…

Chris says:
August 19, 12h

These guys show you how to build your own…

http://www.devarticles.com/art/1/90

This example is IE only though.

24
Richard Mulder says:
August 20, 02h

Free (as in speech) web browser-based HTML editors? There’s lots of those on SourceForge, in various stages of usability.

Go to http://sourceforge.net/search/ , enter “HTML editor” in the text box, select “Require All Words” and hit “Search”. You’ll get a bunch of stand-alone programs too, but also many a browser-based editor, ranging from DHTML to IE and Java solutions.

redux says:
August 20, 02h

http://www.editize.com - not free, but cheap enough (and spits out clean xhtml, fully customisable, with APIs for various server-side languages + one for JS)
on the free side, i’ve had decent enough results with Ekit http://sourceforge.net/projects/ekit/

26
Clayton Scott says:
August 20, 07h

HTMLAREA

Someone else mentioned this but I want to give it another plug.
Version 3.0 is being developed by Mihai Bazon (Mishoo) and will be cross platform well, IE and Mozilla anyway.

Sponsor: http://www.interactivetools.com/products/htmlarea/
Demo: http://dynarch.com/mishoo/htmlarea.epl
Dev Site: http://dynarch.com/htmlarea/

The Dev Site has a list of features which include:
+ Customisable toolbar (ie disable font/colours etc)
+ Plugin API
- Spellchecker plugin (requires server side support)
- Table Plugin

From reading Mishoo’s blog http://dynarch.com/mishoo/ I get the feeling that he works with standards in mind. Look at the DHTML calendar widget on his site for a flavour of his work
http://dynarch.com/mishoo/calendar.epl

Adam says:
August 20, 09h

DShea, You mention in the interview that you’ve got something against Vietnamese coffee? It can’t be that it’s not strong enough, cause the stuff’s potent. What’s the story?

28
roddogii says:
August 20, 09h

Lloyd and foo,

The kevin roth example is really good and easy to implement and customize (toolbar wise)…however it is still based soley off the M$ API, resulting in horrific code.

But as suggested, I would assume most of the developers implementing these editors have easily created “Clean up code” that would change the tags available to the users and ensure proper xhtml markup (or at least as close as possible).

Dave S. says:
August 21, 01h

Adam - the link in the interview explains it far better than I ever could, but short summary is that Vietnamese robusta has flooded the market. It’s garbage coffee that sells at incredibly low prices, so the coffee farmers in Africa and South America producing good beans (arabica) can’t compete. They’re starving as a result.

Basically, I support Fair Trade coffee, and despise the trade practices of the Big Four mentioned.

It’s a political thing, but also a quality thing. If the situation continues, in 5 to 10 years coffee quality worldwide is going to be incredibly poor thanks to bankrupt farmers.