A QUICK SUMMARY – FOR THE BUSY ONES
TABLE OF CONTENTS
<blockquote><p>The beginning of all understanding is classification.</p><p>– Hayden White, the author of "Metahistory" and "The Content of the Form"</p></blockquote>
Most probably you’re already familiar with concepts such as User Experience or usability. But there are also less-known ones, that are equally crucial for the success and profitability of your website or application.
One of them is Information Architecture (IA).
It is the way of organizing the information on a website, mobile or web application so that using them is simple and intuitive.
Let’s dive into this concept and uncover the benefits which good IA brings for users and for a business.
In their book “Information Architecture for the World Wide Web”, Peter Morville, Louis Rosenfeld, and Jorge Arango explain that the way people understand the world is determined by their ability to organize information.
As the authors say:
<blockquote><p>We organize [the information] to understand, to explain, and to control.</p><p>— “Information Architecture for the World Wide Web”</p></blockquote>
And the job of information architects is to use that on your website or application, organizing the information so that users can find what they’re looking for. Quickly and effortlessly.
<blockquote><p>Information architecture is the practice of deciding how to arrange the parts of something to be understandable.</p><p>— The Information Architecture Institute</p></blockquote>
Information Architecture (IA) defines the structure of a website or application, and the relationship between all the areas. It’s the skeleton that teams start working on as early as the first prototypes of the product.
The goal of IA is to classify the content on a website or web application in a way that is understandable, clear, and intuitive. Then, it needs to be organized in a user-centric way, so that users find what they need effortlessly.
Therefore, Information Architecture combines users and their needs, business goals, and content. As a result, we receive content that is organized and easy to follow.
What does organizing information mean in practice? Categorizing content, creating consistent navigation, site map, dividing content into groups.
IA designer is a complement to the design team with the main tasks consisting of research, navigation, data modeling, and labeling. Information architects often use tools such as card sorting, usability tests, and user interviews.
Information architects gather users’ needs and content and turn them into something understandable. They are responsible for how a user will navigate through the web product and reach the relevant information.
The term of Information Architecture (IA) is closely tied to the concept of User Experience (UX).
IA is more about the structure of the entire website or application, while the UX design relates to how a user feels while interacting with them.
<blockquote><p>IA is a blueprint of the design structure which can be generated into wireframes and sitemaps of the project. UX designers use them as the basic materials so that they could plan navigation system.</p><p>— UX Planet</p></blockquote>
When the Information architect works along with the UX designer, he concentrates on Information Architecture design, while the UX designer concentrates on research and wireframing.
<blockquote><p>In the analogy of constructing a building, the early phases of development involve understanding the needs of the building, its potential tenants, and local building codes. Information architects and user experience designers work closely together to determine those needs and requirements. Information Architecture is the process of identifying and defining those particular needs, and creating a structure and nomenclature for them.</p><p>— Matt Rae, Senior Product Manager at Adobe, for Adobe XD Ideas</p></blockquote>
A sitemap lists all the pages and presents the hierarchy and structure between them. It also often shows the page goals and functionalities. Site mapping is a part of IA design. Sitemaps are based on previously created Information Architecture.
Navigation guides users through a website or application via links. Is basically a collection of user interface components like filters, related links, footers, and also global or local on-page navigation. Navigation is created on the basis of IA, as part of it.
Examples of clear global website navigation:
Example of well-designed, clear website navigation that guides us through the pages:
And here you have both:
The way in which users will use an application or website depends largely on how information is presented and organised.
<blockquote><p>If you’ve ever tried to use something and thought, “where am I supposed to go next?” or “this doesn’t make any sense,” you are encountering an issue with an information architecture.</p><p>— The Information Architecture Institute</p></blockquote>
The simplest example to understand that is an e-commerce application. Imagine you enter an app trying to find new sneakers, and there’s no clear navigation nor search bar. Sneakers are mixed with sandals and boots. How much time will it take to leave the app and go to the competition? Exactly. That’s why we need to organize content in a logical way and make it as easy as possible for users to find what they need.
Good IA helps us to navigate through tons of information that flush us on every step.
<blockquote><p>In this world where we can sometimes feel as though we are drowning in data, Information Architecture provides us with a logical way of organizing this data to make it easier to locate.</p><p>— Carrie Webster, Lead UX Designer at GBG, for Smashing Magazine</p></blockquote>
Let’s start with the example of poor Information Architecture. We don’t know about you, but we’re confused about where to go and overwhelmed by the number of offers here. Plus, the not-so-good User Experience makes us question the authority of the website.
Now a good one. Simple categories on Zappos, along with clear navigation through them after clicking. Nonintrusive offers on the right and a search bar within the specific category to make things even easier.
Without a good IA, users may be confused after entering your website or application. IA responds to their needs, which oscillate around finding the right information at the right time.
<blockquote><p>IA is often underestimated, but it is a critical piece not only to the user experience of your web properties, but it can have a direct impact on your bottom line. </p><p>Where a well thought out IA and site navigation is unlikely to receive much praise (because it is simply intuitive and causes low friction), a poorly designed or thoughtless IA can lead to increased volume on phone, email and chat support, or will simply deter potential customers from engaging with your product. Spend the money up front to get the IA right, or you may be paying the price later.</p><p>— Matt Rae, Senior Product Manager at Adobe</p></blockquote>
When a user sees too much information on a screen, and there’s no clear path they can take, most likely they will drop off. Too many options may result in no decision at all. Well-crafted Information Architecture means there are clear paths to follow and not too much information on the screen.
Therefore, it speeds up the process of finding the right information, which on the other hand has a positive impact on User Experience. By that, it also reduces frustration.
We don’t want our users to be distracted when they visit our website or application. Good Information Architecture makes it easy for them to follow the task they are trying to achieve.
Thanks to good navigation and Information Architecture users not only know which path to take to achieve their goal, but it’s also easy to acknowledge where they are right now. The right visual navigation path provides the right context.
Since there’s an overload of information all around us, we need to deliver the right content at the right time. There’s no place for too slow or too complicated process of finding the information.
Good Information Architecture allows you to engage your users better and for a longer time, for example, with the use of well-designed navigation and a well-presented value proposition. Plus, if users easily find what they need on your website, they most likely won’t search for more on competitors’ sites. Also, remember that when people abandon your website or app and go to the competition, it will be hard to bring them back.
When your users can find what they’re looking for easily and intuitively, with minimum steps possible, the chance of conversion rises. We can achieve that by proper navigation and messaging. Since the income from sales increases, ROI improves.
If it’s easy to find needed information on your website or application, users won’t contact support unnecessarily — they will be able to find answers to their questions by themselves.
Poor website structure often results in poor marketing efforts, especially in terms of SEO. Websites that offer great navigation and User Experience climb higher in Google. Plus, if people leave your website or application before completing the desired action, it will be hard to win them back with remarketing because of the bad impression.
Speaking of an impression, when users can’t find what they’re looking for and navigate easily on your website or app, it has a negative impact on your brand and its reputation. Good IA and UX design will cause the opposite effect.
The answer is: yes. It is always necessary to think information architecture and navigation through. In the case of smaller, simple pages or landing pages it takes less time, but we never should skip that step. And of course, the importance and value of IA will be highly recognized while designing an extensive website or application.
Let’s take a look at the practice. Even if you’re going to delegate this work to your team or freelancers, we encourage you to become familiar with the basics of the process.
In order to take care of a well-designed IA, information architects seek the answers to the following questions:
The components that make up a good IA are:
A well-designed Information Architecture creates an intuitive and efficient User Experience. For this reason, not only UX skills are necessary to create a good web product, IA skills are equally important. Only then it is possible to create a website or application meeting the users’ needs.
There are a lot of tools for creating Information Architecture. The simplest views can be created using tools such as Microsoft Visio.
Miro is another visual collaboration tool that supports teamwork with zoomable canvas, web whiteboards, and useful integrations.
There are also useful applications for creating diagrams or mind mappings:
The way of presenting Information Architecture depends on you and your team’s preferences. It can be done using mind mapping tools. This way we can effectively visualize the Information Architecture along with its flows.
Information Architecture can also be presented as a simple diagram. This version will work well even with very large pages or applications.
Diagrams are often used for site maps that are based on a previously created IA.
The process of creating IA generally comes up to 4 steps: defining the company’s goals, defining users’ goals, analyzing competitors, and defining content. If you try to make an existing website or application better, you should also focus on the content audit.
To design an effective Information Architecture, your team needs to go through the stages of the design process.
Work on IA should begin with user research and analysis. An important part of this process is to understand the needs and problems of product users and to reconcile them with the business goals. We can use a number of tools for that purpose: card sorting, user interviews, focus groups, or surveys.
The next step is to define the navigation, the hierarchy of the individual pages, and to design how and when to display them. At this stage, we can use programs for mind mapping or diagrams.
Once we’ve developed the information structure, it’s time to name the sections and pages so that they are understandable to the user. They also make it easier to navigate the page.
The next step is to make wireframes that will be based on IA. By using them, we define a visual hierarchy of information on the page as well as connections between subsequent views of the application.
It is worthwhile to work on Information Architecture at the beginning of the product design process – after recognizing the users of the product, but before creating wireframes and mockups.
The first work should include structuring the information on the page, developing navigation, and naming the labels. The next step should be to test the IA on the users, for example using card sorting.
<blockquote><p>While the tangible targets of our work, websites and software, draw attention and investment, our superpower is organizing words to change minds, and so I propose a new definition: information architecture is the design of language and classification systems to change the world.</p><p>— Peter Morville, author of the “Information Architecture for the World Wide Web”</p></blockquote>
In this quote, Peter Morville refers to the concept of a mental model: a representation of something we — as users, and as people — have in our minds. They are built in our brains based on what we’ve learned and experienced while interacting with products and the world.
By improving our mental models — we’re learning. And by improving mental models of others — we’re teaching. “Improving others’ mental models means we’re teaching, and it’s in this uncharted stretch of IA where treasure lies.” — says Morville.
Information Architecture from a business perspective is one thing. But we never should underestimate its other power: organizing to teach, shape minds, and change the world.
Since IA is only one of many aspects everyone who takes care of a business’s success needs to understand, we invite you to go deeper into the topic of User Experience design. Other chapters of this handbook may turn out helpful for you.
Every year, Brainhub helps 750,000+ founders, leaders and software engineers make smart tech decisions. We earn that trust by openly sharing our insights based on practical software engineering experience.
UX/UI designer with 11 years of professional experience. Loves holistic design, interested in UX strategy and Lean UX.
Software development enthusiast with 6 years of professional experience in the tech industry.
Top reads this month
Get smarter in engineering and leadership in less than 60 seconds.
Join 300+ founders and engineering leaders, and get a weekly newsletter that takes our CEO 5-6 hours to prepare.
No previous chapters
No next chapters