Voting System - Which Symbols to use

Question

A lot of sites out there allow their users to either vote-up or vote-down content to determine both it's quality and relevance (just like this one!). My question is which set of symbols would be more effective to complement a voting system that has 2 selectable options (as opposed to a 5-star rating system, 1-10 scale, etc.)?

1. + / -
2. upwards triangle / downwards triangle (or an up-arrow and down-arrow, respectively)
3. thumbs up / thumbs down

After you choose, please explain why. Then, perhaps explain what kind of use-case would be proper for each option?

The project in question allows users to write a comment after voting on a piece of content. Their vote is tallied and their comment is posted. Their vote (and comment) does not effect the sort-order of the content nor the notoriety other than what the tally-total displays.

Answer 1

The key for me is in your last line. The context is a simple binary vote. The vote doesn't result in the item moving up a list. Hard to decide exactly what fits your solution without understanding a bit more about the product. But since you said it doesn't use reordering I don't think you should use arrows.

There are other binary options e.g. tick and a cross, green light/red light, happy/sad face. Interested to know why you didn't go for a rating system as I would say that this is usually what is used for rating content - perhaps partly because it doesn't feel quite as harsh.

This is why context is important. In an informal app I might use a face symbol... in some apps. In a more formal one a tick and a cross.

^{download bmml source – Wireframes created with Balsamiq Mockups}

---

Individual Use cases

+/-

This is really over used as a symbol. Think tree controls, maths etc. Even google amended it in the icon to +1 rather than just +. This is my least favourite.

Thumbs up

Facebook uses thumbs up because it means "like" which has a whole different semantics. Remember they don't have down votes. However I guess this has a more binary feel.

Voting Arrow

Up and down would fit well on a site like stack exchange or quora which have a sort. In other words it is a "send it up the list vote"

Answer 2

I am a huge fan of the upwards/downwards arrow for voting because it is so self explanatory that now days with some many sites using a voting system everyone and his cat knows what an up arrow and a down arrow mean. Also color coding the arrows, either on hover or at all times, furthers the explanation (Green = good, Red = bad). I would really only use the arrows on a voting system though.

Examples of voting arrows - StackExchange, Imgur, Reddit

The use of thumbs up/thumbs down is usually seen on articles sites and social networking sites where someone can either communicate "That's a dumb idea" or "Wow! I really like that". When I think of thumbs up or thumbs down I usually think of someone personal opinion in a matter and not good vs. bad info.

Examples of thumbs up/down - Facebook, Smashing Magazine, Pandora

I don't really see too many sites using the +/- just because it really would need to be explained well about what it does. I wouldn't use something like this because + and - could mean a lot of different things (Ex. "Add to my favorites" or "hide things like this").

Examples of +/- - Google+?

Then there are the cases that sites use a unique type of voting such as Twitter's "Retweet" and "Favorite", and Digg's "Digg"

For your project I would definitely give a for the voting arrows.