It's a well established recommendation for publications containing masses of continuous text to use hyphenation.

Are there any ideas or guidelines on how hyphenation should be (not) used on interactive elements of UI or those that do not represent part of text content? For example, when designing 1) a menu 2) sitemap 3) sidebar etc.

The search didn't give me anything on this subject. I think mainly of web interfaces here but it may be interesting how this may be applied to app design too.

2 Answers 2


It's a well established recommendation for publications containing masses of continuous text to use hyphenation.


It's a well established recommendation for publications on paper containing masses of continuous text to use hyphenation. Even on paper you will find a bunch of style guides that recommend against it.

Remember that the one of the reasons hyphenation is recommended for paper is because it takes up less physical space, and from historical limitations of movable type presses. For paper this is a real issue of cost / physical limits. Things that don't apply as much to online work.

I've read research (unfortunately a Google fails to find it) that says that a small majority prefer hyphenated text for long passages, but I've not read anything that says it actually helps general readability. I've certainly had anecdotal reports from folk who don't have english as a first language that hyphenation makes it harder for them (but to counter that there has been research that inter-syllable hyphenation makes it easier for folk with dyslexia).

It also depends quite a bit on language. For example German's long words make hyphenation a necessity in more situations.

So — the short answer is that I'm not aware of any research that will give you guidance on hyphenation for non-body copy UI elements.

My hunch would be that they'd tend to be less effective. UI text tends to be smaller, so you'd lose the 'word shape' if the text was hyphenated making it harder to scan for. But that's a guess, and I can imagine instances where it might be the best option.

Because of the varied ways text can be presented in UI elements I suspect generally useful advice is probably impossible. If you think it will help try testing it with some users ;-)

  • Thanks for the answer. The argument for non hyphenated word being a word shape and as such more findable by visual scan seems legit. Aug 13, 2014 at 8:31
  • Yeah — but that's just me guessing. Wouldn't be the first time my hunches are crushed after watching what people actually do with a UI. Test it. See what happens ;-)
    – adrianh
    Aug 13, 2014 at 8:43
  • I may try to do this, thanks) Regarding hyphenation on paper, there're other considerations as well, apart from making the text more compact. Non hyphenated (justified) text makes paragraph more spaced, creating holes and rivers in text lines and making the text harder to read. Hyphenation is actually more of a matter in the languages where long words are common such as Slavic languages and maybe German. But all of this in real life rarely applies to non body pieces of text, I think. Aug 13, 2014 at 9:14
  • Agreed - but the holes & rivers problem goes away if you don't right justify — and the driver for filling all the horizontal space by combining right-justified text & hyphenation on the paper is — well — often to get the most out of the paper.
    – adrianh
    Aug 14, 2014 at 9:27

What is the goal?

Hoping we can agree that it's to communicate as clearly as possible with the reader?

In that case, no hyphen ever made copy LESS clear but omitting them can definitely cause confusion.

Unfortunately, design now seems to trump everything. "I don't think it looks good" seems to justify throwing out rules of punctuation that have been developed over centuries. These rules were developed for a reason -- to make reading the words and understanding the message easier.

We who write and design know what we mean. It can be almost impossible for us to see how the reader/user could be confused.

Engineers, especially, LOVE to pile 2 or 3 modifiers in front of a noun and give the reader NO idea of how they're supposed to be read.

CLARITY of communications through the marriage of design AND copy. Throwing out hyphens is like a writer saying "well, I think blue is a distracting color, so never, ever use blue."

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.