Although dashboards typically don’t contain a whole lot of text, the text they do have is very important and it must be readable. Some examples of text on a dashboard include:

• titles of charts and sections
• tab names
• choices in drop-down menus, check boxes, and radio buttons
• labels on buttons
• chart titles, values, axes, and legends
• tables
• instructional text

It’s important to carefully craft all these bits of text to convey only the information necessary to make the dashboard easy to understand and navigate. It is equally important to make this text easy to read. You want your users to spend more time understanding the text than trying to read it. There are many factors that affect readability, but I’ll highlight three of the most important ones below.

Maximize the contrast between text and background colors

One of the most important determining factors of readable text is how much contrast there is between text and background color. Often, you can instinctively tell when there is enough contrast, but you also have to keep in mind that not everyone sees color the same way you do. In some cases, color-blindness might be a factor, in other cases older eyes or other vision impairments may make it harder to distinguish one color from another. Many people require a higher level of contrast than you might be used to and you have to take this into consideration.

There is a formula you can use to calculate the contrast between any two colors (google “luminance contrast“), but it’s pretty complicated, so I created a tool that will do the calculation for you. Just select your background color and your text color and the tool will provide one of the following values:

• Not enough contrast – There is not enough contrast for the text to be readable.
• Low contrast – There is some some contrast, but not enough for regular-sized text to be readable.
• Good contrast – There is enough contrast for the text to be readable by most people.
• High contrast – There is enough contrast for the text to be readable by people who require higher contrast.

As a rule of thumb, I recommend aiming for “high contrast” to cover the biggest population of your users.

Avoid bright, highly saturated colors and busy backgrounds

Although there may be enough contrast between black text and a lime green background, that doesn’t mean this is a good design decision. Bright, highly saturated colors are more stressful on the eyes and demand too much attention because the eye is immediately drawn to them. Busy backgrounds have a similar effect. Your eyes insist on processing the background rather than focusing on what is really important (the text). Compare these three examples:

All three examples use black text and have enough contrast, but example 3 is clearly the easiest to read because the eye focuses on the text rather than the background.

If you find that you must use bright colors or a busy background in your design (maybe you have a style guide to follow), then you can apply a simple trick to reduce eye strain: add a light or dark layer on top of the bright color so that the bright color only appears as a border.

In Xcelsius, you can do this by utilizing a combination of Background components. Typically, Background 1 is intended to be used as a border and Background 2 is intended to be used for text. Some themes have more backgrounds to choose from, but you should always use Background 2 as the background for text.

Choose a font that is easy to read on the screen

Font choice is another important factor for a dashboard. You should avoid highly decorative fonts, such as ones mimicking handwriting, because these are much harder to read. In general, you can think of fonts as falling into 2 groups: serif and sans-serif.

Serif means the letters have little “feet” added to the tops and bottoms. An example is Times New Roman. Sans-serif, on the other hand, removes the “feet” so that the letters have more precise endings. An example of this is Tahoma. If you compare the T’s in Times New Roman and Tahoma, you will see the main difference between serif and sans-serif fonts.

The rule of thumb here is that sans-serif fonts are easier to read in small sizes on the screen than serif fonts. So, if your text needs to be really small (such as chart data values), sans-serif is a better choice.

Of course, you should also make sure the text is big enough to read. It’s tempting sometimes to make text as small as possible to fit into some pre-defined space, but you should always avoid this temptation. Rather than making the text small, you should reconsider your design so that it allows for bigger text. Even if it’s technically possible to read that text in 8pt size, it creates unnecessary strain for the eyes to process it. Ideal sizes for reading are between 10 and 12pts, but headings and titles can be larger.

Keeping in mind these three factors will help to greatly improve the readability of your dashboards. It will reduce eye strain and help your users focus on the important part – understanding the information being presented. It will also have the nice side-effect of making your dashboard just plain look better.

Instructions for using sanitary toilet seat covers

When something about a design is not intuitive, it’s tempting to start adding instructional text. Can’t figure out a good label for a button? Just add a little instructional text next to it. Not sure how to let people know what to do next? Just add a sentence or two somewhere. All they have to do is read it, right?

Unfortunately, in reality, people do not like to read. They don’t like it so much that they simply don’t do it. Instead, they scan. They look for keywords, highlighted words, bullet points, and things they can interact with, like buttons. In the above photo, what people will see is this:

As a result, they’ll stand there waving their hand over the green rectangle that the arrow is pointing to, not realizing it’s actually a button they need to push.

There are some exceptions to this rule, such as when people read in order to learn something (books, blogs, tutorials), but even in those cases it is rare that every word will be carefully read and understood.

This is especially important to consider when designing dashboards, where every bit of space should be carefully accounted for. When you find yourself thinking of adding some instructional text to your dashboard, ask yourself what is the real problem you are trying to solve?

Often, the thinking goes like this: In order to proceed to the next step in their task, users have to click button X. But our users can’t figure this out, so we should add some text that says “In order to move on, please click button X.” The real problem here is not that the users aren’t smart enough to figure out what to do next. It’s a design problem. Instead of adding text, ask yourself these questions:

• Can you change the design to make the interface self-apparent?
• Why do your users not know what to do?
• Can you set up smart defaults so your users can complete their tasks without assistance?
• What do your users expect they should be able to do? Can you change the design to meet their expectations?
• Is there another type of chart or control that would be more familiar to your users?

This is not to say that all instructional text is bad. Sometimes a little explanation is necessary. It’s just important to keep in mind how people will actually read your design. Chances are, it will be nothing like the way that you intended. They will make lots of assumptions and will get frustrated when their assumptions are proven wrong even if you have text explaining why that is. The best thing is to understand the background of your users and provide an interface that makes sense to them. You can’t fix your users, but you can fix your design.