Why Information Architecture In UX Process Is A Necessity
Constructing an effective information architecture is a critical aspect of website construction and keeping users engaged.
Join the DZone community and get the full member experience.Join For Free
Conveying information through your website is a sensitive and critical task. Your web application may have a lot to convey, but if you don’t structure the content well enough, it could ultimately result in a high bounce rate, affecting your SEO. Well-designed applications and websites with easily-accessible information are easier to explore and understand. But they are not created instantly. Constructing the navigation and content of a website in a way that becomes easier for the end user to explore takes a considerable amount of planning, research, and time. Once the information is put up, you would also need to ensure that it is displayed to your targeted audience in a pixel-perfect manner, irrespective of browser differences. Remember, presentation matters a lot.
Information architecture is the science of structuring content. It is the art of organizing a website before starting the design and development to ensure that it supports findability and usability. It's easier to understand if you compare building a website with a building where an architect creates a blueprint that includes a floor plan, the position of floors, doors, windows, etc.
Similarly, information architecture for UX creates a blueprint that includes the hierarchy of information, so you get an idea on what needs to be displayed where and how much is too much for the end user?
Clearing The Fog Between Information Architecture and Technical Architecture
Although an information architect may have outstanding technical expertise, the opposite is not always true. A technical team is not the right choice for designing the information architecture from a UX perspective on a website. They will require the guidance of an experienced information architect.
This is because the design of a website is based on how a user thinks, not how the technical team thinks. The information architect will have a clearer understanding of a user's way of thinking through reviews, scenarios, and user interviews, from which he will decide on how the website will be designed.
An information architect, sometimes, will need the help of a technical architect when it comes to figuring out the answer to some backend or functionality related queries. When the information architecture of a website and technical architecture work hand-in-hand, the result is a web application that satisfies all the needs of a user.
Principles Of Information Architecture
The architect should have clarity regarding the functionality of an information architecture and a complete guide of the content meant to be displayed. Dan Brown, an information architect and founder of EightShapes, has stated 8 principles required to design a great website.
- Principle of Objects: Content is like a living organism. It has its unique behavior, lifecycle, and attributes.
- Principle of Choices: The number of choices should be kept as small as possible. More causes confusion. However, this concept is hypothetical and depends on the complexity of the site. If the content of the site is too large, you will definitely require multiple choices.
- Principle of Disclosure: Users should be given a preview of the information they are about to explore once they dig deeper into the website. The information can be given in the form of metadata for text content or some snapshots or meta description for images and video content.
- Principle of Exemplars: While describing the content mentioned in a category, examples are also needed. You can use an efficiently designed navigation system to arrange samples of specific content or labels.
- Principle of Front doors: It should be assumed that 50% of users are going to use a different entry point other than the home page. The site should be structured in a way so that no matter what page the user opens, they can smoothly navigate across the entire site.
- Principle of Multiple Classifications: The content of the site should be classified to increase the sense of clarity of the user regarding the site’s content. For example, if the site you are going to design is a blog and you have different types of content, you will need to create multiple child pages of different categories instead of clustering all the blog posts in a single page.
- Principle of Focused Navigation: Navigation of the site should be kept simple and it is a bad idea to mix different things. Navigation should be created in a way that the user has clarity about the menu item just by reading the name.
- Principle of Growth: It is crucial to design a scalable website for ensuring that the layout doesn’t get hassled with respect to content expansion. This will ensure that the layout will not get impacted when the content grows.
Pointers To An Effective Information Architecture For UX
Information architecture for a website is the foundational step. Creating a document results in the best foundation. Keep in mind these pointers while planning the information architecture of a website.
- Define the Goals of the Company: Before starting the plan, decide what you want to do with your website and how you want to achieve your goals. Set up a meeting with the stakeholders and find out the answers.
- Figure Out the User’s Goals: First of all, you will need to figure out the target audience who will visit your website. Create scenarios, discuss them with probable users, and find out how the users are going to use your website and for what purpose.
- Study Your Competitors: Study websites that are similar to yours and find out how they planned the information architecture from a UX point-of-view. Find out whether the website of your competitor is easier to navigate, how they display key information, and the things that make it attractive. It is important to keep in mind trending web designs. Here are 19 Trends Of Web Design For 2019.
- Draw a Site Map: Once the plan and content are ready, it’s time to figure out how users are going to access these content. Properly plan out navigation that is not too complex and will help the users to browse through your site easily. Divide your content into groups and draw them accordingly while planning the sitemap.
- Cross-Browser Testing: Your information architecture behavior may vary from one browser to another with respect to cross-browser compatibility testing. It would be very disappointing to work so hard in managing the information architecture of a website, only to watch it go south due to browser differences. With thousands of browsers available on the internet, it becomes very challenging to perform an extensive cross-browser testing. LambdaTest is a free cross browser testing tool to help you perform detailed, manual as well as automated cross browser testing of your web application across 2000+ browsers, so your information architecture for UX stays flawless.
- Usability Testing: End users are the perfect testers who will ensure that your site is perfect in every way. Set up a testing/staging environment and hire external users. Let them go through your website uninterrupted and listen to whatever opinions they share. End users always provide valuable insight which when taken care of, can dramatically increase your site’s quality.
Value Of Information Architecture
Websites with low-value content are being blocked by Facebook as well as Google. It is important to design the website in such a manner that the content is found valuable by the users. However, sometimes even with all the right content, a website fails to deliver it properly to end users. It is important to keep the points below in mind for a valuable information architecture.
- Value for User: According to research, information architecture for a website must address the following needs of a user.
- The content of the site should be something that the user needs.
- Content should inspire the user since sometimes users don’t exactly know what they want.
- Search results should be expansive because users want to see as much information as possible.
- Users want to find items they searched for before.
- Strategic Value: A successful information architecture for a website creates an alignment across many concerns related to business. Business owners usually think about the bigger picture. They are more concerned about profit margins, expenses, a customer base, and other factors. An information architect who is technically sound over his job creates a workflow that addresses all the concerns of the owners and stakeholders and also brings a certain level of clarity to the goal of the design, gradually contributing to the overall product strategy.
- Value for Business: If customers, as well as end users, are not satisfied with the website, it means a loss of business. Let’s see the facts that play a crucial role in the value of the business.
- If the internal content of a website has bad information architecture, employees spend a lot of time to obtain information. This reduces productivity.
- If customers don’t find the product that they desire easily, sales of a website may go down, resulting in bad profit and loss in business.
- The signup pages should be designed carefully. If the UX is bad, users or customers will think twice before signing up. Information architecture from UX perspective plays an important role in acquiring new members.
- Information architecture for the website also plays a vital role in search engine optimization. Content having less value, or duplicated content will reduce the site ranking.
- Value of Technology: Everything that happens on the web is the result of the magical act of information technology. The work of an information architect is similar to abstract art, the value of which is realized only when developers implement the workflow in a particular product. As an information architect, you have to ensure that the developer or designer gets a sense of clarity once they go through your workflow.
- Modeling the concept and semantics.
- Communicating with the team who is going to implement your design.
- Care towards database designers. They should clearly understand the model that you designed before implementing it.
- Value of Design: The job of an information architect of a website is only to create the sitemap and the page flow. The next phase is handled by the designer who creates a realistic prototype of what the site should actually look like before beginning the coding phase. Your workflow should address certain issues to make sure that designers don’t face any problem while creating the prototype.
- It must be easier to understand how the site will behave.
- Designers should understand how a user is going to go through the site. The elements, their placements, flow from one page to another should be to the point and concise.
Breaking The Myths Of Information Architecture In UX Process
Information Architecture Is Same As User Experience
The information architecture for a website is a process of designing a website in a way, that it satisfies the user requirements in all manner, while the user experience is how a person feels while he or she uses an application or a product.
Be it the design of a single-page portfolio or a web application with a complex navigation system, the main job of information architects is to go through complex information and create a content structure in a way that the user finds easy to understand or navigate. They do this by executing usability tests, using design methods that are completely user-centered and by researching a user’s persona.
UX designers not only think about navigation and how easy it is to understand the application’s content but also how the site keeps the user engaged. The main job of UX designers is to use user-centered design and create a product that the target audience finds attractive and stays engaged for a long time without getting bored or impatient.
The information architect’s job does not require him to consider whether the site offers an everlasting experience on the user’s mind, in short, they are not required to consider the user experience. But UX designers need to consider both UX as well as information architecture.
To make it easier to understand, let’s see an example. If you compare Zomato and Bookatable, you will find that both of them offer the same features in an easy manner. However, in Booktable, the application is a lot interesting to use for its cool design and effects, apart from being easy.
Not only that, but there is also a difference in the workflow between the two. Information architects have to research the requirement of the users and their goals and conduct a type of competitive analysis. After this, they create a pageflow, a sitemap, and a wireframe. Some usability testing may be executed and it is passed off to the next stage, where the designers do their job.
UX designers, on the other hand, go through the wireframe and sitemap created by information architects and works on the feelings and emotional requirements of the end users. Rather than layout and structure, they work more on interaction models. In layman's terms, it can be said that if you think about a building, information architecture forms the base, pillars and structural framework, while UX creates the walls, roofs, paints, and creates the rest of the building.
Users Should Reach Their Target Content In A Few Clicks
Another misconception that started long ago when people were using dial up connections and used to get frustrated by the slow speed, was that websites had the goal of guidin the user to his destination in as few clicks as possible.
However, the user experience is not about how fast a person gets to his destination, it’s about whether he enjoys the journey or not. You may keep as many clicks as you want, but you have to keep the content between each click very exciting and engaging for the end user.
Sites Should Be Logically Structured
People have this misconception that a site should be designed logically. Being an information architect, I often design sites in a way that I feel is right, and sometimes that even gets me a scolding from my supervisor. However, they forget the fact that human beings don’t work in a logical manner. We make decisions, either good or bad, not based on logic, but based on our feelings.
When visiting a grocery store around Halloween, you may have not realized the pumpkins being placed in the vegetable rack. Although, technically pumpkins are fruit, not vegetables. This is because people have the conception of pumpkin being a vegetable.
That said, the exact same thing is also true for information architecture from a UX perspective. The design and workflow of a site should be based on the mental model of the end user, not on any predefined logic.
Be Near 7 When Providing Options!
Another common myth is that you should have no more than a specified number of options in the navigation. This myth originated when George Miller wrote a psychology paper stating that an average human being can remember a maximum of 7 items in their memory for a short term. Another research states that the number is 4, which is why serial numbers for software activation as well as credit and debit card numbers are grouped into sets of 4.
Secondly, you are not required to memorize options when it comes to a website. You can see it directly on the screen. These rules have been made to avoid time-consuming phases like usability testing. However, your page will only satisfy the user when it has the required number of items in the navigation menu.
Not Prioritizing May Lead To Doom
People have a tendency to satisfy everyone, which often ends up in satisfying no one. Earlier, prioritizing the content in a website was a strict no-no. You can see many online shopping applications categorizing their products in alphabetical order, which resulted in customers spending a lot of time to search for what they needed.
However, the trend is changing. If you see sites like Amazon, Netflix, and YouTube, you will find that the content are arranged not alphabetically, but rather categorically based on your browsing history. Which makes it easier to find not what you are looking for, but what you really need.
It is rightly said that too little knowledge can be risky. Instead of blindly believing the theories and rules, it is better to research and find out whether the theory will work before applying it practically.
The Keys To An Efficient Information Architecture In a UX Process
Like all other technologies, information architecture also has certain best practices which will lead to a flawlessly designed wireframe. Let’s discuss in details.
- Research: Needless to say, this is something on which you should invest quite a lot of time. While working on the information architecture of a site, I always take time to study the user’s requirements, analyze sites of similar types to find out what is good in them and what is bad, and, most importantly, if possible, discuss with a friend or a fellow teammate regarding what they would like to have on the new site.
- Wireframing: This is one of the most important phases of information architecture from a UX perspective. Often people do it using pen and paper, but it only leads to confusion when the workflow is delivered to the designer. It is better to choose a popular wireframing tool that allows you to create dynamic wireframes and prototypes. Here are top-rated, free Web UI mock up tools.
- Inventory of Content: Before designing the layout, you need to consider what elements your website will include. Create the list of components which you will include in the project. The elements may include document files, writer information, meta tags, a description, and keywords, images as well as media elements like audio and video. Having an inventory will help the designers to design the page structure in a way that the content appropriately fits in. They can also connect the elements in order to make the site look integral.
- Data Modelling Pattern: There are certain data model patterns that would help you with an effective information architecture.
- Single Page: Appropriate for websites with a limited amount of information. Sites like personal information and a single product advertisement can be designed using the single page model.
- Flat Structure: More appropriate for sites with few more pages other than home page, each having equal importance. A portfolio or a small blog site with 4 or 5 categories can be designed using this model.
- Indexing: The most common pattern seen in large sites. The home page serves as the main page with a navigation menu using which users can access the other pages. This model treats every subpage in an unbiased way, with equal priority. An e-commerce application can be designed using this model.
- Strict Hierarchy Pattern: This is used when the subpages have their own subpages or child elements. For complex sites, this model is appropriate. A common example is an organization’s official portal for its employees, using which the employees can navigate to the sites required by them like leave management, finances, payroll, etc.
- Co-existing Hierarchy: This is for sites where the child pages can be accessed from multiple parent pages or higher level pages. If your site has a lot of information which may overlap one another, this model is appropriate.
- Labeling System: Labeling is the art of representing a huge amount of data in a few words. Often I have seen a huge amount of data designed in a clustered page that makes a user confused. However, this data can be compressed into labels to make the page look simpler and easier to process by the end user. For example, let’s suppose a page that you are creating has a huge contact information like phone, email-id, address, etc. Instead of keeping all that information in the home page, create a “Contact” button, which, upon clicking, the user will get all the required information. The button that you created acted as a label.
- Taxonomy: The practice of taxonomy refers to the grouping of information that makes a website look well-categorized and easier on the eye of the end user. For example, if you are designing a shopping application, the product page will look clustered if you keep all the products together. Instead, make small labels like Clothing, Electronics, and Household items and arrange the products categorically in each of the labels.
- Eliminating Cognitive Overhead: Cognitive load can be defined as the amount of load that can be processed by a normal human brain. While working on the website redesign, I often came across lengthy forms that require too much data to be filled by the user in a single page. Such an amount of actions can stress out a user. Cognitive overhead can be avoided in this case by using a linear flow that divides the entire form into multiple smaller sections, a section is displayed only when the previous section is correctly filled. Curious for more? Read our blog on What is Cognitive Overhead in Design and How to Reduce it?
- Audit: Your website is a collection of content which is developed using a well-defined information architecture for website. However, if you do not have any knowledge of what information bundle you have, planning a well-designed architecture gets difficult whether you are designing a site from scratch or working on a redesign. Before you start assessing the information architecture, conduct an audit session with your team and sort out the content based on what you need and what you don’t.
User experience is as important as functionality and determines the future of your website. Just like concrete sets up the foundation of a building, information architecture does the same job. Carefully planning the information architecture for a website, with well-structured and easy-to-navigate content, will not only be a treat for the end-user but would also be lucrative from an SEO point of view.
Published at DZone with permission of Arnab Roy. See the original article here.
Opinions expressed by DZone contributors are their own.