HI ЩЦ

I ̂ ШуШ№|

Eyetracking Web Usability

New Riders, An Imprint of Peachpit, Berkeley, California USA

Contents

Preface

Eyetracking, Not All Usability

Supplementary Reports

What This Book Doesn't Cover

1 Eyetracking and the Eye

How Modern Eyetracking Works

Foveal Vision vs. Peripheral Vision

Fixations and Saccades

Why Do Users Not See Something?

The Mind-Eye Hypothesis

Are Looks Good or Bad?

Visualizing Eyetracking Results

Viewing the Heat Maps and Gaze Plots in

Tasks Determine Looks

Other Uses of Eyetracking Eyetrackers as Input Devices

2 Our Eyetracking Research

Data Collected

Study Participants

Quali tat ive and Quant i tat ive Sessions

Test Sessions Session Logistics

Web Sites and Test Tasks

Measures

Why Many Eyetracking Studies Are Bogus

Representative Users

Realistic Task Performance

Wide Variety of the Web Sites and Tasks

Weigh the Evidence

Cost of Eyetracking Research

Overall Study Costs

Recruiting Costs

Lost Eyetracking and Recorded Data Costs

Eyetracking-Related Costs

Equipment

Eyetracking Web Usability

Page Layout 47

How Do People Look at a Page? 50

Users Looking for News 50

Users Looking to Buy 53

Users Buying a Specific Item 58

Users Doing a Very Specific Task 61

Web Design Standards That Users Look For 64

Organization of Pages 66

Light Pages Encourage Looking 66

Content Placement and Visual Indicators 70

Use Priority Spots 72

Allocate Screen Real Estate Wisely 98

The Most Important Elements Should Stand Out 103

The Price of Miscues 105

Using Eyetracking to Improve Page Layout 108

Navigation 113

Menus and Informat ion Architecture 114

Global Navigation 114

Consistent, Persistent, and Simple Navigation 116

Subpar Subnavigation 118

Vanishing Navigation 121

How Informat ion Architecture Can Al ienate Users 131

Branding and Market ing in Menus Confuses People 135

Util ity Navigation 140

Navigational Elements 142

Links and Headings 142

Buttons 145

Breadcrumbs 156

Search Front-End 156

Fundamental Web Design Elements 159

On the Homepage 160

Login 162

Privacy Policy 163

Contact 163

Language Selectors 164

Logos and Tag Lines 164

Shopping Carts 165

When to Feature Exposed Shopping Carts 172

Contents XI

Forms, Fields, and Applications 176

Grouping Sections and Placing Field Labels 176

Don't Break Up Phone Number Fields 188

Short Forms Make for Easy Scanning 189

Avoid Prompt Text in Fields (At Least for Now) 191

Guidelines for Reducing Fixations in Forms 192

Images 195

What Does and Doesn't Draw

At ten t ion to an Image 196

Images as Obstacles 197

Omit Filler Images 203

Attr ibutes That Draw At ten t ion 204

Contrast, Quality, and Detail 204

Mot ivat ion and Expectations Can Help Even

Bad Images Get Looks 206

Original i ty 213

Relationship to Content 218

Magnetic Elements 226

Informat ional Images 270

Images That Resemble Advertisements 283

Cartoons and Illustrations 285

Images in E-commerce 289

Moving Images 302

Advertisements 325

It's a Jungle Out There 326

When People Look at Ads 327

Doing Tasks vs. Browsing 327

How Different Types of Ads Fare w i th Users 332

The Impact of Ad Placement 334 Ad Relativity and Compet i t ion in User Interfaces 335

Banner Blindness 339

Text (Sponsored Link) Ads 342

Why People Look at Sponsored Links on SERPs 342

Sponsored Links on Other Pages 343

Sponsored Links and Hot Potato Behavior 345

Do Graphics Belong in Web Advertising? 347

Internal Promotions:

Match the Site's Style 348

Assess Your Promotion for Lookabil i ty 354

Eyetracking Web Usability

External Ads: What Works 356

Large, Readable Graphical Text Alone or

Separate f rom Images 356

Magnetic or Thri l l ing Graphical Properties 359

Animated Ads 364

8 User Viewing Behaviors on the Web 373

Exhaustive Review vs. Necessary or Desired Review 374

Exhaustive Review Can Be Downr ight Exhausting 380

Bad Record for Some Baseball Sites 383

What Happens When Informat ion Is Too Complicated 392

Momentum Behavior 396

Logging 402

Selective Disregard 402

Post-click Behavior 405

Post-click Verif ication 405

Post-click Looks 409

Perpetual Viewing 412

Impatient Looking 412

Residual Looks 415

Eyetracking Reveals Another Level of User Behaviors 416

Appendix 420

How Much People Look at Basic Web Interface Elements 420

Glossary 422

Index 424

Contents XII