Navigation. It’s more than planning your road trip route. Related to the Internet, navigation is concerned with how a person moves through your web page. What does your audience read and in what order do they read it? What do they click on and where do those links go? What order do they click on things? Will they get lost?
By designing your web page you are also planning the navigation for your page. Just like designing roads and traffic signals, you will in effect determine the traffic on your page. There are several key concepts you should consider that will optimize your web page navigation.
The Sidebar Navigation
By default, your web page will display the Sidebar Navigation. This is the perfect place to customize your website’s navigation. Think about all the things you would like to communicate in your website. Imagine additional web pages you want to create. Consider other sites you may want to direct people to. Think very hard before turning off the Sidebar Navigation. For your audience this has similar repercussions to removing all traffic signals from 19th Street.
The first item in your Sidebar Navigation should be the home button for your site. You may rename it, but please do not delete this field. It is the only easy way for a mobile user to return to your home screen.
This is how the Sidebar Navigation appears on a page when viewed on a desktop computer.
The remaining items in the Sidebar Navigation are up to you. Think of this as a kind of outline of your website. Higher level items should be written as headers, the first one being your home button. Remaining items can take the form as a static list or an expandable list, both of which appear in the example below. The expandable list will appear with a small arrow, blue when the list is hidden and gold when the list is displayed. The items highlighted in red indicate the static list, while items in yellow indicate the expandable list, with the home button and other headers marked with green.
For help on how to edit your sidebar navigation please visit How do I edit the sidebar navigation?.
Organize your page based on a hierarchy. Break up text with headers and sub headers that clearly describe key ideas or concepts. Do this in your sidebar navigation as well, taking advantage of the expandable lists.
Organizing content in this clean way also helps rank your page more highly in search engine results!
For more on this please visit Using Headers.
Less is More… When Less is Specific
Have you ever visited a web page that has way too much text? There were no pictures, no headings. Or maybe the navigation panels had lists you had to actually scroll through before you found what you were looking for.
In order to keep your audience interested, remember the Less is More principle. Be concise and clear. Choose your words with precision. And use images and headers! This will break up your text into digestible chunks of information your audience can read and actually appreciate.
In the Sidebar Navigation, write your website outline then distill it down to the most specific of ideas. Label the list items using words that describe and direct users to the information.
Let Images Serve Your Navigation
Web & Digital has created exciting options for displaying your content. You can create an Image Slider or thumbnail gallery that displays a series of images that will open new web pages when clicked. For more on this please visit our help documentation for Snippets.
Link with Care
If you were trying to get to the hospital and turned onto a street following a hospital sign, you might feel lost if all of a sudden the sign pointed back the other way. You might also feel confused if a new sign for the ski hill also pointed up the street, right next to the hospital sign.
Similar levels of confusion can occur for your audience if a web page or set of web pages has too many links. People might get lost in the street grid that is your website, or people might get overwhelmed by the number of signs that are pointing in different directions.
Finally, you might find it problematic if you are looking for the hospital and you find a road sign that says “Go this Way” rather than “Hospital.” Following this example, it is important you make the text in your links short but also descriptive. Rather than tell you to click here for help actually adding a link, I’ll tell you to refer to How do I add a link?.