Information Architecture and Navigation

Active learning works for this topic because students need to feel the friction of poorly structured systems before they can design better ones. When Year 9 students physically sort cards or sketch navigation flows, they experience firsthand how hierarchy and labeling affect usability, making abstract concepts concrete and memorable.

• Year 9
• Technologies
• 4 activities
• 25 min–40 min

Learning Objectives

1. Analyze how different information architecture models affect user task completion times on a simulated e-commerce site.
2. Design a clear and intuitive navigation system for a complex website, justifying design choices based on usability principles.
3. Evaluate the effectiveness of global, local, and contextual navigation patterns in improving user findability.
4. Create wireframes for a website that demonstrate logical content organization and user-centered navigation.
5. Compare the findability of information across two different website structures.

Concept Mapping

⏱ 35 min·Small Groups

Card Sorting: Content Hierarchy

Distribute cards with website content items to small groups. Students sort them into categories, label groups, and draw a site map. Groups then merge maps and test findability by having peers locate items quickly.

Prepare & details

Analyze how information architecture impacts user findability.

Facilitation Tip: During Card Sorting, circulate with a timer visible to create urgency and encourage students to negotiate trade-offs in real time.

Setup: Tables with large paper, or wall space

Materials: Concept cards or sticky notes, Large paper, Markers, Example concept map

• Understand
• Analyze
• Create
• Self-Awareness
• Self-Management

Concept Mapping

⏱ 30 min·Pairs

Wireframing: Multi-Level Navigation

Pairs sketch wireframes for a five-page site, adding global, local, and contextual navigation. They apply heuristics like consistency and feedback. Switch sketches for 5-minute critiques using a rubric.

Prepare & details

Design an effective navigation structure for a complex website.

Facilitation Tip: While Wireframing, provide a printed checklist of navigation elements (global menu, footer links, breadcrumbs) to ensure students include all required components.

Setup: Tables with large paper, or wall space

Materials: Concept cards or sticky notes, Large paper, Markers, Example concept map

• Understand
• Analyze
• Create
• Self-Awareness
• Self-Management

Concept Mapping

⏱ 25 min·Pairs

Usability Testing: Think-Aloud Protocol

One student navigates a printed prototype while verbalizing thoughts; partner times tasks and notes confusion points. Switch roles after three tasks, then discuss redesigns as a pair.

Prepare & details

Evaluate the usability of different navigation patterns (e.g., global, local, contextual).

Facilitation Tip: During Usability Testing, assign one student as the tester and another as the observer, then rotate roles so everyone experiences both perspectives.

Setup: Tables with large paper, or wall space

Materials: Concept cards or sticky notes, Large paper, Markers, Example concept map

• Understand
• Analyze
• Create
• Self-Awareness
• Self-Management

Gallery Walk

⏱ 40 min·Small Groups

Gallery Walk: Navigation Patterns

Post examples of navigation types around the room. Small groups evaluate each with sticky notes on strengths and weaknesses for given scenarios. Regroup to synthesize class findings.

Prepare & details

Analyze how information architecture impacts user findability.

Facilitation Tip: During the Gallery Walk, ask students to leave sticky notes with one specific question or suggestion for each wireframe they review.

Setup: Wall space or tables arranged around room perimeter

Materials: Large paper/poster boards, Markers, Sticky notes for feedback

• Understand
• Apply
• Analyze
• Create
• Relationship Skills
• Social Awareness

Teaching This Topic

Teachers should frame this topic as a design challenge, not just a technical skill. Avoid lecturing about best practices—instead, let students discover them through structured failure. Research shows that students retain design principles better when they iteratively test and refine their own solutions rather than following a prescriptive model.

What to Expect

Successful learning looks like students moving from trial and error to intentional design, where they justify their navigation choices with user needs. By the end of these activities, they should critique ineffective structures and propose clear, consistent alternatives.

Watch Out for These Misconceptions

Common Misconception

During Card Sorting, students may assume that adding more categories will help users find content faster.

What to Teach Instead

During Card Sorting, watch for groups creating overly specific categories. Have them combine categories based on user feedback and discuss how broad labels reduce cognitive load.

Common Misconception

During Wireframing, students may design navigation only for the homepage, assuming deeper pages will follow the same logic.

What to Teach Instead

During Wireframing, provide a sitemap with three levels and require students to show global, local, and contextual navigation on each page.

Common Misconception

During Usability Testing, students may believe that if users eventually find content, the navigation is acceptable.

What to Teach Instead

During Usability Testing, listen for signs of hesitation or backtracking. If testers hesitate or click randomly, use that moment to discuss how small navigation flaws compound into frustration.

Assessment Ideas

Exit Ticket

After Card Sorting, ask students to write one sentence explaining how their final category structure improved findability and one sentence describing a label they changed based on user feedback.

Quick Check

After Wireframing, display two student wireframes side by side. Ask students to identify one navigation element that works well in each and one that could be clearer, justifying their choices in two sentences.

Peer Assessment

During the Gallery Walk, each student writes feedback on sticky notes for three wireframes, answering: Is the navigation intuitive? What is one specific change that would make it clearer? Collect these for review.

Extensions & Scaffolding

• Challenge: Ask early finishers to design a navigation system for a website with conflicting user needs (e.g., students vs. teachers) and justify their trade-offs in a short written reflection.
• Scaffolding: For students struggling with hierarchy, provide pre-labeled categories and ask them to sort content into only two levels before expanding.
• Deeper exploration: Have students research a real-world website’s navigation system, analyze its strengths and weaknesses, and present findings with annotated screenshots.

Key Vocabulary

Information Architecture (IA)	The structural design of shared information environments. It is the art and science of organizing and labeling websites, intranets, online tools, and other digital spaces to support usability and findability.
Navigation System	The set of tools and methods users employ to move through and explore a digital interface, such as menus, links, and search bars.
Findability	The ease with which users can locate specific information or complete tasks within a digital interface.
Taxonomy	A classification system that organizes information into categories and subcategories, often used to structure content within an IA.
Wireframe	A basic visual guide used in user interface design to represent the skeletal framework of a website or application, focusing on layout and content placement.