The F-pattern and Z-pattern describe two typical routes people’s eyes follow when they scan a web page. On pages dense with text, attention tends to form an F: a full sweep across the top, a shorter sweep a little lower down, then a run down the left edge. On simpler pages with little text, the eye tends to zigzag in a Z from top left to top right, diagonally down, then across the bottom.
How the F-pattern and Z-pattern work
Neither pattern is something people do on purpose. Both come from eye-tracking research, most famously by the Nielsen Norman Group, which recorded where readers looked when they landed on a page and wanted to decide quickly whether it deserved their time. In left-to-right languages such as English, people start at the top left, and when they are scanning rather than reading, they lean heavily on the first few words of each line and each heading.
The F shape appears when a page is a wall of text with weak structure. Readers take in the first line or two, then only the opening words of paragraphs and subheadings further down. Anything on the right-hand side of a long paragraph, or buried mid-sentence, is easy to miss.
The Z shape shows up on pages with few elements: a logo top left, navigation or a button top right, a central image or headline, and a call to action along the bottom. The eye moves between those anchor points in a zigzag. Many homepage heroes and simple landing pages are built around it, with the logo where the Z starts and the main button where it ends.
Later research added nuance. People also follow a “layer-cake” pattern when headings are strong, hopping from heading to heading, and a “spotted” pattern when hunting for one item such as a phone number or a price. The F-pattern is really a sign that the page gave them nothing better to follow.
Why it matters
A UK visitor comparing you with three competitors open in other tabs is scanning, not reading. If your most persuasive point sits at the end of a long paragraph, or your price and phone number are tucked into the right-hand margin, a large share of visitors will never see them. That shows up as enquiries you never receive rather than as an error anyone notices.
Knowing these patterns helps you place what matters where attention already goes and, more usefully, build a clear visual hierarchy so people are not pushed into an F in the first place. On a service page, that means descriptive subheadings, short paragraphs that open with their point, and lists where the content genuinely is a list.
Common mistakes
- Treating the patterns as a layout template. Placing elements on an imaginary Z does not make a page persuasive. The patterns describe how people cope with pages, good and bad.
- Opening headings and paragraphs with filler. If the first words of every heading are “Our” or “Why choose”, scanners learn nothing from the left edge.
- Putting key information in a sidebar. Right-hand columns often hold offers, prices or contact details that scanners skip entirely.
- Assuming desktop behaviour on mobile. On a phone, content stacks into one column and people scroll vertically, so the order of blocks matters more than their horizontal position.
- Never checking. Teams argue about patterns without looking at how real visitors use the page.
How to act on it
Start with the pages that earn money: the homepage, main service pages and anything receiving paid traffic. Read only the headings and the first three or four words of each paragraph. If that skim tells someone what you offer, who it is for and what to do next, the structure is working. If not, rewrite headings so they carry information and move each paragraph’s main point into its first sentence, which also improves readability generally.
On sparse pages such as a hero or a short landing page, put the brand at the top left, a plain headline and supporting line where the eye travels next, and a single call to action where the zigzag finishes. Keep competing elements to a minimum so the eye has somewhere obvious to land.
Then check against real behaviour. A heatmap shows where clicks and scrolling actually concentrate, and a handful of session recordings will tell you whether people find the price, phone number or form. If a rebuild is planned anyway, this is the kind of thing I design into the page structure during a website redesign rather than patching afterwards.