1

I have text content that users entered using TinyMCE, so it contains a good bit of HTML. I need to display this content back to them on a page along with a few other things, but the user-generated content tends to blend in too much with the page and the content around it, making it less clear that the content is user-generated.

How should I make this user-generated content look different in overall appearance from the other HTML content?

Improve this question
1
  • A picture of how it looks right now would be helpful in answering this question.
    – Sam Blake
    Sep 1, 2013 at 4:21

2 Answers 2

Reset to default
1

There are a number of possible approaches; here are a few:

  1. Visual distinction. Use <hr>s to set off the user generated content, or put the content on a different colored background.

  2. Typographical distinction. Use different typographical styles for user-generated content than for the normal site content. You might change the font, say, or even just change it's size and leading. (Be careful if this is intended as a preview, though; if possible, you want users to see their content in the formatting that it'll be shown in later.)

  3. Simulated preview. Show the user generated content in a simulation of a page; for example, you might show what a sample news feed would look like with this new content appended to the top. This has the added benefit of showing the content in context, which may affect the way users perceive it.

Improve this answer
1
  • Thanks, I chose to put a different coloured background. Essentially the user generated text and background is inverted from the normal contents colour (I'm using mostly black and white).
    – ComputerLocus
    Sep 1, 2013 at 5:04
0

You could also consider using a small icon and include metadata about the UCG. Microsoft uses a machine translation icon on support materials done with MT to information users that as such the quality of the MT content may not be human-perfect, but its still usable.

A tooltip or legend can explain what the icon means

Combined with metadata with the content topic for example (Written/submitted by: a.n. user On: dd/mm/yyyy Category: community )

If your intention is to combine user-generated content with "native" content as part of an overall community strategy then using an obvious visual styling or color distinguishing one type of content from another may detract from overall seamlessness and readability. As always, test with real users doing real tasks in real environments with the use case in mind.

Improve this answer

Your Answer

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

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