Web Usability | Sue Brandreth's Learning Resources

Syntagm Design for Usability Home Syntagm – Design for Usability
(http://www.syntagm.co.uk/design/index.shtml)

Syntagm – Design for Usability
(http://www.syntagm.co.uk/design/elecamonglebat.htm)

Mythical user - part elephant, camel, monkey, eagle and bat

Drive-thru Tycoon – A conceptual game design
(http://www.sfu.ca/iat410/Fall07/drivethrutycoon.ppt)

Project Goal: To let the players have a sense of accomplishment by running his/her drive-thru restaurant.

Paper Prototyping Training Video
(https://www.nngroup.com/reports/paper-prototyping-training-video/)

Paper prototyping is a technique that allows you to create and test user interfaces quickly and cheaply. It’s easier to change a prototype than the final design.
This 40-minute training video demonstrates how to build paper prototypes and get usability feedback from real users early. It also makes a good educational video for Human Factors and Interaction Design students.
The demonstrations in the video feature web, applications, mobile devices, and hardware user interfaces.

Topics covered

Introduction: What is paper prototyping and why you should use it
Materials: What paper prototypes look like and how they’re created
Representing widgets and interactions. Get tips on:
- sketching screens
- representing user interface widgets
- simulating complex interactions such as drag & drop, scrolling, and multimedia
Low fidelity prototype testing (hand sketches)
Higher fidelity prototype testing (computer-created prototypes)
Mobile device testing
Hardware and kiosks tests
Convince skeptical members of your team who do not believe that it is possible to test unpolished designs; showing beats telling.

Nielsen Norman Group – Evidence-Based User Experience Research, Training, and Consulting
(https://www.nngroup.com/)

NN/g conducts groundbreaking research, evaluates user interfaces, and reports real findings – not just what’s popular or expected. With our approach, NN/g will help you create better user experiences and improve the bottom line for your business.

Bing vs Google: A Usability Face-Off
(http://webdesignledger.com/bing-vs-google-a-usability-face-off/)

We all know Google and Bing, and probably use one or both of them on more or less a daily basis. Search results are generally the defining factor that makes us have a good experience, and I suspect most of us don’t give too much consideration to the usability of the services.

However, with hundreds of millions of people using both of the services each and every day, even subtle changes in the usability of the two could add or shave off huge amounts of time for the two, and each small change can lead to a more enjoyable, more usable experience.

Today we will take a look at these two leviathans and see how they compare in terms of usability, and explain just what usability should mean to you. Want to learn how to improve conversions, get more subscribers, happier clients and better designs? Read on to find out how…..

Redesigning Google: how Larry Page engineered a beautiful revolution
(http://www.theverge.com/2013/1/24/3904134/google-redesign-how-larry-page-engineered-beautiful-revolution)

Something strange and remarkable started happening at Google immediately after Larry Page took full control as CEO in 2011: it started designing good-looking apps.
Great design is not something anybody has traditionally expected from Google. Infamously, the company used to focus on A/B testing tiny, incremental changes like 41 different shades of blue for links instead of trusting its designers to create and execute on an overall vision. The “design philosophy that lives or dies strictly by the sword of data” led its very first visual designer, Douglas Bowman, to leave in 2009.
More recently, however, it’s been impossible to ignore a series of thoughtfully designed apps — especially on iOS, a platform that doesn’t belong to Google. Google+, YouTube, Gmail, and Maps are consistent and beautiful — in stark contrast both to Google’s previous efforts and even Apple’s own increasingly staid offerings.
We went to Google looking for the person responsible for the new design direction, but the strange answer we got is that such a person doesn’t exist. Instead, thanks to a vision laid out by a small team of Google designers, each product team is finding its way to a consistent and forward-looking design language thanks to a surprising process.

Zo-ii – Playful Culture & Games Trends in Interactive Design
(http://www.zo-ii.com/trends-interactive-design-2013/)

List Of Mobile Device Viewport Sizes
(http://www.annielytics.com/blog/analytics/list-of-mobile-device-screen-resolutions/)

I had to get down and dirty with Google Analytics this week to analyze how mobile users were faring on a client’s site. Spotting an anomaly in the data, figuring out what was causing the issue came down to screen resolution. I came across a site with a comprehensive list and, of course, scraped it into a Google Doc. You can view the list of devices, sorted by brand and model on the original site or use this Google Doc.

Lowgren, J. (2013) Interaction Design. In: Soegaard, Mads and Dam, Rikke Friis (eds.).“The Encyclopedia of Human-Computer Interaction, 2nd Ed.”. Aarhus, Denmark: The Interaction Design Foundation.
Available online at http://www.interaction-design.org/encyclopedia/interaction_design.html

Defining Interaction Design, AvMcNerney, Sam (2012)
Available online at http://www.psfk.com/2012/03/interaction-design-definition.html

Revel: Programming the Sense of Touch
(https://www.disneyresearch.com/project/revel-programming-the-sense-of-touch/)
Bau, O. and Poupyrev, I. (2012) REVEL: Tactile Feedback Technology for Augmented Reality, In Proceeding of the SIGGRAPH Conference, ACM

REVEL is a new wearable tactile technology that modifies the user’s tactile perception of the physical world. Current tactile technologies enhance objects and devices with various actuators to create rich tactile sensations, limiting the experience to the interaction with instrumented devices. In contrast, REVEL can add artificial tactile sensations to almost any surface or object, with very little if any instrumentation of the environment. As a result, REVEL can provide dynamic tactile sensations on touch screens as well as everyday objects and surfaces in the environment, such as furniture, walls, wooden and plastic objects, and even human skin.

REVEL is based on Reverse Electrovibration. It injects a weak electrical signal into anywhere on the user’s body, creating an oscillating electrical field around the user’s skin. When sliding his or her fingers on a surface of the object, the user perceives highly distinctive tactile textures that augment the physical object. Varying the properties of the signal, such as the shape, amplitude and frequency, can provide a wide range of tactile sensations.

Preece, J., Helen Sharp, H. and Rogers, Y. (2015) Interaction Design – Beyond Human-Computer Interaction, 4th Edition, John Wiley and Sons UK

View resources at http://www.id-book.com/

Hugely popular with students and professionals alike, Interaction Design is an ideal resource for learning the interdisciplinary skills needed for interaction design, human computer interaction, information design, web design and ubiquitous computing.
This text offers a cross–disciplinary, practical and process–oriented introduction to the field, showing not just what principles ought to apply to interaction design, but crucially how they can be applied.
An accompanying website contains extensive additional teaching and learning material including slides for each chapter, comments on chapter activities and a number of in–depth case studies written by researchers and designers.

Chapter 1: What is Interaction Design?

Chapter 1 PowerPoint (PPT 6.4MB)

1.1 Introduction
1.2 Good and Poor Design
1.3 What Is Interaction Design?
1.4 The User Experience
1.5 The Process of Interaction Design
1.6 Interaction Design and the User Experience
Interview with Harry Brignull

Chapter 2: Understanding and Conceptualizing Interaction

Chapter 2 PowerPoint (PPT 4MB)

2.1 Introduction
2.2 Understanding the Problem Space and Conceptualizing Interaction
2.3 Conceptual Models
2.4 Interface Metaphors
2.5 Interaction Types
2.6 Paradigms, Visions, Theories, Models, and Frameworks
Interview with Kees Dorst

Chapter 3: Cognitive Aspects

Chapter 3 PowerPoint (PPT 8.5MB)

3.1 Introduction
3.2 What Is Cognition?
3.3 Cognitive Frameworks

Chapter 4: Social Interaction

Chapter 4 PowerPoint (PPT 9.4MB)

4.1 Introduction
4.2 Being Social
4.3 Face-to-Face Conversations
4.4 Remote Conversations
4.5 Telepresence
4.6 Co-presence

Chapter 5: Emotional Interaction

Chapter 5 PowerPoint (PPT 2.4MB)

5.1 Introduction
5.2 Emotions and the User Experience
5.3 Expressive Interfaces
5.4 Annoying Interfaces
5.5 Detecting Emotions and Emotional Technology
5.6 Persuasive Technologies and Behavioral Change
5.7 Anthropomorphism and Zoomorphism

Chapter 6: Interfaces

Chapter 6 PowerPoint (PPT 9.3MB)

6.1 Introduction
6.2 Interface Types
6.3 Natural User Interfaces and Beyond
6.4 Which Interface?
Interview with Leah Beuchley

Chapter 7: Data Gathering

Chapter 7 PowerPoint (PPT 4MB)

7.1 Introduction
7.2 Five Key Issues
7.3 Data Recording
7.4 Interviews
7.5 Questionnaires
7.6 Observation
7.7 Choosing and Combining Techniques

Chapter 8: Data Analysis, Interpretation, and Presentation

Chapter 8 PowerPoint (PPT 929KB)

8.1 Introduction
8.2 Qualitative and Quantitative
8.3 Simple Quantitative Analysis
8.4 Simple Qualitative Analysis
8.5 Tools to Support Data Analysis
8.6 Using Theoretical Frameworks
8.7 Presenting the Findings

Chapter 9: The Process of Interaction Design

Chapter 9 PowerPoint (PPT 2.7KB)

9.1 Introduction
9.2 What Is Involved in Interaction Design?
9.3 Some Practical Issues
Interview with Ellen Gottesdiener

Chapter 10: Establishing Requirements

Chapter 10 PowerPoint (PPT 3.2MB)

10.1 Introduction
10.2 What, How, and Why?
10.3 What Are Requirements?
10.4 Data Gathering for Requirements
10.5 Data Analysis, Interpretation, and Presentation
10.6 Task Description
10.7 Task Analysis

Chapter 11: Design, Prototyping, and Construction

Chapter 11 PowerPoint (PPT 2.6MB)

11.1 Introduction
11.2 Prototyping
11.3 Conceptual Design
11.4 Concrete Design
11.5 Using Scenarios
11.6 Generating Prototypes
11.7 Construction
Interview with the Late Gary Marsden

Chapter 12: Interaction Design in Practice

Chapter 12 PowerPoint (PPT 2MB)

12.1 Introduction
12.2 AgileUX
12.3 Design Patterns
12.4 Open Source Resources
12.5 Tools for Interaction Design

Chapter 13: Introducing Evaluation

Chapter 13 PowerPoint (PPT 1MB)

13.1 Introduction
13.2 The Why, What, Where, and When of Evaluation
13.3 Types of Evaluation
13.4 Evaluation Case Studies
13.5 What Did We Learn from the Case Studies?
13.6 Other Issues to Consider when Doing Evaluation

Chapter 14: Evaluation Studies: From Controlled to Natural Settings

Chapter 14 PowerPoint (PPT 1.4MB)

14.1 Introduction
14.2 Usability Testing
14.3 Conducting Experiments
14.4 Field Studies
Interview with Danah Boyd

Chapter 15: Evaluation: Inspections, Analytics, and Models

Chapter 15 PowerPoint (PPT 739KB)

15.1 Introduction
15.2 Inspections: Heuristic Evaluation and Walkthroughs
15.3 Analytics
15.4 Predictive Models

Lynch, P. J. and Horton, S. (2008) Web Style Guide: Basic Design Principles for Creating Web Sites, Third Edition, Yale University Press

Companion Web Site: http://webstyleguide.com/

Web Style Guide Online: http://webstyleguide.com/wsg3/index.html (See below)

Consistently praised in earlier editions as the best volume on classic elements of web site design, Web Style Guide, now in its Third Edition, continues its tradition of emphasis on fundamentals. Focusing on the needs of web site designers in corporations, government, nonprofit organizations, and academic institutions, the book explains established design principles and how they apply in web design projects in which information design, interface design, and efficient search and navigation are of primary concern. New in this edition: –a full chapter devoted to Universal Usability –guidelines and techniques for creating universally usable designs –a full chapter on Information Architecture and how best to promote its robust development –information on Search Engine Optimization and the designs that improve it –techniques for using Cascading Style Sheets for layouts and typographic design –185 illustrations, all in full color

Table of Contents

Web Style Guide Online

Contents

Moule, Jodie (2012) Killer UX Design, SitePoint Pty Ltd

Download PDF eBook (PDF 56MB)

Download Tools (ZIP 3.7KB)

Today, technology is used to shift, sway and change attitudes and behavior. This creates amazing opportunities and challenges for designers. If we want to create products and services that have the power to educate people so they may live better lives, or help to reduce the time people take to do certain tasks, we first need an understanding of how these people think and work – what makes them “tick”.
The premise of this book is the need to understand how people “behave”; their habits, motivators and drivers, as a critical way to better understand what a great customer experience for your audience looks like, facilitating better design decisions. The book will lead you from understanding behavior, to extracting customer insights that can launch you into the design of something that makes a difference to people’s lives – all presented in a fun, practical and non-academic way.

Understanding UX: What UX is and how it can work for you.
Decoding behavior: Recognize human habits and motivators.
Researching: Gain insights into users through proven techniques.
Analyzing insights: Transform research into ideas and opportunities.
Prototyping: Sketches, wireframes, taskflows and online tools.
Tracking users’ habits: Set up of a test environment to measure behavior and optimize designs.

Table of Contents

You Are Not Your User
Understand the Business Problem
Understand the User Context
Making Sense of What You’ve Found
Sketching to Explore the Design Concept
Prototype the Solution
Test, Learn, Tweak. Iterate
Launch to Learn About Behavior

Chisholm, W. and May, Matt (2009) Universal Design for Web Applications, O’Reilly Media

Download Source Code (ZIP 10KB)
Companion website: http://ud4wa.com/

Universal Design for Web Applications teaches you how to build websites that are more accessible to people with disabilities and explains why doing so is good business. It takes more work up front, but the potential payoff is huge — especially when mobile users need to access your sites.
You’ll discover how to use standards-based web technologies — such as XHTML, CSS, and Ajax, along with video and Flash — to develop applications for a wide range of users and a variety of devices, including the mobile Web. You’ll also learn specifics about this target audience, especially the key over-50 age group, whose use of the Web is rapidly growing.

With this book, you will:

Learn the importance of metadata and how it affects images, headings, and other design elements
Build forms that accommodate cell phones, screen readers, word prediction, and more
Create designs using color and text that are effective in a variety of situations
Construct tables that present information without spatial cues
Design Ajax-driven social networking applications that people with disabilities can access
Provide audio with transcriptions and video that includes captions and audio descriptions
Discover assistive technology support for Rich Internet Application technologies such as Flash, Flex, and Silverlight

Universal Design for Web Applications provides you with a roadmap to help you design easy-to-maintain web applications that benefit a larger audience.

Chapter 1 Introducing Universal Design
1. Accessible Design: A Story
2. Putting Universal Design to Work
Chapter 2 Selling It
1. There Is No “Them”
2. Audience Characteristics
3. Growth Opportunity
4. Legal Liability
5. The Standards
6. Professionalism
7. Early and Often
8. Summary
Chapter 3 Metadata
1. What Is Metadata?
2. Images
3. Keys to Writing Good Text Alternatives
4. Summary
Chapter 4 Structure and Design
1. First Principles
2. Headings
3. Links
4. Tables
5. Lists
6. Color
7. CSS Highlights
8. Flicker and Patterns
9. Designing for Email
10. Summary
Chapter 5 Forms
1. Labels
2. fieldset and legend
3. The accesskey Attribute
4. Tab Order
5. Error Handling
6. CAPTCHA
7. Summary
Chapter 6 Tabular Data
1. Data Table Basics
2. Headings and Data
3. Complex Data Tables
4. Readability, Layout, and Design
5. Summary
Chapter 7 Video and Audio
1. Web Video: The Early Years
2. Accessibility in Video
3. Transcripts and Text Alternatives
4. Summary
Chapter 8 Scripting
1. Building on a Solid Foundation
2. Summary
Chapter 9 Ajax and WAI-ARIA
1. Taking Stock of Existing Code
2. Summary
Chapter 10 Rich Internet Applications
1. Features of RIAs
2. User-Generated Content
3. Testing Your Code
4. Summary
Chapter 11 The Process
1. Universal by Design

Appendix Cross-Reference for Universal Design for Web Applications

Difeterici, G. (2012) The Web Designer’s RoadMap, SitePoint Pty. Ltd.

Download PDF eBook (PDF 16.7MB)

The Web Designer’s Roadmap is a full-color book about the creative process and the underlying principles that govern that process.
While other books cover the nuts ‘n’ bolts of how to design the elements that make up websites, this book outlines how effective designers go about their work, illustrating the complete creative process from start to finish.
As well as how-to content, the book draws on interviews with a host of well-known design gurus, including Shaun Inman, Daniel Burka, Meagan Fisher, Donald Norman and Dan Rubin.

A non-academic book, this is a fun and easy read packed with practical information.

Establishing a process: The steps to producing successful web designs.
Gaining inspiration: Fresh ways of seeking inspiration for your designs.
Gathering resources: Design research and harnessing client knowledge.
Working without Photoshop: Using thumbnails, grayboxes, and wireframes.
Structuring creativity: With design patterns, color palettes, and storyboards.
Designing for mobile: An introduction to responsive design principles.

Chapter 1: Beauty, Creativity, and Inspiration
Chapter 2: It Ain’t Over Till It’s Over: A Bit of Design History
Chapter 3: Gathering Resources: That Rucksack Has a Lot of Pockets
Chapter 4: Form and Function
Chapter 5: Design Patterns: Tried and Trusted Solutions
Chapter 6: Conceptual Design and Our Color Project
Chapter 7: Designing in the Wild

Scott, B. and Neil, T. (2009) Designing Web Interfaces: Principles and Patterns for Rich Interactions, O’Reilly Media Inc.

Download eBook CHM (PDF KB)

Companion Web Site: http://designingwebinterfaces.com/

Also: http://www.looksgoodworkswell.com/

Want to learn how to create great user experiences on today’s Web? In this book, UI experts Bill Scott and Theresa Neil present more than 75 design patterns for building web interfaces that provide rich interaction. Distilled from the authors’ years of experience at Sabre, Yahoo!, and Netflix, these best practices are grouped into six key principles to help you take advantage of the web technologies available today. With an entire section devoted to each design principle, Designing Web Interfaces helps you:

Make It Direct-Edit content in context with design patterns for In Page Editing, Drag & Drop, and Direct Selection
Keep It Lightweight-Reduce the effort required to interact with a site by using In Context Tools to leave a “light footprint”
Stay on the Page-Keep visitors on a page with overlays, inlays, dynamic content, and in-page flow patterns
Provide an Invitation-Help visitors discover site features with invitations that cue them to the next level of interaction
Use Transitions-Learn when, why, and how to use animations, cinematic effects, and other transitions
React Immediately-Provide a rich experience by using lively responses such as Live Search, Live Suggest, Live Previews, and more

Designing Web Interfaces illustrates many patterns with examples from working websites. If you need to build or renovate a website to be truly interactive, this book gives you the principles for success.

Table of Contents

Foreword; Preface; What Happened; Why We Wrote This Book; What This Book Is About; Who Should Read This Book; What Comes with This Book; Conventions Used in This Book; Using Examples; We’d Like to Hear from You; Safari Books Online; Acknowledgments; Make It Direct; Chapter 1: In-Page Editing; 1.1 Single-Field Inline Edit; 1.2 Multi-Field Inline Edit; 1.3 Overlay Edit; 1.4 Table Edit; 1.5 Group Edit; 1.6 Module Configuration; 1.7 Guidelines for Choosing Specific Editing Patterns; Chapter 2: Drag and Drop; 2.1 Interesting Moments; 2.2 Purpose of Drag and Drop; 2.3 Drag and Drop Module; 2.4 Drag and Drop List; 2.5 Drag and Drop Object; 2.6 Drag and Drop Action; 2.7 Drag and Drop Collection; 2.8 The Challenges of Drag and Drop; Chapter 3: Direct Selection; 3.1 Toggle Selection; 3.2 Collected Selection; 3.3 Object Selection; 3.4 Hybrid Selection; Keep It Lightweight; Chapter 4: Contextual Tools; 4.1 Interaction in Context; 4.2 Fitts’s Law; 4.3 Contextual Tools; 4.4 Always-Visible Tools; 4.5 Hover-Reveal Tools; 4.6 Toggle-Reveal Tools; 4.7 Multi-Level Tools; 4.8 Secondary Menu; Stay on the Page; Chapter 5: Overlays; 5.1 Dialog Overlay; 5.2 Detail Overlay; 5.3 Input Overlay; Chapter 6: Inlays; 6.1 Dialog Inlay; 6.2 List Inlay; 6.3 Detail Inlay; 6.4 Tabs; 6.5 Inlay Versus Overlay?; Chapter 7: Virtual Pages; 7.1 Virtual Scrolling; 7.2 Inline Paging; 7.3 Scrolled Paging: Carousel; 7.4 Virtual Panning; 7.5 Zoomable User Interface; 7.6 Paging Versus Scrolling; Chapter 8: Process Flow; 8.1 Google Blogger; 8.2 The Magic Principle; 8.3 Interactive Single-Page Process; 8.4 Inline Assistant Process; 8.5 Dialog Overlay Process; 8.6 Configurator Process; 8.7 Static Single-Page Process; Provide an Invitation; Chapter 9: Static Invitations; 9.1 Call to Action Invitation; 9.2 Tour Invitation; Chapter 10: Dynamic Invitations; 10.1 Hover Invitation; 10.2 Affordance Invitation; 10.3 Drag and Drop Invitation; 10.4 Inference Invitation; 10.5 More Content Invitation; 10.6 The Advantage of Invitations; Use Transitions; Chapter 11: Transitional Patterns; 11.1 Brighten and Dim; 11.2 Expand/Collapse; 11.3 Self-Healing Fade; 11.4 Animation; 11.5 Spotlight; Chapter 12: Purpose of Transitions; 12.1 Engagement; 12.2 Communication; React Immediately; Chapter 13: Lookup Patterns; 13.1 Auto Complete; 13.2 Live Suggest; 13.3 Live Search; 13.4 Refining Search; Chapter 14: Feedback Patterns; 14.1 Live Preview; 14.2 Progressive Disclosure; 14.3 Progress Indicator; 14.4 Periodic Refresh; Principles and Patterns for Rich Interaction; The Principles; Staying Up to Date; Colophon;|

Make It Direct
- Chapter 1: In-Page Editing
- Chapter 2: Drag and Drop
- Chapter 3: Direct Selection
Keep It Lightweight
- Chapter 4: Contextual Tools
Stay on the Page
- Chapter 5: Overlays
- Chapter 6: Inlays
- Chapter 7: Virtual Pages
- Chapter 8: Process Flow
Provide an Invitation
- Chapter 9: Static Invitations
- Chapter 10: Dynamic Invitations
Use Transitions
- Chapter 11: Transitional Patterns
- Chapter 12: Purpose of Transitions
React Immediately
- Chapter 13: Lookup Patterns
- Chapter 14: Feedback Patterns
Principles and Patterns for Rich Interaction

Tidwell, J, (2011) Designing Interfaces, Second Edition, O’Reilly Media Inc.

Download eBook PDF (PDF KB)

Despite all of the UI toolkits available today, it’s still not easy to design good application interfaces. This bestselling book is one of the few reliable sources to help you navigate through the maze of design options. By capturing UI best practices and reusable ideas as design patterns, Designing Interfaces provides solutions to common design problems that you can tailor to the situation at hand.

This updated edition includes patterns for mobile apps and social media, as well as web applications and desktop software. Each pattern contains full-color examples and practical design advice that you can use immediately. Experienced designers can use this guide as a sourcebook of ideas; novices will find a roadmap to the world of interface and interaction design.

Design engaging and usable interfaces with more confidence and less guesswork
Learn design concepts that are often misunderstood, such as affordances, visual hierarchy, navigational distance, and the use of color
Get recommendations for specific UI patterns, including alternatives and warnings on when not to use them
Mix and recombine UI ideas as you see fit
Polish the look and feel of your interfaces with graphic design principles and patterns

“Anyone who’s serious about designing interfaces should have this book on their shelf for reference. It’s the most comprehensive cross-platform examination of common interface patterns anywhere.”–Dan Saffer, author of Designing Gestural Interfaces (O’Reilly) and Designing for Interaction (New Riders)

Kalbach, J. (2007) Designing Web Navigation – Optimizing the User Experience, O’Reilly Media Inc.

Thoroughly rewritten for today’s web environment, this bestselling book offers a fresh look at a fundamental topic of web site development: navigation design. Amid all the changes to the Web in the past decade, and all the hype about Web 2.0 and various “rich” interactive technologies, the basic problems of creating a good web navigation system remain. Designing Web Navigation demonstrates that good navigation is not about technology-it’s about the ways people find information, and how you guide them.
Ideal for beginning to intermediate web designers, managers, other non-designers, and web development pros looking for another perspective, Designing Web Navigation offers basic design principles, development techniques and practical advice, with real-world examples and essential concepts seamlessly folded in. How does your web site serve your business objectives? How does it meet a user’s needs? You’ll learn that navigation design touches most other aspects of web site development. This book:

Provides the foundations of web navigation and offers a framework for navigation design
Paints a broad picture of web navigation and basic human information behavior
Demonstrates how navigation reflects brand and affects site credibility
Helps you understand the problem you’re trying to solve before you set out to design
Thoroughly reviews the mechanisms and different types of navigation
Explores “information scent” and “information shape”
Explains “persuasive” architecture and other design concepts
Covers special contexts, such as navigation design for web applications
Includes an entire chapter on tagging

While Designing Web Navigation focuses on creating navigation systems for large, information-rich sites serving a business purpose, the principles and techniques in the book also apply to small sites. Well researched and cited, this book serves as an excellent reference on the topic, as well as a superb teaching guide. Each chapter ends with suggested reading and a set of questions that offer exercises for experiencing the concepts in action.

Foundations of Web Navigation
1. Chapter 1 Introducing Web Navigation
  1. CONSIDERING NAVIGATION
  2. THE NEED FOR NAVIGATION
  3. WEB NAVIGATION DESIGN
  4. SUMMARY
  5. QUESTIONS
  6. FURTHER READING
2. Chapter 2 Understanding Navigation
  1. INFORMATION SEEKING
  2. SEEKING INFORMATION ONLINE
  3. WEB BROWSING BEHAVIOR
  4. INFORMATION SHAPE
  5. EXPERIENCING INFORMATION
  6. SUMMARY
  7. QUESTIONS
  8. FURTHER READING
3. Chapter 3 Mechanisms of Navigation
  1. STEP NAVIGATION
  2. PAGING NAVIGATION
  3. BREADCRUMB TRAIL
  4. TREE NAVIGATION
  5. SITE MAPS
  6. DIRECTORIES
  7. TAG CLOUDS
  8. A–Z INDEXES
  9. NAVIGATION BARS AND TABS
  10. VERTICAL MENU
  11. DYNAMIC MENUS
  12. DROP-DOWN MENUS
  13. VISUALIZING NAVIGATION
  14. BROWSER MECHANISMS
  15. SUMMARY
  16. QUESTIONS
  17. FURTHER READING
4. Chapter 4 Types of Navigation
  1. CATEGORIES OF NAVIGATION
  2. PAGE TYPES
  3. SUMMARY
  4. QUESTIONS
  5. FURTHER READING
5. Chapter 5 Labeling Navigation
  1. THE VOCABULARY PROBLEM
  2. ASPECTS OF GOOD LABELS
  3. LABELING SYSTEMS
  4. PERSUASIVE LABELS
  5. TRANSLATING LABELS
  6. SOURCES OF LABELS
  7. SUMMARY
  8. QUESTIONS
  9. FURTHER READING
A Framework for Navigation Design
1. Chapter 6 Evaluation
  1. QUALITIES OF SUCCESSFUL NAVIGATION
  2. EVALUATION METHODS
  3. SUMMARY
  4. QUESTIONS
  5. FURTHER READING
2. Chapter 7 Analysis
  1. BUSINESS GOALS
  2. UNDERSTANDING CONTENT
  3. UNDERSTANDING TECHNOLOGY
  4. USER INTELLIGENCE
  5. PERFORMING PRIMARY USER RESEARCH
  6. CONSOLIDATING RESEARCH FINDINGS
  7. SCENARIOS
  8. SUMMARY
  9. QUESTIONS
  10. FURTHER READING
3. Chapter 8 Architecture
  1. PERSUASIVE ARCHITECTURE
  2. NAVIGATION CONCEPT
  3. INFORMATION STRUCTURES
  4. ORGANIZATIONAL SCHEMES
  5. SITE MAPS
  6. SUMMARY
  7. QUESTIONS
  8. FURTHER READING
4. Chapter 9 Layout
  1. DETERMINING NAVIGATION PATHS
  2. VISUAL LOGIC
  3. PAGE TEMPLATES
  4. WIREFRAMES
  5. SUMMARY
  6. QUESTIONS
  7. FURTHER READING
5. Chapter 10 Presentation
  1. INFORMATION DESIGN
  2. INTERACTING WITH NAVIGATION
  3. GRAPHIC DESIGN
  4. SPECIFYING NAVIGATION
  5. SUMMARY
  6. QUESTIONS
  7. FURTHER READING
Navigation in Special Contexts
1. Chapter 11 Navigation and Search
  1. NAVIGATION PRIOR TO SEARCH
  2. NAVIGATION AFTER SEARCH
  3. FACETED BROWSE
  4. SUMMARY
  5. QUESTIONS
  6. FURTHER READING
2. Chapter 12 Navigation and Social Tagging Systems
  1. TAGGING
  2. NAVIGATING SOCIAL CLASSIFICATIONS
  3. SUMMARY
  4. QUESTIONS
  5. FURTHER READING
3. Chapter 13 Navigation and Rich Web Applications
  1. RICH WEB APPLICATIONS
  2. NAVIGATING RICH WEB APPLICATIONS
  3. DESIGNING RICH WEB APPLICATIONS
  4. SUMMARY
  5. QUESTIONS
  6. FURTHER READING

Nielsen, Jakob (2000) Designing Web Usability, New Riders Publishing

Users experience the usability of a web site before they have committed to using it and before making any purchase decisions. The web is the ultimate environment for empowerment, and he or she who clicks the mouse decides everything. Designing Web Usability is the definitive guide to usability from Jakob Nielsen, the world’s leading authority. Over 250,000 Internet professionals around the world have turned to this landmark book, in which Nielsen shares the full weight of his wisdom and experience. From content and page design to designing for ease of navigation and users with disabilities, he delivers complete direction on how to connect with any web user, in any situation. Nielsen has arrived at a series of principles that work in support of his findings: 1. That web users want to find what they’re after quickly; 2. If they don’t know what they’re after, they nevertheless want to browse quickly and access information they come across in a logical manner. This book is a must-have for anyone who thinks seriously about the web.

See https://www.nngroup.com/books/designing-web-usability/

1. Introduction: Why Web Usability?

Art Versus Engineering
- About the Examples
A Call for Action
What This Book Is Not
- Bad Usability Equals No Customers
Why Everybody Designs Websites Incorrectly

2. Page Design

Screen Real Estate
- Data Ink and Chart Junk
Cross-Platform Design
- Where Are Users Coming From?
- The Car as a Web Browser
- Color Depth Getting Deeper
- Get a Big Screen
- Resolution-Independent Design
- Using Non-Standard Content
- Installation Inertia
- Helpful Super-Users
- When Is It Safe to Upgrade?
- Collect Browsers
Separating Meaning and Presentation
- Platform Transition
- Data Lives Forever
Response Times
- Predictable Response Times
- Server Response Time
- The Best Sites Are Fast
- Speedy Downloads, Speedy Connections
- Users Like Fast Pages
- You Need Your Own T1 Line
- Understanding Page Size
- Faster URLs
- Glimpsing the First Screenful
- Taking Advantage of HTTP Keep-Alive
Linking
- Link Descriptions
- Link Titles
- Guidelines for Link Titles
- Use Link Titles Without Waiting
- Coloring Your Links
- The Physiology of Blue
- Link Expectations
- Peoplelinks
- Outbound Links
- Incoming Links
- Linking to Subscriptions and Registrations
- Advertising Links
Style Sheets
- Standardizing Design Through Style Sheets
- WYSIWYG
- Style Sheet Examples for Intranets
- Making Sure Style Sheets Work
Frames
- <NOFRAMES>
- Frames in Netscape 2.0
- Is It Ever OK to Use Frames?
- Borderless Frames
- Frames as Copyright Violation
Credibility
Printing
Conclusion

3. Content Design

Writing for the Web
- The Value of an Editor
- Keep Your Texts Short
- Copy Editing
- Web Attitude
- Scannability
- Why Users Scan
- Plain Language
- Page Chunking
- Limit Use of Within-Page Links
Page Titles
Writing Headlines
Legibility
Online Documentation
- Page Screenshots
Multimedia
- Waiting for Software to Evolve
- Auto-Installing Plug-Ins
Response Time
- Client-Side Multimedia
Images and Photographs
- Image Reduction
Animation
- Showing Continuity in Transitions
- Indicating Dimensionality in Transitions
- Illustrating Change Over Time
- Multiplexing the Display
- Enriching Graphical Representations
- Visualizing Three-Dimensional Structures
- Attracting Attention
- Animation Backfires
Video
- Streaming Video Versus Downloadable Video
Audio
Enabling Users with Disabilities to Use Multimedia Content
Three-Dimensional Graphics
- Bad Use of 3D
- When to Use 3D
Conclusion
- The Attention Economy

4. Site Design

The Home Page
How Wide Should the Page Be?
- Home Page Width
Splash Screens Must Die
The Home Page Versus Interior Pages
- Deep Linking
- Affiliates Programs
Metaphor
- Shopping Carts as Interface Standard
- Alternative Terminology
Navigation
- Navigation Support in Browsers
- Where Am I?
- Where Have I Been?
- Where Can I Go?
- Site Structure
- The Vice-Presidential Button
- Importance of User-Centered Structure
- Breadth Versus Depth
The User Controls Navigation
- Design Creationism Versus Design Darwinism
- Help Users Manage Large Amounts of Information
- Future Navigation
- Reducing Navigational Clutter
- Avoid 3D for Navigation
Subsites
Search Capabilities
- Don’t Search the Web
- Micro-Navigation
- Global Search
- Advanced Search
- The Search Results Page
- Page Descriptions and Keywords
- Use a Wide Search Box
- See What People Search For
- Search Destination Design
- Integrating Sites and Search Engines
URL Design
- Compound Domain Names
- Fully Specify URLs in HTML Code
- URL Guessing
- Beware of the Os and 0s
- Archival URLs
- Y2K URL
- Advertising a URL
- Supporting Old URLs
User-Contributed Content
Applet Navigation
- Double-Click
- Slow Operations
Conclusion

5. Intranet Design

Differentiating Intranet Design from Internet Design
Extranet Design
Improving the Bottom Line Through Employee Productivity
- Average Versus Marginal Costs
Intranet Portals:
The Corporate Information Infrastructure
- Get Rid of Email
- Intranet Maintenance
- The Big Three Infrastructure Components: Directory, Search, and News
Intranet Design Standards
- Guidelines for Standards
- Outsourcing Your Intranet Design
Managing Employees’ Web Access
- Hardware Standards
- Browser Defaults
- Search Engine Defaults
Intranet User Testing
- Field Studies
- Don’t Videotape in the Field
Conclusion

6. Accessibility for Users with Disabilities

Web Accessibility Initiative
- Disabilities Associated with Aging
- Assistive Technology
Visual Disabilities
- ALT Attributes
Auditory Disabilities
Speech Disabilities
Motor Disabilities
Cognitive Disabilities
- Search Without Spelling
Conclusion: Pragmatic Accessibility

7. International Use: Serving a Global Audience

Internationalization Versus Localization
Designing for Internationalization
International Inspection
- Should Domains End in .com?
Translated and Multilingual Sites
- Language Choice
- Make Translations Bookmarkable
- Multilingual Search
Regional Differences
International User Testing
- Overcoming the Language Gap
- How Many Countries Should You Test?
- Thanking Your Participants
Methods of Testing
- Travel Yourself
- Add a Few Days to Your Stay
- Remote User Testing
- Usability Labs for International Testing
Self-Administered Tests
Conclusion

8. Future Predictions: The Only Web Constant Is Change

The Internet Is Hard
Long-Term Trends
- The Anti-Mac User Interface
Information Appliances
- Drawing a Computer
- The Invisible Computer
- WebTV
- Designing for WebTV
Death of Web Browsers
Slowly Increasing Bandwidth
Metaphors for the Web
- Different Media, Different Strengths
- The Telephone
- Telephone Usability Problems
- Contact Tokens
- The Television
Restructuring Media Space: Good-Bye, Newspapers
- Media Distinctions Caused by Technology
Conclusion

9. Conclusion: Simplicity in Web Design