Comment Box

Problem

Users want to comment on an article or product

Solution

Add a small form below the article and after the other comments that allows users to submit a comment

From www.ok-cancel.com


Use when

A comment-box is often used on a Blog Page but can also be used on an Article Page, Guest Book or for sharing experiences about the products of an E-commerce Site. Users may want to comment on the content of an article or share experiences about the product that is being discussed. The comment box serves a means for Community Building.

How

A comment box is basically a simple type of Form. The main fields are Name, E-mail address and the Comments themselves. Additionally a web site address may also be asked. The e-mail address is most of the time asked in order to be able to notify the commenter about replies or follow-ups but it is usually not shown when displaying the comment. Clearly indicate which fields are required and which are optional.

Allowing HTML or not?
When writing a comment it can be handy if you can insert a link or make some text bold. Sometimes using HTML codes is allowed for such purposes but usually the tags that are allowed are limited. Therefore the users must be told what they can use. Be careful though, allowing links attracts blog-spam like honey attracts bees!

Battling blog-spam
Blog-spam can be a very serious and annoying problem. There are several techniques to battle it. Besides technical solutions such as blacklisting IP addresses you can use some other techniques:
  1. Only allow registered users to comments. But then you need to provide them with a Login
  2. Add a Captcha to make sure that only humans add comments. However, this is not effective against humans adding spam.
  3. Use a moderation process. All comments must be approved first by the moderator before they appear on the site. If you use this inform the user that his comment will appear after it has been moderated.

Giving feedback
After a visitor has posted his comment, the comment must be placed below the last comment on the page, just above the Comment Box itself. Highlight the new comment and scroll the page to that position so that it clearly shows that the comment has been added. Using Ajax you can also simply add the comment without reloading the page and then highlight it. The comment shouldn't only display the comment itself, but also the time and date it was posted, the poster, and optionally things like place and country of the poster.

Why

The comment box is a way to create a feedback mechanism on a site, using just a simple form. Instead of offering a generic Contact Page it gives the uses a direct way of reacting on the same page the content resides. By placing the comments also on the page the feedback mechanism is complete. Basically, it becomes a simple one-page Forum.

More Examples


This example rom www.smashingmagazine.com shows how you can explain which HTML tags can be used and how to indicate what is optional and what isn't.


On www.mashable.com/ a slightly more complex variation is used where both registered and unregisterd users can comment.


Literature

Battling spam in blogs
Bloggers Declare War on Comment Spam, but Can They Win?
Akismet anti-spam software

Code examples

PHP guestbook code
Comment Form tutorial
PHP Feedback Form tutorial
TNT comments script
plml logo

Comments

10 comments have been added to this pattern


Matt, 18th January 2008
How did you put this comment box on your website, is there a software or a specific coding language you must be familiar with? Do I have to pay for this, or can I get it for free?

THANK YOU!!!
Chris Poteet, 19th January 2008
Those examples you have are hideous.
Morgan Newall, 21st January 2008
Re: Hideous, I agree. Are these interface examples we want to emulate or avoid?
Martijn van Welie, 21st January 2008
I agree that they are a bit outdated. Time to look for some new examples. Any suggestions?
Russ, 29th January 2008
Suggestion: Build your own in 5 minutes or less.
Ronny, 29th January 2008
Cool stuffs here
Martijn van Welie, 3rd February 2008
I have updated this pattern; changed the description and added new examples.
ems, 27th March 2008
big help!thanks
me, 26th May 2008
im looking for a similar comment box for my site. where would i find the codes? how could i have people register for postings?
Luc Moers, 27th June 2008
Suggestion: an example of a comment box that allows user to use buttons instead having to be sufficient with HTML tags.


Add a comment
Do you have something to add or say about this pattern? Perhaps some more examples of how this pattern is used in the wild? Add a comment to this pattern and I'll update the pattern when necessary. Please abstain from misuse. I reserve the right to delete or modify inappropriate postings.

Your Name

Comment

Enter the verification code you see in the image below
captcha