Re-thinking WYSIWYG editors for Web CMS

http://www.amaxus.com/cms-blog/rethinking-web-cms-wysiwyg-editors

by spxdcz • 17 years ago

13 11 17 years ago

beeker• 17 years ago

So similar to what Word 2007 is currently offering? You select text and an almost invisible ghost box appears, move your cursos in the box makes it appear fully.

thomasfl• 17 years ago

Instant rendering of markdown sounds like a good idea, if users care to invest time to learn it.

Luyt• 17 years ago

Not having to move your hand between keyboard and mouse is a huge time saver. It seems to me that the time you have to invest to learn it is minimal compared to what it will save in the long run.

philipn2• 17 years ago

These rich text editors have control keys for linking. It's easy to link text without leaving the keyboard at all. Select text with arrows, press control+L, enter url, press return. You can also jump through words by pressing control+arrow. So, control+shift+arrow, control+L, url, return. It's basically what he's asking for with the last suggestion.

spxdcz2• 17 years ago

But I guess that's still a shortcut for each formatting option? i.e. you need to remember each shortcut key (L for link, etc)? (If I read what you're saying correctly); whereas the blog is suggesting a single formatting shortcut that then shows more 'novice' users what the available options are, relative to what they already know (the buttons at the top).

Something like that! I'm still thinking it through (I wrote it...)

philipn2• 17 years ago

I think the issues raised in the post are interesting but not the biggest slowdowns people face when using web-based rich text editors. The biggest issue is simply moving around in the text. emacs / vi allow you to skip almost anywhere without leaving the keyboard once you're familiar with the method. That's the biggest save.

sunir• 17 years ago

I'm experimenting with this as well as I'm layering TinyMCE over a wiki for my side project, Bibdex (dev image http://bibdex.org:8080). I have tried extending TinyMCE with a wiki syntax parser. However, I'm unconvinced there is real value in confusing the text with magic syntax, with one exception.

Wiki markup is mostly cosmetic, so you can throw all of it out--except for auto-linkification. Linking makes the wiki.

This was easy with CamelCase links, but much harder for free links or other types of links.

I do wonder if it's possible to train people to use exactly one syntactic form, the square brackets.

  [words] -> free link
  [http://url text] -> descriptive link
  [http://url] -> escaped link (useful to pick up trailing punctuation)

Presumably when you write a left square bracket, a floating div could appear with contextual help and auto-suggest.

If others are interested, I'm happy to share my efforts.

spxdcz2• 17 years ago

Interesting stuff. I definitely think there's an important balance to be struck between adding efficiency with keyboard shortcuts, while still making it accessible to novices (which I'm not sure wiki syntax is). But for power-users, this could be very interesting.

pbhjpbhj• 17 years ago

>adding efficiency with keyboard shortcuts, while still making it accessible to novices

Reddit's comment writing hints, moreso than the brief Wikipedia hints, are quite easy to pick up even for new site users.

anthonyb• 17 years ago

I think the article has it exactly backwards. Start with the link, and the popup part should prompt you for the plain text part. ie. I paste in "http://example.com/ and the javascript/tinymce pops up a "Link Text >" prompt.

Much more intuitive IMHO than highlighting things which aren't obviously links, or adding extra syntax.

jamesrcole• 17 years ago

it should work both ways. sometimes you think of the link text first, url second. other times it's the other way around.

Re-thinking WYSIWYG editors for Web CMS

Related Stories