Your college or university website’s navigation or user interface can make the difference between a largely successful website and a total failure. Keep the user experience painless and efficient for your prospective students, parents, current students, and alumni by considering these 6 simple steps to improve your navigation’s usability.
Simplify the information architecture.
Determine the information architecture before you even start designing your navigation or user interface. Group your links into categories containing related information. If your architecture is complex, use multiple levels of categories to help with the organizational structure. By keeping the number of options presented within each sublevel to a minimum, you can avoid overwhelming your users with too many options.
Keep it simple. Try to group items in the most intuitive, organized way possible. It may help to utilize one or more types of user testing, such as focus groups or card sorting, to determine the best organizational structure.
Use clear wording.
Use phrasing that your users are familiar with. Don’t try to be cute or creative with your naming scheme. Use wording that is clear, concise, and to the point. Avoid long, complex words or descriptions. Try to keep each item or category exclusive. Strive to eliminate ambiguity wherever possible. You can eliminate any guesswork for the user by carefully choosing words that minimize overlap or crossover within your organizational structure.
Add visual cues.
Sometimes adding visual elements, such as iconography, to your navigation or user interface can supplement your link tabs or category levels. By introducing visual, scan-able elements to your navigation, you enable your users to find what they’re looking for faster. The best icons offer supportive clues, clarifying what each category encompasses. When deciding which icons to choose, look for those that are instantly identifiable, unambiguous and simplistic.
Stick with a classic design.
Don’t try to reinvent the wheel by designing something overly creative. Stick to classic styles of navigation that your audience already finds familiar. Be consistent and predictable. There should be zero learning curve associated with navigating your site. Develop a strong visual hierarchy of information. Avoid using flashy animation that doesn’t add to the functionality. If you choose to use more modern technologies, make sure it degrades gracefully on older browsers and devices.
Provide visual feedback.
Feedback loops, such as hover and click states, are one of the building blocks of human-computer interaction. By providing additional design variations for these states, users receive immediate feedback when various interactions, such as hovering over or clicking on a button, are successful. Rollover or hover states communicate to the user that the navigational element is indeed a clickable link. Make sure the cursor icon is set within the CSS to switch to the pointer rather than the arrow when hovering over a link. This signifies a clickable element.
Click or down states are also helpful feedback to the user that a desired action was successful and is being processed. These types of visual interactive changes can be as simple as a color or value change or a text underline.
Help your users orient themselves as they navigate through your website by providing visual clues. Design special states that mark the present tab, category and/or page within your navigation. Design variations might be as simple as a color change or other design anomaly. Breadcrumb trails can also be a helpful addition to your navigational system to maintain orientation and help users navigate backwards to parent levels within the website’s organizational structure.