22

I'm trying to figure out how to let my users edit their content on my site. It's currently just text formatted depending on the screenwidth, but I'd like to give them more control over their content:

  • Bolding, Italicizing, Underlining
  • Adding images, videos
  • Adding code snippets

I really don't want to force them to use something like pagedown though - a lot of my users are in middle/high school and might get frustrated with a "codey" experience. I DO like how clean pagedown feels though, you know? I feel like nothing can go wrong as I type this message up. WYSIWYG makes me feel on-edge, like it's an unpredictable mess under the buttons.

What options do I have? On the bloated end I've found tinyMCE, which is definitely not an option, all the way to NICEdit, which I'm very seriously considering. What would you recommend for someone looking for a highly customize-able, lightweight, user-friendly inline content editor?

6
  • 2
    You are asking for a comparison between WYSIWYG and a specific implementation of markdown. Do you mean markdown in general?
    – JohnGB
    Mar 24, 2013 at 19:50
  • Whoops, edited.
    – SB2055
    Mar 24, 2013 at 19:55
  • 2
    Much more importantly than bold and italic, provide strong and em elements. They are semantic. Mar 26, 2013 at 5:32
  • 5
    @NicolasBarbulesco: strong/em is not always correct when someone wants bold/italic text. A wrongly used em is worse than a span that should be a em.
    – unor
    Mar 28, 2013 at 9:29

2 Answers 2

18

If your goal is to allow users to have fine control over exactly what a document or page will look like, then you really have to use something like WYSIWYG. However, in my experience, that is rarely necessary.

If your focus is on the content itself, rather than the layout of the content, I would strongly suggest you use markdown. Markdown is already used by many websites like Stack Exchange and Discourse, so depending on your audience, you my find that they are already comfortable with markdown. It allows users to focus on what they want to say rather than what they want it to look like. The overall result is that the content is the focus.

A third alternative it to use a WYSIWYM editor. Here the focus is on semantic meaning rather than layout. This has advantages if the content is semantically rich, and allows you to specify custom layouts based on what something is. WYMeditor is probably the best implementation of this that I have seen so far.

In my experience, markdown has been the best middle ground, as it is easy to understand, and even if you don't use any of the markdown formatting, you can still write easily. There are also implementations like the one on this site that do a very good job combining the best of WYSIWYG and markdown.

In summary:
Focus on the look - WYSIWYG
Focus on the content - Markdown
Focus on the semantics - WYSIWYM

6
  • 6
    Markdown used by Wikipedia ?? You confuse with wikicode. Wikipedia uses MediaWiki. The syntax and the possibilities differ significantly between Markdown and MediaWiki's wikicode. Mar 26, 2013 at 17:38
  • And Markdown is more semantic-oriented — which is good. Mar 26, 2013 at 17:41
  • 2
    But Wikipedia goes WYSIWYG: mediawiki.org/wiki/VisualEditor
    – Bossliaw
    Jul 20, 2013 at 18:17
  • I just think that all other form of markup languaage/code (ex: BBcode, Wikimarkup, Latex, Markdown) should be categorized as MYSIWYM
    – Bossliaw
    Jul 20, 2013 at 18:22
  • It just happen to that, Markdown's design has better "raw-content" readibility
    – Bossliaw
    Jul 20, 2013 at 18:23
4

Markdown is great, but it's not a panacea. To everybody suggesting it here, I'd reiterate the following reasons why it may not be appropriate:

  • Markdown is, in my opinion, preferable once you learn it. But you have to learn the syntax before you can use it. For a site for kids, markdown syntax may present too steep of a learning curve.

  • Markdown does not provide features that may be required (e.g., center/right/justify text, coloring text, choosing a font, etc.)

  • Markdown requires two visual representations: the editing area and the display area. This won't work for every interface.

Of course, WYSIWYG editors have their faults as well.

I haven't found one that is everything you describe (lightweight, customizable, open source). If you're open to non-free software, you may check out Redactor. I haven't purchased it myself, but it appears to have many features you're looking for.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.