Time really does fly when you’re having fun. Rewind to November of last year (2020) and we’d just launched the first issue of our UX magazine, CRUX. If you haven’t read that inaugural edition, you can still find it right here. It’s digital, so there’s little chance of it disappearing. Anyway, I digress.

‍

I’m here (and very eager) to tell you that, as of today, we’ve just launched the second edition of CRUX! It’s an exciting day for all of us here at Optimal Workshop, as well as the fabulous bunch of intelligent, creative and amazing people from the research and design communities who helped us to put this issue together.

‍

Before we delve into what you can expect to see in this next issue, let’s recap on CRUX #1.

‍

Creating a UX magazine: A brief retrospective

‍

As you can probably guess, publishing a magazine is a bit of a labor of love. This is especially the case at Optimal Workshop where creating a magazine isn’t the only project we’ve got going on (we’re pretty busy down here in Wellington, New Zealand).

‍

But, we managed to get the first issue of CRUX out the door and by all accounts, it was a tremendous success. In the 30 days following the launch we had just over 1500 readers, with an average page per reader count of 27 (out of 34), and an average time spent reading of over 9mins. It has been viewed in over 62 countries worldwide. So, a success!

‍

Four people also spent Christmas Eve and Christmas Day tucking into CRUX, with one reader based in Ireland managing to flick through 109 pages.

‍

With these results, your feedback (we appreciate it) and an appetite to create an even better second issue, we stuck our heads down and got to work. Now, CRUX #2 is here!

‍

What you’ll find in CRUX #2

‍

It’s important to keep pushing yourself. While the first issue of CRUX got a great reception, we knew that we could do even more if given the opportunity to publish a second issue. While we talked about the idea of each future issue focusing a different theme, we instead decided to keep the brief broad – we wanted diverse opinions from a range of contributors. We think that the end selection reflects this goal.

‍

Here are just a few of the topics that you can expect to find in this issue:

‍

• How user research helps product teams to move faster and work more effectively
• Tips for making your participant recruitment process more efficient
• The case for a new role in the world of UX
• Building great content design teams
• How to start your own UX practice
• What the future holds for conversational user experiences

‍

There’s all of the above and so much more to discover in CRUX #2, so go ahead and read. We’ll be waiting and we can’t wait to hear what you think.

‍

Put the word out: We want you!

‍

Finally, let’s talk about the future of CRUX. We want to keep creating the best UX magazine as long as people like you want to keep reading it. But we need your help. We’ve had a great bunch of people contribute to CRUX #1 and #2, but we know there are more people out there who don’t have a platform. If you, or someone you know, wants to share their ideas with the world, drop us a line directly here.

‍

But for now, go and have a read of CRUX #2. We worked hard on it – and it’s all for you.

Information architecture (IA) isn’t the easiest space for a newcomer. The myriad terms and technologies can often be quite tricky to understand on their own – not to mention how they all fit together.

We wanted to help, so we’ve put together a comprehensive cheat sheet/glossary that you can use whenever the topic of IA comes up.

Information architecture

Information architecture is the structure used to organize and label content on websites, mobile applications and other digital environments. At a very basic level, IA determines the paths people take to get to the content they’re looking for and where they might get lost.

IA isn’t actually one “thing”, but a number of different elements:

• Labels: How information is represented
• Navigation: How people make their way through the information
• Search: How people look for information

It’s also the layer upon which you build the design. This means that for your users, they’ll never likely see the IA – but they will feel the effects of the decisions you make when designing it. Your IA should help people find what they’re looking for, regardless of where the IA exists. It’s as important for desktop users as it is for mobile.

Experience architecture

The term ‘experience architecture’ refers to a wider set of practices or terms that includes information architecture. Experience architecture covers IA, interaction design and experience design. It’s similar to how user experience (UX) is just one element under the wider customer experience (CX) umbrella.

Note that just as the field of information architecture has information architects, experience architecture has experience architects; people responsible for planning and executing experience architecture deliverables. Typically, the experience architecture role is quite varied in that it requires expertise in user-centered design, human behavior and interaction design.

User journey

A user journey is basically what it sounds like – the experiences someone has when they interact with something. It’s also most commonly used to describe these experiences and interactions in a software context.

User journeys describe the steps users take to complete a task when interacting with a website or other digital service. For example, for a photo storage app, the user journey may look something like this:

1. User runs out of storage space for photos
2. User finds new photos app on app store
3. User installs new photos app
4. User creates account
5. User begins uploading photos from device

Typically, you’d create a user journey in the discovery phase of a project, as you can use this tool to visualize what the users need and to influence wireframe and information architecture development.

Depending on your needs, your user journey may be quite a bit more detailed, with overarching categories ‘before’, ‘during’ and ‘after’ to show where the user is with regards to using the product. You can also add in ideal emotions at each stage.

Wireframing

Chances are if you’re using a website or mobile app, it was a wireframe at some point in the past. Wireframing is essentially a way to design digital applications at a structural level, a way to map out broadly where different elements like content and functionality sit before adding in visual design.

Wireframing is to websites, apps and other digital applications what the rough first sketch of a building is to a finished skyscraper. It’s foundational, yet entirely important to nail down broad strokes ideas before investing more heavily in design.

Why might you produce a wireframe? In addition to using it as a way to prototype ideas prior to the visual design process, wireframes are an important method of getting stakeholders and other teams onboard.

Labeling system

In the world of information architecture, labels represent a relationship between your users and content. The idea behind labels is to communicate information to users without using too much space or requiring much work on the user’s part.

Let’s take a look at an example. ‘About us’ is a label that represents a larger chunk of information. On a website, this could be information about the people who work at the organization, what the office space is like and the work that the organization does. You wouldn’t want to present all of this information to a user on the homepage, so instead, you use a label like ‘About us’ to trigger the user’s association with that term. Once they’ve seen the label, a user can decide whether they want to proceed. In a nutshell, a label should be used to communicate information clearly and efficiently.

Labels are understandably important, and things can go awry when the people designing websites and other digital applications don’t adequately consider the importance of correct labeling. Perhaps more than most other parts of a website, poor labeling is an easy way to spot websites where user needs haven’t been appropriately considered.

Search system

Search is how your users go about looking for the information they require, whereas a search system is essentially a search engine: a way to sidestep the act of navigating through a website and search directly for information. One of the biggest misconceptions when it comes to designing digital applications is that search is the answer to all navigation problems. Search systems are often seen as a way to avoid developing user-focused navigation systems, as the common thinking is that users know what they’re looking for and so will just plug terms into a search bar.

This isn’t actually true, and there’s a great quote from Larry Page that neatly summarizes this argument: “The ultimate search engine would basically understand everything in the world, and it would always give you the right thing. And we’re a long, long way from that”.

Search engines often become bandages for websites with inadequate browsing systems. When considering adding a search engine to a website, consider how much content you actually have. The last thing you want to do is have to maintain a search engine when the browsing experience meets user needs.

When a search engine is appropriate:

• Websites with large quantities of content (50+ pages)
• Websites with long, dense pages
• Any situation where browsing will take significantly longer

Metadata and taxonomies

In the world of information architecture, 2 terms that get thrown around and mixed up more than most others are taxonomy and metadata. Here’s a breakdown of what both of them mean, and how they relate to each other.

Metadata makes content findable and understandable for users and computer systems, it’s data about data. Rachel Lovinger describes it as “information about the content that provides structure, context, and meaning”. Photos typically have significant quantities of metadata attached to them, information like where the photo was taken, the date the photo was taken and the device the photo was taken on. Metadata is particularly important to search engines, helping to surface the right content based on what the user is searching for.

Taxonomies, on the other hand, refer to structures that organize information. Unlike metadata which applies to individual pieces of content, taxonomies help to organize content into hierarchical relationships.

So how do metadata and taxonomies work together? Well, if a taxonomy’s goal is to organize content, it needs terms to be stored as metadata. Christine Benson notes that “a taxonomy organizes information, and metadata describes it”. They’re really 2 parts of the same whole.

Wrap up

Hopefully, we’ve given you a clear idea of some of the more important information architecture terms and how they relate to each other. If you want to start rethinking your own website’s information architecture, there’s no better place to start than with a comprehensive understanding of how your users think the information on your website should be structured. You can read more about one of the best methods for this process, card sorting, right here on our blog.

When we first think of a beautiful website or app design, we rarely think of content structures, labels, and categories. But that’s exactly where great design and seamless user experiences begin. Beneath fancy fonts, layout, colors, and animations are the real heroes of user-centric design - information architecture and navigation.

Information architecture (IA) is like the blueprint of your website or app - it’s a conceptual content structure of how content is organized and arranged to create seamless interactions. And as useful as your information may be, if your navigation is flawed, users won’t be able to find it. They’ll simply leave your site and look elsewhere.

So, how does navigation and information architecture complement each other to create seamless user experiences?

Understanding Information Architecture

Information architecture refers to the practice of organizing, structuring, and labeling content and information to enhance the user's understanding and navigation of a website or application. It involves designing an intuitive, user-friendly, and efficient system to help users find and access the information they need easily. Good IA is essential for delivering a positive user experience and ensuring that your users can achieve their goals effectively.

IA is often confused with navigation structure. Navigation is a part of IA, and it refers to the way users move through a website or application. IA involves more than navigation; it encompasses the overall organization, labeling, and structure of content and information.

There are three key components of IA: organizational structure, content structure, and navigation structure. The organizational structure defines how information is organized, including the categories, subcategories, and relationships between them. The content structure refers to the way information is arranged and presented, including the hierarchy of information and the types of content used. The navigation structure outlines the pathways and components used for navigating through the information, such as menus, links, and search functions.

Some of the critical navigation components used in IA include menus, site maps, breadcrumb trails, and search functions. Site maps provide a visual representation of the site's structure, while breadcrumb trails show users where they are in the site's hierarchy. Search functions allow users to find specific information quickly.

Navigation: A Vital Element of Information Architecture

Navigation refers to the process of providing users with a means of moving through a website or application to access the information they need. Navigation is an integral part of IA, as it guides users through the organizational structure and content structure of a site, allowing them to find and access the information they require efficiently.

There are several types of navigation, including utility navigation and content navigation. Utility navigation refers to the elements that help users perform specific actions, such as logging in, creating an account, subscribing, or sharing content. Content navigation, on the other hand, refers to the elements used to guide users through the site's content, such as menus, links, and buttons.

Both types of navigation provide users with a roadmap of how the site is organized and how they can access/interact with the information they need. Effective navigation structures are designed to be intuitive and easy to use, minimizing the time and effort required for users to find and access the information they need.

The key elements of effective navigation include clear labeling, logical grouping, and consistency across the site. Clear labeling helps users understand what information they can expect to find under each navigation element, while logical grouping ensures that related content is grouped together, making it easier for users to find what they need. Consistency ensures that users can predict how the site is organized and can find the information they need quickly and easily.

Designing Navigation for a Better User Experience

Since navigation structures need to be intuitive and easy to use, it goes without saying that usability testing is central to determining what is deemed ‘intuitive’ in the first place. What you might deem intuitive, may not be to your target user

We’ve discussed how clear labeling, logical grouping, and consistency are key elements for designing navigation, but can they be tested and confirmed? One common usability test is called card sorting. Card sorting is a user research technique that helps you discover how people understand, label and categorize information. It involves asking users to sort various pieces of information or content into categories. Researchers use card sorting to inform decisions about product categorization, menu items, and navigation structures. Remember, researching these underlying structures also informs your information architecture - a key factor in determining good website design.

Tree testing is another invaluable research tool for creating intuitive and easy to use navigation structures. Tree testing examines how easy it is for your users to find information using a stripped-back, text-only representation of your website - almost like a sitemap. Rather than asking users to sort information, they are asked to perform a navigation task, for example, “where would you find XYZ product on our site?”. Depending on how easy or difficult users find these tasks gives you a great indication of the strengths and weaknesses of your underlying site structure, which then informs your navigation design.

Combine usability testing and the following tips to nail your next navigation design:

• Keep it simple: Simple navigation structures are easier for users to understand and use. Limit the number of navigation links and group related content together to make it easier for users to find what they need.
• Use clear and descriptive labels: Navigation labels should be clear and descriptive, accurately reflecting the content they lead to. Avoid using vague or confusing labels that could confuse users.
• Make it consistent: Consistency across the navigation structure makes it easier for users to understand how the site is organized and find the information they need. Use consistent labeling, grouping, and placement of navigation elements throughout the site.
• Test and refine: Usability testing is essential for identifying and refining navigation issues. Regular testing can help designers make improvements and ensure the navigation structure remains effective and user-friendly.

Best Practices for Information Architecture and Navigation

Both information architecture and navigation design contribute to great user experience (UX) design by making it easier for users to find the information they need quickly and efficiently. Information architecture helps users understand the relationships between different types of content and how to access them, while navigation design guides users through the content logically and intuitively.

In addition to making it easier for users to find information, great information architecture and navigation design can also help improve engagement and satisfaction. When users can find what they're looking for quickly and easily, they're more likely to stay on your website or application and explore more content. By contrast, poor information architecture and navigation design can lead to frustration, confusion, and disengagement.

So, when it comes to information architecture vs navigation, what are the best practices for design? We discussed some of the best practices for navigation design in the last section i.e. keep it simple, provide clear labels, and be consistent. Great navigation structure generally considers two factors: (1) what you want your users to do and, (2) what your users want to do. Strike a balance between the two, but ultimately your navigation system should focus on the needs of your users. Be sure to use simple language and remember to nest content into user-friendly categories.

Since great navigation design is typically a result of great IA design, it should come as no surprise that the key design principles of IA focus on similar principles. Dan Brown’s eight design principles lay out the best practices of IA design:

• The principle of objects: Content should be treated as a living, breathing thing. It has lifecycles, behaviors, and attributes.
• The principle of choices: Less is more. Keep the number of choices to a minimum.
• The principle of disclosure: Show a preview of information that will help users understand what kind of information is hidden if they dig deeper.
• The principle of examples: Show examples of content when describing the content of the categories.
• The principle of front doors: Assume that at least 50% of users will use a different entry point than the home page.
• The principle of multiple classifications: Offer users several different classification schemes to browse the site’s content.
• The principle of focused navigation: Keep navigation simple and never mix different things.
• The principle of growth: Assume that the content on the website will grow. Make sure the website is scalable.

Conclusion

Information architecture and navigation are the unsung heroes of website design that work in synchrony to create seamless user experiences. Information architecture refers to the practice of organizing and structuring content and information, while navigation guides users through the site's structure and content. Both are integral to creating intuitive user experiences.

In many ways, navigation and information architecture share the same traits necessary for success. They both require clear, logical structure, as well as clear labeling and categorization. Their ability to deliver on these traits often determines how well a website or application meets your users needs. Of course, IA and navigation designs should be anchored by user research and usability testing, like card sorting and tree testing, to ensure user experiences are as intuitive as possible!

Information architecture is so much more than finding your way around a website or app. IA should be considered the foundation of a great user experience. The planning and consideration that goes into how information is organized labeled, and named. Once this foundation is laid, the user interface is what sits above and allows users to access the information. Navigation is one way that designers can point users in the right direction. But without correct labeling and naming (or even searching) navigation can only get us part of the way.

Let’s go into detail about what information architecture and the role navigation really plays. 

What is information architecture for a website?

Probably the easiest example of navigation is on a website. We are familiar with websites and how navigation can make or break a user experience. A website's information architecture (IA) can be considered to be made of two main components:

• Identification and the definition of the site content and functionality.
• Underlying organization, labeling, and structure that will define the relationship between the site's content and functionality.

When a user lands on your website they won’t see the information architecture, rather, they will be interacting with the user interface (UI). While the IA itself is not visible while using the user interface it most certainly impacts the user's experience (UX). 

The IA should be planned and the content structure visualized through diagrams, spreadsheets, and with wireframes, prototypes, or comprehensive layouts. Designing with the IA in mind web designers can create a better user experience. The user will not see the structure of the website but they will quickly discover the way the content has been divided up and then connected visually. And how well the information architecture matches these expectations will influence their UX.

When this interaction is not a great experience, users may leave feeling that your website content or functionality is not what they needed. They may end up feeling disappointed with the experience due to poor organization, naming, or structure.

What’s the difference between IA and navigation?

Ensuring that the information architecture is thought through, considered from the end users’ perspective, tested, and planned is essential to building a great website from the ground up. Great navigation is what cues users to move on to the next step in their journey and ultimately will determine their experience.

Navigation is but one part of the story and tools to help users find their way through a website, app, or other product. 

Information architecture can be broken down into three main areas to consider when building a great user experience:

• Navigation: How people make their way through information (website content)
• Labels: How information is named and represented.
• Search: How people will look for information (keywords, categories)

When put like this it does seem pretty straightforward. Information architecture isn’t just how your information is navigated (on a website or app) but how it is labeled, the taxonomy, and the searchability help users find what they need from the information architecture.

How do the IA and navigation work together best?

An information architecture that has been planned, considered, researched, and structured with understanding and the intention of the needs of users and the owners will be robust and at its very best intuitive.

With an information architecture that has been organized well the navigation doesn’t need to work as hard. With correct labeling and organization of the content, navigation acts as a visual guide on your product to help users find their way to what they want. Imagine well-named road signs that are expected and easily seen. It makes finding what (where) you want much easier, even on a dark night.

Coupled with robust IA navigation will provide intuitive pathways for users to complete tasks. For instance, if you want your users to find where your contact information is, making certain that there is a navigation tab at the top of your website labeled ‘contact us’ which then has what might be expected (address, phone number, map, and even an email contact form) will make sense for users and the owners of the website.

Wrap Up

Whilst navigation is a key component to users finding their way through your content information architecture is so much more than navigation. IA is the foundation of a great product, naming, labeling, organizing, and planning your information in a logical and expected way. Navigation is the sign that directs people to the content they want. And from there to the task or product they are looking for. If there is navigation without thought through information architecture, they may look in the wrong place, becoming lost and abandoning their task altogether.