--- title: "Eye Tracking" url: "https://insideuxdesign.com/en/glossar/eye-tracking" language: "en" description: "What is eye tracking? Explained simply with the F-pattern, costs, limitations and an example. Find out when eye tracking is really worth it in UX." published: "2026-10-14T15:19:29+02:00" updated: "2026-10-14T15:19:29+02:00" --- # Eye Tracking Eye tracking measures where people look on a screen, for how long and in what order. It shows you what gets noticed and what gets missed. - **Buchstabe:** E - **Englischer Begriff:** Eye Tracking UX glossary · engl. Eye Tracking # Eye Tracking Eye tracking measures where people look on a screen, for how long and in what order. It shows you what gets noticed and what gets missed. Imagine a product page where the most important note, “Shipping within Germany only,” sits in a box to the right of the text. Yet requests from Austria keep coming in. Did people read the note and ignore it? Or did they never look at it? That’s exactly the kind of question eye tracking can answer. ## Explained simply Eye tracking measures where people look on a screen, for how long and in what order. A special device records eye movements while someone uses a website or app. Think of it this way: if you look over someone’s shoulder while they read a newspaper, you only see which page is open. Eye tracking is as if you could also see a laser pointer showing exactly which line they’re reading and which ones they skip. ## How eye tracking works Most devices use infrared light, which the eye can’t see. It creates reflections on the pupil and cornea. A camera captures these reflections, and software calculates the point of gaze from them. Before each session, the device is calibrated for each person by having them look at a few points on the screen. The analysis focuses mainly on fixations, short moments when the gaze rests on one spot, and saccades, the quick jumps in between. These produce gaze plots, which show the gaze path of one person, and heatmaps, which combine many people. Eye tracking became well known in UX through the studies of the Nielsen Norman Group. In 2006, based on recordings of 232 people, Jakob Nielsen described the so-called F-pattern: many people first read a line across the top, then a shorter line further down, and then scan down the left edge. Later analyses show that this pattern mostly appears with unstructured walls of text. Good subheadings and short paragraphs guide the eye better. Learn more in [How to Structure Content the Right Way](https://insideuxdesign.com/en/blog/how-to-structure-content-the-right-way). ## Costs and limitations Eye tracking takes effort. You need hardware, software, a quiet setup and experience in analysis. For meaningful heatmaps, the Nielsen Norman Group recommends around 30 people per heatmap, far more than for a classic [usability test](https://insideuxdesign.com/en/glossar/usability-testing). There are methodological limits, too. Eye tracking shows where someone looks, but not whether they understood something or why they missed it. Thinking aloud interferes with the measurement, because people linger on one spot while they talk. Glasses or fidgeting can make calibration harder. For most questions, a simple test with observation is perfectly enough. ## An example Here’s an example: for the product page above, the gaze data shows that hardly anyone looks at the box on the right. It looks like an ad and gets skipped. The team moves the shipping note directly below the price, formats it as regular text and starts it with the word “Shipping.” Requests from abroad go down. ## In practice - **Use it deliberately.** Eye tracking pays off mainly for specific questions about perception, such as whether a note gets seen or how people scan a homepage. - **Pair it with questions.** A short conversation after the task reveals why someone missed something or looked at it for a long time. - **Apply the known patterns.** Even without your own lab, you can learn from the findings: put important things at the top and left, and start headings and list items with meaningful words. ## Related terms [Heatmap](https://insideuxdesign.com/en/glossar/heatmap), [Usability Testing](https://insideuxdesign.com/en/glossar/usability-testing), [Cognitive Load](https://insideuxdesign.com/en/glossar/cognitive-load), [Information Architecture](https://insideuxdesign.com/en/glossar/information-architecture) ## Sources - [Jakob Nielsen: F-Shaped Pattern For Reading Web Content. Nielsen Norman Group, 2006](https://www.nngroup.com/articles/f-shaped-pattern-reading-web-content-discovered/) - [Kara Pernice: F-Shaped Pattern of Reading on the Web: Misunderstood, But Still Relevant (Even on Mobile). Nielsen Norman Group, 2017](https://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/) - [Tobii: How do eye trackers work? Tobii Learn Articles](https://www.tobiipro.com/resource-center/learn-articles/how-do-eye-trackers-work) - [Shari Thurow: Eyetracking and SEO: Fad, Fact, Or Fiction? Search Engine Land](https://searchengineland.com/eyetracking-seo-fad-fact-or-fiction-98799) ## More terms [ ### A/B Testing An A/B test is an experiment that shows two versions of a page or element at the same time to randomly split groups of visitors. It lets you decide with real data which version works better. ](https://insideuxdesign.com/en/glossar/a-b-testing) [ ### ARIA ARIA is a W3C standard that adds roles, states and properties to HTML. It tells screen readers what an element is and how it currently behaves. ](https://insideuxdesign.com/en/glossar/aria) [ ### Accessibility Accessibility means designing websites, apps and digital documents so that everyone can use them, including people with visual, hearing, motor or cognitive disabilities. ](https://insideuxdesign.com/en/glossar/accessibility) [ ### Affordance An affordance describes what action an object makes possible and whether people can recognize it: a button invites you to press it, a handle invites you to pull. ](https://insideuxdesign.com/en/glossar/affordance) [ ### Alt Text Alt text is a short text version of an image, stored in the HTML alt attribute. Screen readers read it aloud so people who can’t see the image get the same information. ](https://insideuxdesign.com/en/glossar/alt-text) [ ### Atomic Design Atomic Design is a method for building user interfaces from small, reusable building blocks, from single elements like buttons all the way up to complete pages. ](https://insideuxdesign.com/en/glossar/atomic-design) [ ### BFSG The BFSG, Germany’s Accessibility Strengthening Act, has required many companies since 28 June 2025 to make certain products and digital services, such as online shops, accessible. ](https://insideuxdesign.com/en/glossar/bfsg) [ ### Card Sorting Card sorting is a research method in which people sort terms written on cards into groups. It shows you how they mentally organize content, so you can plan navigation that makes sense to them. ](https://insideuxdesign.com/en/glossar/card-sorting) [ ### Cognitive Load Cognitive load is the mental effort it takes to understand and use an interface. The less unnecessary thinking a design demands, the easier the actual task becomes. ](https://insideuxdesign.com/en/glossar/cognitive-load) [ ### Color Vision Deficiency A color vision deficiency means someone has a harder time telling certain colors apart than most people. The most common type is red-green deficiency. ](https://insideuxdesign.com/en/glossar/color-vision-deficiency) [ ### Contextual Inquiry Contextual inquiry is a research method where you observe and interview people in their real work environment. It shows you how they actually get tasks done, not just how they describe it. ](https://insideuxdesign.com/en/glossar/contextual-inquiry) [ ### Contrast Ratio The contrast ratio describes how much two colors differ in brightness, such as text and background. WCAG requires at least 4.5:1 for normal text. ](https://insideuxdesign.com/en/glossar/contrast-ratio)