Website information architecture design strategy examples (& best tools)

Website Information Architecture
Sean LeSuer
January 25, 202212 min read

It’s pretty well documented that the internet industry as a whole has a love affair with acronyms and naming things in weird ways. Sometimes very direct; other times, we end up with phrases like ‘Internet of Things.’ Odd name but pretty direct. Information architecture is another great example of the industry going for the literal.

If we think of architecture as being the creation or design of a structure, and then put that in the context of information as the medium in which we work, it actually makes perfect sense. But why is it so important, and why should you care? Well, we have some thoughts on the matter. Let’s talk about it.

What is information architecture? Our definition.

Just the thought of this question conjures up about a hundred different ways to answer because depending on the users you ask and how they use the skill, you’ll likely get a hundred different answers. Finding a solid information architecture definition is like asking someone how to catch a cloud and pin it down.

Broadly speaking then, information architecture, or IA for short, is the organization of information in the most logical and effective manner so as to produce the most seamless human-to-product interaction possible. This applies to digital and real-world/physical products.

The litmus test here is simple. If you have good information architecture, your end-user will never even notice it to begin with. Think of a situation where you’ve visited a website that was just awful. Completely disorganized and totally unpleasant to use. Now think of a site where you were immediately able to conduct your business without a single hitch in the plan and move on with your day. Sadly the negative experience is more memorable because something went wrong, and it was the opposite of our expectations, so it stands out.

We expect things to go right, so when they do, it’s really nothing to write home about. For this reason, IA being done really well is so critical. When it goes wrong – we can’t post our thoughts and emphatic use of angry emojis fast enough about something that went wrong at (insert store name here) or on (insert some crazy app here).

The 8 Information Architecture principles

Thankfully there are some bits of the information architecture process that the masses do agree on. Even better – it’s actually the important parts, so you’ll want to take note of this section especially. There are eight principles compiled by Dan Brown (not the Dan Brown that wrote The Da Vinci Code) to guide the information architecture process and create a more uniform system that anyone can use, and there’s a reason so many people know and trust these eight principles of information architecture; they work really well.

1. Principle of objects

Treat your content like a living thing with a life, a beginning and end, attributes, and behaviors.

2. Principle of choices

Create pages that give relevant choices to end-users, but maintain available choices to those that are focused on a particular task.

3. Principle of disclosure

Show just enough information for people to understand what they’ll find as they dig deeper.

4. Principle of exemplars

Describe the content of all categories by giving examples.

5. Principle of front doors

Assume at least 50% of your site’s visitors will come through some page other than the homepage.

6. Principle of multiple classifications

Offer end-users many different classification schemes to view your site content.

7. Principle of focused navigation

Don’t mix apples and oranges in your navigation scheme. Stick to one or the other.

8. Principle of growth

Assume the content of today is a small portion of the content you’ll offer tomorrow.

So what is information architecture in web design?

Information Architecture in web design is what guides our choices in how information is set up, arranged, and presented within a website to allow for maximum efficacy including, best website navigation/findability, usability, and the lowest bounce rate. If content is king, user experience is a big fat queen; and they live in a castle built on information architecture. If they don’t work in harmony, heads will roll.
Slickplan visual sitemap tool

Why is information architecture design important?

Without information architecture, simply put – people just give up. Think of the last time you couldn’t find something in a store. Yes, of course, you could ask, but most people don’t. And this isn’t just a ‘man thing.’ After a while, people just give up and move on. They walk out, likely annoyed, and the store loses a sale.

IA is important because people rely on it whether they know it or not. You don’t think about these kinds of things as they happen. Let’s say you walk into Target to buy socks – you don’t head to the frozen pizzas, do you? No. You get your Starbucks first like a civilized person, grab a cart, then follow the signs and cues to the apparel section. That is good IA at work, and it was so good you never knew it was happening. Good IA is also why it’s impossible to do a ‘Target run’ and walk out with only what you came in for. That’s exactly the essence of powerful IA. It works so well you don’t even know it’s happening to you. But they do. And they bank on it.

How do web design strategy and information architecture work together?

Web design strategy and IA, while they are two different beasts, have a few things in common. Both of them help users have a more pleasant experience using your product. An experience that keeps them coming back every time. Arguably design strategy and IA need to work concurrently, in parallel, and meet at the same place in the end. That’s why remaining flexible is so vital.

Both of these disciplines have a specific focus on your user’s needs, and this is important because, for example, people’s needs on Netflix are different from their needs on a bookstore’s website. Knowing your target audience is key – BUT – and it’s a big but – there’s a fine line. You want to make it accessible to the masses but at the same time still serve your target audience. This is where user personas become super helpful. Your design strategy may also include how to secure your website.

Building your own information architecture strategy

Developing a thorough information architecture strategy for your enterprise, big or small, can be the difference between your site sinking or swimming. Making the right strategic choices along the way is all about having the appropriate skill set or bringing in the people who do.

So let’s go over some info to help you float on into success.

1. Start with information architecture planning

To begin your information architecture plan, you’re going to need a few items from the IA starter pack:

  • Group your content in a way relevant to the target audience’s needs
  • Hierarchical content planning
  • Add content labels
  • Begin mind-mapping, card sorting, wireframing, and planning your navigation systems

These steps should be full-time members on your information architecture checklist. The rest will fit in as you go along in the prototyping phase and the remainder of your design process.

2. Begin composing content

Taking into account business goals, strategies, current market trends, user research, and a range of other factors, the team can get to work on composing content that adheres to this list of must-dos. It may sound like walking on eggshells or a bit of a tightrope act, but in the same breath, the more you narrow down exactly what needs to be done and not done, the easier it is to compose the content.

3. Get architectural on your content

Ensuring functionality and an easy-going user flow for your site and its content is the cornerstone of information architecture. Mobile apps, ecommerce sites, news outlets, blogs, and everything in between all rely on taking content and giving it structure.

A content audit run against functionality and what you know about your target audience will tell you how to piece together your information architecture model. From there, you can press on to UX design and the other processes your site will go through before going live. Without architecture, your UX designer has no content structure to work into a product. Although in fairness to those pulling double duty on the keyboard, your UX designer and information architect might be the same person.

4. IA web implementation

Web IA implementation is the meeting point of all of these tasks, guidelines, tools, rules, and so on in the final product. Implementing all of this is mission-critical, and spending time on it shouldn’t be up for debate. Skipping implementation of IA as a whole will be a costly mistake you can easily avoid making.

5. Use the best information architect tools

Slickplan

Slickplan
Slickplan offers many tools, including a diagram builder that recently had the benefit of getting an upgrade in our app update and is an excellent tool to have for the site planning process – which, if you didn’t know by now, is our specialty.

Website information architecture tools come in many shapes, sizes and abilities – but Slickplan has a lot of tools baked into one single app. Nothing to download. Easy to learn and use. Powerful tools without a ridiculous price tag. We even have information architecture templates, diagramming templates, and more available. Use them as they are or change them up to suit your needs. Content planning is a breeze. Sitemapping is our bread and butter. We also have plenty of plugins and an API. All of this is done under one roof, which makes handing it all off to the folks in the next phase of the design and implementation process incredibly easy.

OmniGraffle

Omnigraffle
Another big player in the information architecture software game is OmniGraffle. If you’re using a macOS or iOS device and prefer to have the software actually downloaded to said device, this is an option for you. Diagramming, wireframing, rapid prototyping, and design are their specialties. Lots of great tools, and again if your preference is having software on-device or you just really like using your Apple Pencil, then OmniGraffle is a viable option.

6. Information architecture SEO considerations

Information architecture and SEO; you can’t and shouldn’t have one without the other. Each discipline has its own nuances and rules to follow, but when they work together, they create a digital product that people actually want to use and one that can actually be found…so you can actually turn a profit. We’ve discussed IA and its many facets, but let’s add in how SEO plays into that.
SEO Information architecture

Heading architecture SEO techniques

SEO keywords in headings and within heading tags are essential and are noted by search engines, so they should definitely be taken into consideration and kept up to date.

Managing keywords for current SEO trends

As stated above, keeping those SEO keywords up-to-date is all but required because the internet is an ever-evolving, living, breathing thing (in the theoretical sense). Strategically selected SEO keywords are what help your site rank more favorably on SERPs (search engine result pages).

Avoid duplicate content

This is significant from two angles. Make sure to not have duplicate content of your own site (one page being the same as another within your site or family of sites), and make sure to not duplicate content from other sites as it waters down integrity. That second one should be obvious, but if it isn’t, you can trust and believe Google will eventually clock you for it, and they really know how to hold a grudge when it comes to this topic. You don’t want Google penalizing you. Let that be the only warning you need on the matter. Duplicate content waters down the integrity of the content, and at that point, what good is good IA if nobody’s there looking at the content?

Information architecture examples

Information architecture examples are truly everywhere we look. It isn’t always a digital product – it could be signage in a crowded subway station or airport terminal. The setup of a grocery store. The order of information within your favorite app. We mentioned earlier that good IA is IA that you don’t even notice; it just works well. Information architecture diagrams, flowmaps, mindmapping, wireframing, card sorting, labeling, and structuring are just some of the many ways you can get the most out of your content.

Information architecture diagram example

Our conclusion on information architecture website design

Luckily for the people who work in the UX/UI/IA industry and for the rest of us who are all using their products, there are a lot of great tools available for creating excellent and effective IA in website design. You can also check out more information on how to design a website right here in Slickplan! Hopefully, we’ve made it abundantly clear how necessary IA is and how much of it there really is floating around out there. You’ll probably start to notice it a bit more in your daily life.

Information architecture web design is just one piece of the puzzle when designing and creating a digital product, but by now, you’ve seen just how big of a difference it can make and how consequential it is to get it right. Your product depends on it, and your customers expect it. Rest assured, if you don’t get it right, someone will gladly let you know.😉

FAQs

  • What is the difference between content strategy and information architecture?

    Content strategy is the process that decides what the content consists of and why, and information architecture is the tool(s) given to your users that allow them to access and consume said content. Although they're very different, it's another example of not being able to have one without the other.

  • What is the difference between data architecture and information architecture?

    Think of data architecture as a filing cabinet that holds and stores files and documents, while information architecture is how the content within those files and on the documents is set up for maximum readability and functionality. They have similarities, but here you can see how different they really are.

  • What does an information architect do?

    An information architect is in charge of putting information together in a way that creates the most beneficial experience for the end-user with the least amount of effort on the user's part and ideally without them noticing it's happening. They work closely with, or may also be, your UX designer.

Sean LeSuer
Written by Sean LeSuer

Sean is a Slickplan customer support specialist, social media manager, newly minted blogger and part-time trouble-maker at Slickplan. He enjoys all things Apple, loud music and anything electronic. He also likes Piña coladas and getting caught in the rain.