Information architecture is the work that goes into creating intuitive navigation schemes for software. Information architecture generally applies to websites, but can also apply to web applications, mobile applications, and social media software.
Ideally, a website or application’s navigation scheme makes it easy for users to find desired information or functionality. On a website, the information architecture can also add important context to the current page (for example when a user begins their visit deep within the website, having come directly from a search engine).
A “bricks and mortar” architect must balance the (often competing) demands of aesthetics, structural integrity, heating, lighting, water supply and drainage when creating building blueprints. Similarly, an information architect must create navigation schemes for software that are at once concise, descriptive, mutually-exclusive, and possessive of information scent. Both types of architect seek to create spaces for humans that are safe, predictable, enjoyable, and inspiring.
Tips for creating usable navigational systems:
- Be easy to learn.
- Be consistent throughout the website.
- Provide feedback, such as the use of breadcrumbs to indicate how to navigate back to where the user started.
- Use the minimum number of clicks to arrive at the next destination.
- Use clear and intuitive labels, based on the user’s perspective and terminology.
- Support user tasks.
- Have each link be distinct from other links.
- Group navigation into logical units.
- Avoid making the user scroll to get to important navigation or submit buttons.
- Not disable the browser’s back button.
Steps to developing an intuitive website information architecture:
- Find out what the mission or purpose of the website is: why will people come to your site?
- Determine the immediate and long-range goals of the site: are they different?
- Pinpoint the intended audiences and conduct a requirements analysis for each group.
- Collect site content and develop a content inventory.
- Determine the website’s organizational structure, which can include:
- narrow and deep
- broad and shallow
- Create an outline of the site, which can include:
- Content Inventory: a hierarchical view of the site content, typically in a spreadsheet format, which briefly describes the content that should appear on each page and indicates where pages belong in terms of global and local navigation.
- Site Maps: visual diagrams that reflect site navigation and main content areas. They are usually constructed to look like flowcharts and show how users will navigate from one section to another. Other formats may also indicate the relationships between pages on the site.
- Create a visual blueprint of the site, which can include:
- Wireframes: rough illustrations of page content and structure, which may also indicate how users will interact with the website. These diagrams get handed off to a visual designer, who will establish page layout and visual design. Wireframes are useful for communicating early design ideas and inform the designer and the client of exactly what information, links, content, promotional space, and navigation will be on every page of the site. Wireframes may illustrate design priorities in cases where various types of information appear to be competing.
- Define the navigation systems:
- Global navigation: Global navigation is the primary means of navigation through a website. Global navigation links appear on every page of the site, typically as a menu located at the top or side of each web page.
- Local navigation: Local links may appear as text links within the content of a page or as a submenu for a section of the website. Local navigation generally appears in the left-hand margin of a web page and sometimes is placed below the global navigation.
- Conduct user research:
- Once you have a draft navigation structure, conduct appropriate usability research to collect feedback from the target audience. Methods may include: Card Sorting, Cognitive Walkthroughs, Contextual Task Analyses, and Usability Testing.