This is the second post in my series, 10 Mistakes in Elearning Design. The first post focused on Redundant Navigation. Today we’re continuing our examination of effective navigation by considering what happens when navigation is inconsistent.
Mistake #2: Inconsistent Navigation
Take a look at these two Original Designs. Imagine that these are two slides in the same project. What do you notice about the navigation? Do you know where to click? Is the navigation clear? Is it consistent?
The issue with the above slide is that, first, the label on the Back button is impossible to read. Second, there are two very different shapes used for Next and Back.
In this slide, the Next button is now an orange square with an icon of a person inside. The Back button has moved to the top of the screen, and the contrast of the label is still poor and hard to read.
Now, the navigation in the redesign uses the same color and shape for both the Next and Back buttons. The labels are clear and easy to read. They are also placed at the bottom left and right of the screens, where users generally expect to find navigation for tutorials completed on desktops.
When in doubt, simplify your navigation and make it consistent from slide to slide. Your buttons should always look similar and be in the same place on every slide.
- Inconsistent navigation adds to extraneous cognitive load
- Custom or built-in navigation: choose one!
- Choose a specific shape and location for custom buttons and stick to it
In my next post, we’ll look at interactivity and how to do it best, with Mistake #3: Is This Interactive?