Organizing Your Content and Navigation

  • Candace Chen's picture
    Candace
    March 18, 2014

A key component of a successful website is its organization of content.  When creating a new site or rebuilding a site, there are general guidelines to follow so you can organize your content in a meaningful way.  Quality content and an organized navigation are extremely helpful to facilitate visitors to get the information they needed.

Menu Guidelines

  • Titles should be short and meaningful
  • Try to use upper and lower case for your titles.  Sometimes designers want to incorporate all upper case text or all lower case text.  However, it's been proven that all upper/lower case styles are more difficult to read.
  • Links/Buttons/Call-to-Actions must have an active, inactive, and on-hover state
  • Menus should not include more than 508 items 
  • "Dangerous" items should not be in the vicinity of each other.  For example, you shouldn't place a delete button directly next to a save button.
  • Menus should not be deeply nested (2-3 levels max).  Anything more than that will likely not be seen by a lot of users. 
  • Menu items should not exceed 3-12 items
  • Menu items that frequently used or the post popular should be at the top of the menu. 

Sitemaps are extremely helpful to lay out and organize your menu structure.  Sitemaps allow you to lay out all of your content and rethink/organize the flow of how you want to present your content.  

How to Improve the Content on Your Site

  • Try to minimize the need for reading as much as possible.  People typically prefer visuals or infographics over text 
  • Use active tense to entice your user to click the call-to-action.  For example: 
    • Passive tense: Additional information is viewed after logging in. - X
    • Active tense: Login to view additional information -
  • 1.5 spacing or double spacing your text is easier for users to read and can be read faster than single spaced text
  • Keep consistency throughout your site by creating a style guide that lays out heading styles, color scheme, list styles, table styles, fonts used across the site, and generic styles.