Should badge widths be consistent?

Question

I asked this question on Meta Stack Overflow: Make Badge Width Consistent

I thought it was a shoo-in, but it got downvoted a lot more than I expected (currently stands at +3/-15 for those unable to see vote count breakdown), so I'd like to see what the good folks on GDSE think.

Which looks better?

On the left are the current badges. On the right, badges are all equal width (min-width: 10em;)

One possible explanation for the disagreement came from user Adel:

I think you see the badge as an image. But I see it as just text.

I think that's very astute. Despite my reputation on Stack Overflow, I'm decidedly not a programmer. I'm a VFX supervisor who spends a fair amount of downtime at work developing tools, but my bread and butter is VFX.

So, I see the badges as images, and so want them consistent. As text, I understand why a tighter boundary makes more sense.

What does the Graphic Design Stack Exchange community feel looks best? Should width be consistent, or is it better as is?

Answer 1

Similar to setting text in all caps, ragged right edges make reading easier in most cases.

The human brain sees not only characters, but shapes, including the overall shape of a word. This shape recognition carries a great deal of weight when reading. In fact, it's often why taht old tirck of mixnig letrtes in wrods alwos them to sitll be raed corertcely. :)

Forcing all badges to the same overall shape would actually reduce readability.

Answer 2

Symmetry is not always the best aesthetic; organic contours are often preferable to perfectly symmetrical lock-step designs. I'm not going to get into whether or not this is a place where that's true, I'm just pointing out that there are multiple aesthetic perspectives on this and they're very much influenced by context and culture.

(Personally I think the current organic look is fine, and the massive swathes of blank tag in your proposal are rather unsightly: it's better to have the "white space" of the background than to introduce a whole new kind of blank area. All you're doing is calling further attention to the fact that the text is of differing lengths, giving us black bars to measure it by.)

However, there's a very simple, practical reason to keep badge "buckets" automatically sized to their text, regardless of aesthetics:

New badges.

If all badges are sized to accommodate the longest phrase any badge could possibly have, that not only calls attention to the unused space--it introduces a new variable. This wouldn't be a one-time fix, it would have to be kept in mind every time a new badge is made: at the very least, it would impose a new restriction on badge naming. Badge design and implementation would get finickier and that would in turn artificially and unnecessarily discourage the practice.

Answer 3

I like the equal width, It being a badge i think it gives it more force and gravitas. I don't think the intent is "easy to read" in gamification. you want them to have a sense of weight, power. A medal, a Roman standard! I would even toy with centering the text.