Highlighting brings attention to specific parts of your design but, handled poorly, highlighting can reduce the performance of your design. You can use a variety of techniques to create highlighting, including adding bold, italics, and underlining to a font, changing the typeface, adding color, and inversing the values of a graphic. When you’re creating responsive applications (not native apps that work within the design confines of a smartphone’s operating system) you need to pay attention to highlighting techniques to make sure that the methods you’re choosing will read well on a phone or other mobile device.
YES: Well-designed highlighting is consistent and restrained.
NO: Too many colors and multiple highlights are distracting and make it hard to focus on the desired next step.
Here are some good rules of thumb:
- Highlight no more than 10 percent of the visible design
- Bolding is preferred as it adds minimal noise to the design and clearly calls attention to the highlighted word
- Avoid underlining as a highlight technique.
- UPPERCASE is useful to highlight short words, but not for long phrases or sentences.
- Changing fonts in the middle of a sentence is too subtle.
- Inverse elements sparingly
- Blinking – No. Unless you’re designing a critical alert for a high-risk system, then maybe.
Color alone should never be used as a highlighting mechanism because colorblind people may not be able to see the change, and color is too variable and culturally-specific to have a consistent meaning.
Voice of the Expert:
Fast Company Design has a design blog that features the writings and work of design masters. Check it out http://www.fastcodesign.com. Another great blog that features innovating design across many disciplines is Cool Hunting www.coolhunting.com.