Make it clear to the user what they voted on in poll results

Here’s a large poll I participated in:

With that many options, it can be difficult to spot the items I voted for to check on how they’re doing, and I may even have forgotten a couple of the items I voted for. I could switch back to voting to see what I voted for, but that list’s order is different than the order of the results list, so it takes a lot of time to match up list items between views. It’d be great if there was some way to denote what I had voted for on the results view – highlighting for instance, like in this badly edited image:


At a minimum @tgxworld we should add a CSS class so people can experiment


CAN you add number of voters next to percents?

@Drew_Warwick Good suggestion. This is what twitter does for it polls as well.

I kind of like the style so perhaps we can do something like what you suggested

Still alittle confusing though since there are two competing colors now. I’ll continue to tweak it to make the selected vote more obvious, but its time for :zzz: :bed: :slight_smile:


The “selected” one should be in blue, so that seems fine. Twitter doesn’t allow multi-vote polls so it’d be less obvious what’s going on there.

Taking another cue from Twitter, how’s this for clarity?


Made some improvements here, any thoughts?


You may run into issues with displaying options inside the vote bars. Vote options can be fairly long (see poll in OP), spanning multiple lines, in which case I’m not sure how you’d fit them inside the bars. You could make those bars taller, but IMO it’d look really weird to have bars with different heights, and equally weird to scale them all to the maximum size and have giant bars just because one poll option was 2 lines long.

Also, the black text on the blue bar is a little hard to read (first image) – maybe adding a different color outline to the text would help make it more visible?

Might also be difficult to match up percentages with appropriate poll options since there’s not a line directly going to them.


The black on blue is super hard to read


Ok I’m just going to go with this since it is alot simpler to implement without having to fight with CSS


I think there should be more white space between 2 options.
At first sight, I associate your avatar and T’s with “one” instead of “two”.