Information Architecture and User Experience

Introduction

A website is not merely a collection of pages. It is an information system through which people locate information, make decisions, complete tasks and develop trust in an organisation. Information architecture (IA) provides the structure of that system, while user experience (UX) concerns the quality of interaction with it. In digital marketing, IA and UX directly affect discoverability, engagement, conversion, retention and brand credibility.

A well-designed website answers five practical questions:

1. What information and functionality does the organisation provide?
2. How is that information grouped and labelled?
3. How can users move between related pages?
4. What actions should users be able to complete?
5. Can people with different devices, abilities and circumstances use the site successfully?

This chapter explains how to design sitemaps, navigation, page hierarchies, taxonomies, metadata, user flows and wireframes. It also applies usability principles, mobile-first and responsive design practices, and accessibility standards.

Learning Objectives

By the end of this chapter, you should be able to:

• distinguish information architecture from user experience and user interface design;
• create a content inventory, sitemap and page hierarchy;
• develop useful taxonomies, labels, navigation systems and metadata;
• model user flows for important tasks and conversion journeys;
• produce low-fidelity wireframes using mobile-first principles;
• apply usability heuristics, responsive design and accessibility requirements;
• evaluate IA and UX decisions using evidence rather than personal preference.

1. Information Architecture and UX Foundations

1.1 Information architecture

Information architecture is the deliberate organisation, labelling and connection of information and functionality so that users can find, understand and use them. It operates at several levels:

• Content structure: the relationships among pages, products, articles, services and media.
• Navigation: the controls and pathways that allow movement through the structure.
• Labelling: the words used for menus, headings, buttons, links and categories.
• Search and discovery: mechanisms that help users locate known or related information.
• Metadata: descriptive information about content, such as title, author, topic, date and format.

IA is concerned with the underlying organisation, not only visual appearance. A visually attractive website can still fail if its categories are confusing or if important information is buried.

1.2 User experience

UX is the user's overall perception of, and response to, interaction with a product, service or brand. It includes usefulness, ease of use, accessibility, efficiency, emotional response, trust and recovery from errors. UX is broader than interface styling. It includes the experience before a visit, during a task and after an action such as a purchase, enquiry or download.

A useful distinction is:

These disciplines overlap. A marketing team should therefore avoid treating UX as the responsibility of a single designer.

1.3 User-centred design

User-centred design begins with user needs, tasks and contexts rather than internal departmental structures. A common process is iterative:

1. Discover: research users, business objectives, content and constraints.
2. Define: identify priority audiences, tasks, requirements and success measures.
3. Structure: develop content models, taxonomies and navigation.
4. Design: create flows, wireframes and interface specifications.
5. Test: observe representative users attempting realistic tasks.
6. Improve: revise the design and repeat testing where necessary.

This process is not strictly linear. Evidence from testing may require changes to the sitemap or even to the original business assumptions.

2. Research Before Structure

2.1 Stakeholder and audience research

Stakeholder interviews reveal organisational goals, legal constraints, existing systems and content ownership. User research reveals what visitors are trying to accomplish, the language they use and the barriers they face. Useful methods include interviews, surveys, analytics review, search-log analysis, customer-support records, competitor analysis and usability testing.

Personas can summarise research-based patterns, but they should not become fictional stereotypes. A practical persona records goals, behaviours, context, accessibility needs, technical circumstances and barriers. A journey map then describes stages such as awareness, evaluation, action and post-purchase support.

2.2 Content inventory and audit

A content inventory is a list of existing assets, including URLs, page titles, content types, owners, dates, traffic, conversions, search visibility and status. A content audit interprets that inventory. It may classify content as:

• retain with minor revision;
• consolidate with another page;
• rewrite or update;
• redirect to a replacement;
• archive or remove.

The audit prevents a common failure: designing a new structure while carrying forward duplicated, obsolete or contradictory content.

2.3 Card sorting and tree testing

In open card sorting, participants group topics and name groups. In closed card sorting, participants place topics into pre-existing categories. Card sorting explores users' mental models; it does not by itself prove that a proposed structure works.

Tree testing presents a text-only hierarchy and asks participants to find items. It can measure whether labels and groupings support findability before visual design is introduced. Test tasks should state an objective, not a desired click path. For example, “Find the return conditions for a laptop” is preferable to “Click Products, then Support.”

3. Sitemaps and Page Hierarchies

3.1 The sitemap

A sitemap is a representation of a website's page structure and relationships. It is different from an XML sitemap submitted to a search engine. A planning sitemap normally shows human-facing pages and their hierarchy; an XML sitemap is a machine-readable list of indexable URLs.

A useful sitemap identifies:

• primary sections;
• child pages;
• landing pages;
• content templates;
• important conversion pages;
• utility pages such as search, contact, privacy and account areas;
• planned, existing and retired content.

A hierarchy should reflect user tasks and meaningful distinctions. It should not simply reproduce the organisation chart. Departments may be relevant internally but unfamiliar to customers.

3.2 Depth, breadth and hierarchy

Breadth is the number of choices at a level; depth is the number of levels a user must traverse. Excessive breadth can overwhelm users, while excessive depth can hide content. There is no universal ideal number of menu items. The appropriate structure depends on content volume, task frequency, terminology and device context.

A page should have a clear role. Common roles include:

• home or orientation page;
• section or category landing page;
• listing or search-results page;
• detail page;
• comparison page;
• campaign landing page;
• transaction or form page;
• help or support page.

Each page should have a primary purpose and a next useful action. Pages with competing primary purposes often produce weak calls to action and poor measurement.

3.3 Navigation systems

A website may use several navigation systems simultaneously:

• Global navigation: persistent access to major sections.
• Local navigation: links within the current section.
• Utility navigation: account, language, help, contact or accessibility controls.
• Breadcrumbs: a path indicating current location in a hierarchy.
• Contextual links: links embedded in content to related information.
• Footer navigation: secondary access and legal or corporate information.
• Search: direct access for users who know what they want or who prefer querying.

Navigation labels should be specific, familiar and consistent. “Services” may be appropriate when users understand the term; “What we offer” may be clearer in another context. Labels should be tested with users and aligned with search language.

Breadcrumbs support orientation but should not be the sole method of navigation. A linear path may not represent all ways users arrived at a page, especially when search, campaigns and recommendations are involved.

4. Taxonomy, Labelling and Metadata

4.1 Taxonomy

A taxonomy is a controlled classification system. It may be:

• Hierarchical: categories contain subcategories, such as Clothing → Women → Jackets.
• Faceted: items can be filtered by independent attributes, such as size, colour, price and material.
• Flat: items share a single list of categories or tags.
• Polyhierarchical: one item appears legitimately in more than one branch.

Taxonomies should be based on distinctions users understand and can apply consistently. Categories should not overlap unnecessarily. A faceted system requires governance: permitted values, spelling conventions, treatment of synonyms and rules for introducing new terms.

4.2 Labelling

Labels are interface promises. A label such as “Pricing” implies that prices will be available; “Resources” may be too vague unless its contents are familiar. Good labels are:

• concise but sufficiently descriptive;
• consistent in grammatical form;
• understandable without internal knowledge;
• compatible with user search terms;
• culturally and linguistically appropriate;
• stable over time.

Use plain language, define unavoidable technical terms and avoid relying on icons alone. For international audiences, account for translation length, reading direction, local conventions and different interpretations of symbols.

4.3 Metadata and structured content

Metadata supports management, discovery, search and reuse. Typical fields include title, summary, author, publication date, update date, topic, audience, format, language, status and canonical URL. A content model defines these fields and their relationships before pages are produced.

Search-oriented metadata may include a meaningful HTML title, a concise meta description and descriptive headings. Metadata is not a substitute for useful content, and search engines may generate their own result snippets. Social sharing metadata can control the title, description and image presented when a URL is shared.

Structured data may help machines interpret entities such as products, events, organisations or articles. It must accurately represent visible content and should not be used to make misleading claims. Metadata should be governed through ownership, review dates, versioning and change control.

5. User Flows and Conversion Journeys

A user flow models the steps, decisions, system responses and possible errors involved in completing a task. A flow begins with a user goal, not with a page list. For example, “request a consultation” may involve arriving from search, understanding the service, checking evidence, completing a form and receiving confirmation.

A flow should document:

• entry points and user intent;
• actions and decisions;
• information required at each stage;
• system feedback and validation;
• alternative routes;
• errors, recovery and abandonment points;
• completion criteria and measurement events.

A simple flow may be expressed as:

Landing page → Service overview → Evidence or pricing → Form → Validation → Confirmation → Follow-up

The arrows describe a possible route, not a compulsory sequence. Users may enter at a detail page, return from an email or use site search. Good IA supports both guided journeys and self-directed exploration.

Forms should request only necessary information, explain why sensitive information is needed and preserve entered data when errors occur. Error messages should identify the problem and state how to correct it. Confirmation pages should communicate what happens next rather than merely declaring success.

6. Wireframing and Content Structure

A wireframe is a simplified representation of layout, hierarchy and interaction. It is not a final visual design. Low-fidelity wireframes are useful because they make structural decisions visible before visual polish creates attachment to weak ideas.

A wireframe should show:

• page purpose and primary user;
• heading hierarchy;
• navigation and orientation;
• content modules;
• primary and secondary actions;
• form fields and validation areas;
• responsive behaviour;
• accessibility and interaction notes.

A content-first wireframe places real or representative headings and copy into the structure. Placeholder text often hides problems such as long headings, missing explanations or unclear calls to action.

Mobile-first and responsive design

Mobile-first design begins with the constraints and priorities of a small screen, then progressively enhances the experience for larger screens. It does not mean designing only for mobile. It means prioritising content and interactions before adding space, columns or decoration.

Responsive design allows the layout to adapt to viewport size, input method and orientation. Good practice includes:

• fluid layouts rather than fixed desktop canvases;
• readable text without forced horizontal scrolling;
• flexible images with appropriate alternatives;
• touch targets with adequate spacing;
• content order that remains logical when columns stack;
• visible focus states for keyboard users;
• testing at intermediate widths, not only at two device sizes.

A desktop interface should not simply be compressed into a narrow screen. Complex tables, comparison tools and menus may require a different mobile interaction pattern.

7. Usability and Accessibility

7.1 Usability principles

Jakob Nielsen's widely used heuristics provide a practical inspection method:

1. visibility of system status;
2. match between system and the real world;
3. user control and freedom;
4. consistency and standards;
5. error prevention;
6. recognition rather than recall;
7. flexibility and efficiency of use;
8. minimalist design;
9. support for error recognition and recovery;
10. help and documentation.

These heuristics are not a replacement for testing. They help identify likely problems quickly and generate hypotheses for research.

7.2 Accessibility

Accessibility means that people with varied abilities can perceive, operate, understand and interact with the website. The Web Content Accessibility Guidelines (WCAG) organise requirements under four principles: perceivable, operable, understandable and robust. Organisations should identify the applicable legal requirements and target an appropriate WCAG conformance level, commonly AA where required by policy or law.

Practical requirements include:

• meaningful alternative text for informative images;
• empty alternative text for decorative images;
• correct heading structure and semantic HTML;
• keyboard access to all interactive functions;
• visible and sufficiently clear focus indicators;
• labels associated with form controls;
• instructions and errors that do not rely only on colour;
• adequate contrast and scalable text;
• captions or transcripts for relevant media;
• links and buttons with descriptive names;
• no interaction that traps keyboard focus;
• sufficient time, or controls to extend time, where time limits exist.

Accessibility is not achieved by adding an overlay alone. Automated tools can detect some code and contrast issues, but they cannot reliably judge meaningful alternative text, logical reading order or whether a task is understandable. Manual keyboard testing, screen-reader testing and testing with disabled users provide stronger evidence.

7.3 Ethical and governance considerations

UX influences behaviour and therefore carries ethical responsibility. Dark patterns include disguised advertising, confirm-shaming, forced continuity, hidden costs, difficult cancellation and preselected consent. These practices may increase short-term conversion while damaging trust and potentially breaching consumer-protection or privacy law.

Forms and analytics should follow data-minimisation, purpose limitation, security and consent requirements applicable to the jurisdiction. Cookie and tracking choices should be clear, granular where required and as easy to refuse as to accept. Accessibility, privacy and inclusive language should be requirements from the beginning, not post-launch repairs.

8. Evaluation and Continuous Improvement

Evaluation should combine qualitative and quantitative evidence. Usability testing reveals why users struggle; analytics indicates where behaviour changes at scale. Useful measures include task completion, time on task, error rate, abandonment, search refinement, successful site search, qualified enquiries, conversion rate and accessibility defects.

Metrics need definitions. For example, a conversion rate should specify its numerator, denominator, time period, audience and exclusion rules. A high conversion rate may result from a small but unrepresentative audience, while a low rate may reflect traffic-quality problems rather than IA alone.

A practical evaluation cycle is:

1. establish user and business hypotheses;
2. select representative tasks and participants;
3. test the current or proposed structure;
4. record severity, frequency and affected users;
5. prioritise fixes by impact, effort and risk;
6. implement and measure again.

A/B testing can compare alternative labels or layouts when traffic and experimental controls are adequate. It should not be used to justify harmful or inaccessible designs merely because they produce more clicks.

Applied Case: Illustrative Online Training Provider

Background

An illustrative online training provider offers short courses to working adults. Its website has grown through separate marketing campaigns. Visitors report difficulty comparing courses, while analytics shows frequent exits from course pages and repeated internal searches for fees and schedules.

Problem analysis

The content audit identifies four overlapping course categories, inconsistent names for delivery modes and several outdated fee pages. Stakeholders organise content by internal departments, but interviews show that prospective learners think in terms of career goal, time available, delivery mode and price. Mobile analytics indicates that most campaign visitors use smartphones.

Approach and solution

The team creates a content model with fields for course title, outcome, duration, delivery mode, schedule, fee, prerequisites, accreditation, next intake and enquiry action. It replaces departmental navigation with user-oriented sections: “Courses,” “How learning works,” “Fees and funding,” “Student support” and “About us.”

A faceted course finder uses independent filters for subject, duration, delivery mode and level. Each course page follows a consistent hierarchy: outcome, suitability, curriculum, schedule, fee, evidence, FAQs and enquiry. A mobile-first wireframe places the course outcome and primary action before long descriptive material. The form asks only for contact details, course interest and preferred contact method.

The team conducts tree testing, then observes users completing three tasks: find a suitable course, compare two courses and request information. Keyboard and screen-reader checks are included. Labels are revised after participants misunderstand “Study pathways.”

Outcome

The redesigned structure reduces duplicate content, makes course comparisons possible and clarifies the enquiry journey. The provider then monitors search refinements, course-finder completion, form errors and qualified enquiries rather than relying only on page views. The case illustrates that successful UX results from research, content governance, structure, interaction and measurement working together.

Learning points

• Internal organisational structures may not match user mental models.
• A content model enables consistency across pages and channels.
• Mobile-first design prioritises information; it does not merely reduce dimensions.
• Accessibility testing should be part of normal evaluation.
• Business metrics must be interpreted alongside user outcomes and quality measures.

Challenges and Contemporary Developments

Common IA challenges include competing stakeholder priorities, legacy URLs, duplicated content, uncontrolled tags, internationalisation, personalisation and multiple publishing systems. Migration projects require redirects, URL mapping, ownership and quality assurance. Personalisation can make journeys more relevant but may reduce transparency, create inconsistent experiences and raise privacy concerns.

AI-assisted tools can help cluster search queries, identify duplicate content, suggest labels or generate early content inventories. Human review remains essential because automated systems can reproduce bias, misunderstand context, invent relationships and expose confidential data. AI should support research and production workflows under clear governance; it should not determine accessibility, consent or consequential user treatment without accountable human oversight.

Voice interfaces, conversational search, design systems and structured content increase the value of clear entities, metadata and semantic relationships. At the same time, core principles remain stable: understand users, make structure visible, use clear language, support errors and test with diverse people.

Best-Practice Checklist

Before launch, confirm that:

• the sitemap reflects user tasks and has named owners;
• every page has a clear purpose, audience and next action;
• labels have been tested and are consistent;
• taxonomy values are governed and duplicates resolved;
• titles, headings, summaries and metadata are meaningful;
• important flows include errors, alternatives and confirmation;
• wireframes specify mobile and larger-screen behaviour;
• semantic structure, keyboard operation and focus states work;
• content is readable, inclusive and legally appropriate;
• analytics events measure meaningful outcomes;
• redirects, search, forms and accessibility have been tested;
• post-launch review dates and improvement responsibilities are assigned.

Chapter Summary

Information architecture organises content, labels, navigation and relationships so users can find and use what they need. UX encompasses the broader quality of interaction, including usefulness, clarity, efficiency, trust and accessibility. Effective practice begins with research, content inventory and audit, then develops a sitemap, hierarchy, taxonomy and metadata model based on user tasks rather than internal departments.

Navigation should combine global, local, utility, contextual, breadcrumb and search mechanisms appropriately. User flows describe goals, decisions, system responses, errors and completion criteria. Mobile-first wireframes establish priority and structure before visual styling, while responsive design adapts layout and interaction across devices. WCAG principles, semantic structure, keyboard support, readable content and inclusive testing are central to professional practice. Evaluation should combine user research, heuristic review, accessibility assessment and carefully defined behavioural measures. Ethical UX rejects manipulation and protects privacy, autonomy and equal access.

Key Terms

Information architecture: The organisation, labelling and connection of information and functionality.

User experience: A person's overall perception and response before, during and after interaction with a product or service.

Sitemap: A representation of a website's pages and structural relationships.

Page hierarchy: The levels and parent–child relationships among pages.

Global navigation: Persistent access to a site's major sections.

Breadcrumbs: Location indicators showing a page's position in a hierarchy.

Taxonomy: A classification system used to organise content or products.

Facet: An independent attribute used to filter or explore content.

Metadata: Descriptive information about content, such as title, author or topic.

Content model: A defined set of content types, fields and relationships.

Content inventory: A list of existing content assets and their attributes.

Card sorting: A research method for exploring how users group and label topics.

Tree testing: Evaluation of findability within a text-based hierarchy.

User flow: A model of actions, decisions and system responses for a task.

Wireframe: A simplified representation of page structure and interaction.

Responsive design: Design that adapts presentation and interaction to context and viewport.

Mobile-first design: Designing for small-screen priorities before progressive enhancement.

Usability: The extent to which users can achieve goals effectively, efficiently and satisfactorily.

Accessibility: Designing so people with varied abilities can perceive, operate, understand and use a system.

Dark pattern: A deceptive or coercive interface practice that steers users against their interests.

Review Questions

Short Answer Questions

1. What is the difference between information architecture and user experience?
2. Name three navigation systems and state the purpose of each.
3. Distinguish a hierarchical taxonomy from a faceted taxonomy.
4. What is the purpose of a low-fidelity wireframe?
5. State the four principles underlying WCAG.

Long Answer Questions

1. Explain how research, content auditing and user mental models influence sitemap design.
2. Discuss the relationship between taxonomy, labelling, metadata and search discovery.
3. Describe how to design and evaluate a conversion-oriented user flow.
4. Explain mobile-first and responsive design, including their implications for content hierarchy.
5. Discuss how accessibility and ethical considerations should influence UX decisions.

Analytical / Application Questions

1. A retailer has a large menu organised by departments, but users search by product type, price and intended use. Propose a revised IA approach and justify your taxonomy and navigation choices.
2. Design a user flow for a prospective student comparing two diploma courses and requesting information. Identify at least two decision points and two possible errors.
3. Evaluate a website whose desktop layout is attractive but whose mobile pages require horizontal scrolling, use vague labels and lack visible keyboard focus. Prioritise the improvements and explain how you would test them.

Multiple Choice Questions with Answers

Question 1

Which activity primarily explores how users group and name topics?

A. Card sorting

B. A/B testing

C. Load testing

D. Conversion tracking

Correct Answer: A. Card sorting

Question 2

What is the main purpose of a sitemap used during website planning?

A. To define colour palettes

B. To represent pages and their structural relationships

C. To compress image files

D. To calculate advertising cost

Correct Answer: B. To represent pages and their structural relationships

Question 3

Which navigation system provides persistent access to major website sections?

A. Global navigation

B. Error validation

C. Metadata markup

D. Image alt text

Correct Answer: A. Global navigation

Question 4

Which statement best describes a faceted taxonomy?

A. It permits filtering by independent attributes

B. It places every item in exactly one branch

C. It contains only alphabetical labels

D. It is used only for legal pages

Correct Answer: A. It permits filtering by independent attributes

Question 5

What is the central purpose of a user flow?

A. To specify a brand's typeface

B. To model actions, decisions and system responses for a task

C. To list all employees responsible for content

D. To measure server bandwidth

Correct Answer: B. To model actions, decisions and system responses for a task

Question 6

Which practice best reflects mobile-first design?

A. Designing a desktop page and hiding random elements on mobile

B. Prioritising essential content and interactions for a small screen before enhancement

C. Preventing access from tablets

D. Using fixed-width layouts everywhere

Correct Answer: B. Prioritising essential content and interactions for a small screen before enhancement

Question 7

Which WCAG principle concerns keyboard operation and focus management?

A. Perceivable

B. Operable

C. Understandable

D. Robust

Correct Answer: B. Operable

Question 8

Why should error messages identify how a user can correct a problem?

A. To support recovery and reduce task abandonment

B. To increase the number of decorative elements

C. To replace all form labels

D. To eliminate the need for testing

Correct Answer: A. To support recovery and reduce task abandonment

Question 9

Which item is an example of metadata?

A. A page's publication date and author

B. A user's screen brightness

C. A designer's preferred colour

D. A server's electricity bill

Correct Answer: A. A page's publication date and author

Question 10

Which practice is most likely to be a dark pattern?

A. A clearly labelled unsubscribe option

B. A visible keyboard focus indicator

C. A preselected marketing consent option that is difficult to decline

D. A descriptive form error message

Correct Answer: C. A preselected marketing consent option that is difficult to decline