Everyone has their own opinion about when to use all Capital Letters (AC), normal mixed case (MC), title case (TC). Nudge an English teacher and she will lecture you on the rules of grammar. Ask a person who is a marketer and she will argue extensively about the importance of grabbing attention (go for the headings!).

A few years ago such small details didn’t matter. But now, when every design decision impacts the user experience, it has become important to pay attention to every detail. To use capitalization or running case is just one of the many decisions where designers struggle to make the right choice. This subject has been picked up by many researchers and studies have been conducted to understand if a fixed pattern exists which can be used in UX design.

Ideally, the decision to use capital letters or use Sentence casing should be backed by extensive user research on the industry for whom you are designing. The data from user research results will give you an idea about your targeted audience. You need to figure out which option is easier for your users to scan through the text. Do factors like font size, typography, font color affect the readability? Does it affect user’s knowledge retention?

Also, it’s important to understand that you can’t create a product personalized for each and every user. Everyone’s interaction with the application is different. Someone will use it on a desktop, someone will use it on a mobile app.  So, there is no right or wrong choice. Like everything else in design, it all comes down to Principle One– Empathize with your users.

One may think that battling for uppercase or lowercase is just another hyped-up detail of UX Design. Well, not really. The more I read about letter case, the more I became convinced that it’s a significant detail that designers must keep in mind while designing.

I have been looking for books and research papers which have information regarding the best ways to capitalize on menu items, headings, and other UI features. Here’s everything in a nutshell-

All capital letters (AC)

While searching for the usage of all capital letters in design, I stumbled upon this Quora answer about how non-capital letters emerged. You’ll be surprised to know the reason behind the evolution of lowercase letters- they were invented to improve readability! *sigh*

In order to understand why all capital letters are harder to read, I read a lot of blog posts which talk about why capital letters are bad for readability while scanning or reading a longer text. It appears that a common understanding prevails that when we use all capital letters, the formation is such that visually they appear to be of the same height; hence tempering the diversity of the letterforms.

A google search pointed me to the book Dynamics in Document Design which says:

“When text is set in all capital letters, reading speed is slowed about 13 to 20 percent (Breland & Breland, 1944). Reading speed is optimal when uppercase and lowercase letters are used (Poulton, 1967; Rickards & August, 1975). When extra emphasis is needed, bold has been found to be a better cue than uppercase (Coles & Foster, 1975).”

Contrary to this, here’s one blog which debunks the myth that all capital letters are harder to read. The author writes that they are only somewhat harder to read due to lack of practice, but not because of their shape.

If you dig deeper, you’ll find many more studies which suggest that for better readability all caps are better. It also works in the case of Logos, where all capital letters create a brand identity that separates you from your competitors. Visually, it looks bold, authoritative, and aggressive. But here’s what I feel- uppercase letters may have a readability advantage, but it’s restricted to certain conditions.

Confused as hell like I’m? Don’t be.

Capitalization is important. Especially, when you want to convey an important message to the user. 

However, few things have to be kept in mind while designing a website or a mobile app. The capitalization shouldn’t be used where reading long text is required. Use capital text in places such as tabs where user attention is important. Below is one such example-

When to use:

1. Be very conservative in capitalizing.

2. If you want users to avoid doing mistakes while performing a particular action, use capital letters in button texts.

3. Use uppercase letters in head­ers, cap­tions, or other UI la­bels where text length is shorter than one line (e.g., “TRUCK MODEL”)

4. Use all-capital texts in places such as UI buttons, tabs, ebook/blog/newspaper/e-paper headlines, titles of books, movies, magazines, and TV shows. Below is an example of a mobile app interface which uses capitalization to catch user’s attention towards different tabs.

5. Use capitalization where you need to shout-out an important message, something which you can’t afford your users to miss. Below is an example where capitalization is used to drive attention to a particular offer or pricing of a product.

Normal mixed case (MC) or sentence case

With sentence case, you capitalize the first letter of the sentence (and any nouns), just as your English teacher taught you. Sentence case looks casual, cleaner, improves readability and nobody ever complained that sentence case caused them any loss of business.

No wonder why Google’s Material Design follows it earnestly. Always and everywhere.

Also, when you are reading a lot of text, using sentence case doesn’t cause strain on your eyes and it’s easy to read with words flowing into each other; just as we have grown up reading.

Want more proof? Here’s a thorough, detailed, comprehensive, methodical guide to capitalizing strings in our user interface. READ IT!

One reason that really pushes me to use sentence case in my designs is that you don’t have to think which letter of which word needs to be capitalized in order to “catch” attention. It all boils down to basic grammar rules; after all as my teacher said: “Proper nouns are proper for a reason. Give them some respect.”

When to use:

1. The lower-case text is more legible than upper-case. Use sentence case extensively, without any second thoughts.

2. People spend more time skimming through the text and sentence case makes it easier for them to read. So, reading time is relatively lower in sentence case as compared to the capitalized sentences. Here’s an appropriate example-

Title case (TC)

Popularized by Apple, title case is frequently used by content-rich websites/apps (not Medium, though!) But here’s what I feel-

Title Case is Inconsistent, Sometimes Even Incongruous. It Makes Sentences Little Difficult To Read As It Makes You Stop and Process Every Single Word. As If Giving Unnecessary Emphasis To Words. I Mean Why?

See what I did there? Hah!

According to a Microsoft study– “AlTeRnAtInG case is where the letters of a word change from uppercase to lowercase multiple times within a word/sentence. The word shape model predicts that this is difficult because it gives a pattern of ascending, descending, and neutral characters that is different than exists in a word in its natural all-lowercase form.”

My logical mind can’t think of a reason to prefer title case over sentence case. There is no research-backed study where I could find that using title case has improved user attention/retention rates. However, it’s not a disaster if labels or button texts use title case. For example- phrases such as First Name, Last Name (or First name, Last name)  hardly appear to be any different.

When to use:

1. Keep the title case (as the name suggests) only for titles/subtitles/label texts. Notice the title case in the subheadings below. This is a perfect example of the hierarchy that you should aspire for in your design. Go for the all caps in the main heading, then title case for the next important information. And go for sentence case in areas where you want users to read and retain.

2. The other thing that you need to keep in mind is if you are using title case in your application, just keep it consistent throughout the app. Both iOS and Google follow this throughout their design. 

Conclusion

Gosh! Do I really have to conclude this mess?

Well, there isn’t any fixed set of rules to determine when to use what style. What I can suggest is- don’t go by what’s “correct” or what’s not. Instead, focus on what works for your system. If you know that more caps would be good for your intended audience, then go for it. If you feel using title case hinders readability, then don’t use it.

Amidst all this debate keep one thing in mind- the purpose of design is to make things simple. The most important thing to keep in mind while designing is to make the text readable, scannable, and reduce the cognitive load on the user. There may not be any fixed answer to resolve this confusion, but if you keep your users in mind, you will be able to design better user interfaces.