Website Information Architecture

They might be looking for a remarketing solution or a new laptop. People will recognize an answer to their question but don’t know if they’ve actually found the right answer (i.e. note sure if there’s a better option out there). Menus are list of links that allow the user to navigate hierarchically through a website.

  • What should the menu links be called?
  • Some might require some learning.
  • What should go where?
  • In this case, the editor’s note is supposed to merely provide extra direction for the director of the play; it is not supposed to have extra semantic meaning.
  • How should you structure the menu?
  • Somebody looking to buy gemstone jewelry has to figure out precious metals, treatments, gemstone clarity, hardness, and many other things.

Mobile web users often have access to a so-called “reader” or “reading” mode that will only show the main content of the page if it is correctly marked up. The simple example shown above isn’t pretty, but it is perfectly fine for illustrating a typical website layout example. Some websites have more columns, some are a lot more complex, but you get the idea. Gettting the information architecture of your site right ensures a great user experience, which in turn leads to higher retention and more conversions.

Site Hierarchy And Navigation

This is where the test participants create their own names for the categories. It gives you insight into how your customers think and mentally classify items. You have a bunch of pages on your website that need to be categorized. What should go where? Card sorting lets you figure out where people would want to find something. It’s an awesome (and reliable!) method for finding patterns in how users expect to find content or functionality.

To develop useful metadata, you have to determine what people care about. For coffee grinders, do people search by blade size? Knowing the parameters and variables to store in your system is crucial for excellent search results. Make sure visitors know what their options are (links like “See also” or “Related products”). Each section of your website should be stored its own folder, like the example below. Using this method makes navigating and maintaining the web site much easier.

The first test subject does a traditional open-card sort. Subsequent testers start with whatever the previous tester created. They can modify that organization or start over. You repeat the process until participants no longer make significant changes. The risk is that since anyone can start over, an outlier participant could compromise the whole study. This happens when users may have a need but aren’t certain what will fulfill it.

Local navigation links should be closest to where the user needs them. Content is first, but once the user is done reading the content, they’re going to reach for the local navigation before looking at the global navigation. Tullis and Wood recommend testing 20–30 users for card sorting. However, based on his research, Jakob Nielsen recommends testing only 15 users .

You’ve put a lot of work into it, and I’ll be returning to re-read and absorb and follow all the links. A diagramming application that allows you to create diagrams of all kinds, such as flowcharts, sitemaps, wireframes and more. In good navigation design, links look clickable. They have clear labels that set expectations of what lies beneath. Unclear menu links cause click fear.

Take a look at the navigation menu I have up there. I’ve done a good amount of testing to find the perfect good-enough wording for those. (If some of those aren’t clear, let me know). It is done on a simplified text version of your site structure—without the influence of navigation aids and visual design.

You don’t know how to build it until you know whom you’re building it for. Personas are fact-based but fictional representations of your users. They represent the goals, motivations, characteristics, and behaviors of the most important groups of people who come to your site.

Website structure example

All of it should be based on actual research and data—not much room for opinions here. There are multiple ways to get website information architecture right. Here’s the method that’s worked for me over the years.

Html Layout Elements In More Detail

You ask the first test subject to put the terms into logical groupings and create a category name for each grouping. People may want to go back to things they’ve discovered in the past. If they saw something they liked on your site during a previous visit, make it easy to find it again.

If the site hierarchy makes sense, this process should be easy. If not, the desired page may never be found. You don’t have to conduct card sorting in person. Doing it online is cheaper, doesn’t require logistics website structure planning, and can be done without geographical limitations. Participants are provided with a predetermined set of category names. Their goal is to assign the index cards to these fixed categories.

Website structure example

They’re looking for one thing but discover that they really need to know about something else. When you approach website architecture by thinking about personas and what they wish to achieve, you will work with greater confidence and clarity. Actors who will perform tasks to achieve that goal. Your website should be designed for somebody, not everybody. This is where customer personas come in.

Create user flows to map users’ progression through your site. When you’re designing the site, making sure the user accomplishes each task is vital. However, achieving that objective usually consists of a series of smaller tasks. The relationship between tasks defines experience.

Guiding Principles For Website Navigation Design

Otherwise, users have to press the tab key multiple times to navigate through all links in each section. In this case, the editor’s note is supposed to merely provide extra direction for the director of the play; it is not supposed to have extra semantic meaning. For sighted users, CSS would perhaps be used to distance the note slightly from the main text. Hi, I am not an IT professional but am interested in website design as we are re-doing our website. I found your article to be very, very helpful and it is written in simple, layman’s language where any non-technical person, such as myself, can understand.

Website structure example

If your information architecture is bad , most visitors won’t find what they’re looking for, leaving your site before entering the sales funnel. People buy only what they can find. Studies show that websites are losing money because their navigation systems fail, and users can’t find the product they’re interested in. A great, fast wireframing tool. There’s almost zero learning to get going, and I love that it focuses on the big picture, not little design elements.

The Modified-Delphi method of card sorting lets participants change others’ choices. The process continues until there’s consensus. Second, “sitemap” refers to an actual page that lists other pages on a site.

Page Structure Tutorial

Information should be offered in context. Provide answers to booking-related questions on the page where users book stuff. Keeping testimonials and FAQs on separate pages isn’t optimal—information isn’t offered when it’s needed. To design a pleasing experience, think about scenarios featuring user personas. A scenario is a story about someone using your website to carry out a specific task or goal, like booking a flight or buying yoga pants. User personas are an essential part of developing an information architecture.

Website Information Architecture: How To Optimize For Ux

Hopefully skipping stuff that’s less relevant is easy enough. The tool of choice for a lot of UX professionals. Diagrams, process charts, quick page layouts, website mock-ups, and more . What if half the people want to find Page X in Category Y, but the other half prefer Category Z? It’s okay to have the same link under two categories! If that helps people find the content they want, that’s the way to go.

Gather Data About Your Site Users Before Working On Your Site Architecture

Have not seen that before, but there’s always a first time for anything, right? Thanks for fixing it. If you do use vertical menus, make sure they’re aligned left. Right-aligned menus impede scannability.

Online Remote Card Sorting

Test subjects (representatives of your ideal customer whom you’ve recruited for this purpose) get a set of index cards with terms already written on them. Card sorting is a flexible, pen-and-paper method to organize your website content into categories. You can use sketches, diagrams, sitemaps, or wireframes to communicate your findings and proposals to move forward. Don’t know what I need to know. Sometimes people don’t know what they need to know. Somebody looking to buy gemstone jewelry has to figure out precious metals, treatments, gemstone clarity, hardness, and many other things.

In This Article

Similarly, if the page doesn’t have the content they’re looking for, the local navigation is the navigation they’ll look to first. Some web pages are easy to use. Some might require some learning. Plan for help texts and microcopy to make sure users can complete tasks without confusion. The goal is to come up with the architecture of the site. The deliverable might include sitemaps, site-flow diagrams, and wireframes to convey how the site will work from a practical perspective.

What should the menu links be called? This post gives you answers. Menus are how a user becomes aware of a site’s hierarchy. Menus can also provide shortcuts to frequently-accessed pages that are otherwise buried deep within a sitemap. Getting menus correct so that a site can be navigated is one of the most important aspects of usability.

There will be different intents and use cases among your users. That’s to be expected. In-person interviews and phone calls are best, but online surveys are also great. Needs to review the security of your connection before proceeding. Well-structured content allows more efficient navigation and processing.

Website information architecture is no joke, yet the overwhelming majority of businesses structure their site using the IMO method (“In my opinion…”). While common sense is a useful tool, and a lot of sites are simple (e.g. 5 pages), there’s a better way to go about it. What kind of content should you have on your site? How should you structure the menu? What should be the first-level menu items?

Leave a Reply

Your email address will not be published. Required fields are marked *