by Roman Makuev
23.02.2024

Designing Websites Around Human Central Vision

Designing Websites Around Human Central Vision I want to share some peculiar regularity and, in my view, a new approach to web design.

Hey, my name is Roman Makuev, I am a UX/UI designer and CEO in Neon Team, and in this article I want to share how a simple fact about human vision shapes the way my team and I build websites.

A while ago I started reading about how central and peripheral vision shape the way people take in information. What I found is straightforward, but it’s easy to overlook — and it has a real effect on how a page should be laid out. I want to be clear about one thing up front: the scientific research describes how human vision works. The way I apply it to web design is my own interpretation, drawn from experience. The facts are borrowed; the conclusions are mine.

Web design is a constantly evolving field, full of competing models and conventions. But it’s worth occasionally going back to first principles — to how people physically see — and checking our layout decisions against them.

Conventionally, there are two widely accepted models for how users’ eyes scan a web page: the Z-pattern and the F-pattern. Both are well known and broadly used.

 

 

Now, let’s go back to central vision

Our eyes don’t see a scene evenly. They lock onto a central point, and everything around it falls away into blur. The further something sits from that point of focus, the less detail we get. We only truly see — in full sharpness and color — whatever our eye is fixed on.

Central vision is what we use for reading, recognizing faces, scanning images, and driving. But it covers a surprisingly small slice of our field of view — only about two degrees. Everything outside that is peripheral: good at catching motion and rough shapes, but poor at detail.

Try this yourself

This works best on a monitor or any screen with high resolution.

Focus on the plus sign (+) in the very center of the line. Looking only at it, you’ll be able to make out the letters “F” and “G” right beside it — maybe “E” and “H” too. The rest will look blurred, or you won’t see them at all.

Here’s a second image with larger type. Even now, the outer letters stay just as hard to read.

And only in the last image — where the outer letters are literally twice the size of the central ones — can you finally read them, even while your eye stays fixed on the star.

 

The takeaway is simple: if information sits far enough from the center, it effectively doesn’t exist for the brain. In a world drowning in content, it’s wishful thinking to expect a visitor to carefully study every part of a page.

It’s worth noting that these images are deliberately high-contrast — black background, white letters — so every letter is as legible as it can possibly be. On a real screen, with real layouts and lower contrast, the effect is even stronger: large amounts of information simply fall outside the area where vision is sharp.

Why the Z and F patterns feel too simplified

The Z- and F-patterns are useful, but in my view they overlook several factors that matter just as much today:

  • On large screens, people tend to move through information vertically rather than horizontally.
  • The rise of “clip thinking,” driven by platforms like TikTok and YouTube, has changed how people process information. Attention spans have shortened. Long blocks of text perform worse, and there’s a real need for shorter, sharper wording. Modern users expect content that is dynamic, visual, and concise.
  • How a person explores a new site depends heavily on their past experience with similar sites. Tools like Webflow and Figma have made it far easier to experiment with design and create new trends and styles, so users now encounter an unprecedented variety of layouts and visual languages.
  • The Z- and F-patterns describe how the eye moves, but not what actually drives a decision — to buy, to call, to fill in a form. In practice, factors like headlines, copy, and video influence that decision far more than page structure alone.
  • Cultural differences also play a role. In Western cultures, people read left to right and top to bottom — and layout assumptions built on that aren’t universal.

How I apply this

A single eye fixation lasts roughly 200–400 milliseconds — just enough time for the brain to process what it’s looking at. Since detail only registers where the eye is focused, the practical conclusion is straightforward: the elements that carry the most weight belong on the path of the user’s gaze, not pushed out to the margins where vision is poor.

This isn’t a replacement for the Z- and F-patterns — it’s a different question. Those patterns describe how the eye moves across a layout. This is about where vision is actually sharp at any given moment. Used together, the rule I follow is simple: the elements that answer a visitor’s questions, address their doubts, and move them toward a decision should stay in focus rather than drifting into the blur. In my experience, that makes a page easier to read, easier to trust, and more effective at doing its job.

Design features

This approach shapes a few consistent choices in how we build sites:

  1. We design in a minimalist style, with plenty of breathing room, which makes content easier to take in.
  2. We pay close attention to visual aesthetics. Cleanliness and visual consistency are what create a sense of comfort and trust in visitors.

Research on visual design supports this: studies on web aesthetics consistently find that attractive, well-crafted sites tend to convert better and retain more visitors, while ordinary-looking design quietly loses a meaningful share of potential clients.

 

 

Bringing two ideas together

This way, two principles come together: what we know about central vision, and what we know about design aesthetics.

For the elements that most influence conversion — the ones placed in the center of the page, along the natural path of the user’s gaze — we focus on the following:

  • A video about the company and its approach to work, which is a powerful marketing tool. (“Clip thinking” is worth remembering here too.)
  • Eye-catching headlines paired with short, meaningful copy that connects with readers emotionally.
  • The concrete advantages of working with the company.
  • The company’s achievements, which build trust.
  • Banners with compelling offers. When building a site, we take into account evidence that users still notice banners placed centrally, while banners pushed to the margins — left or right — are often ignored due to “banner blindness.”
  • A clear call to action.

Conclusion: why this approach is worth considering

The web is overloaded with content, advertising, and distractions. Cutting through that noise and holding a target audience’s attention is genuinely hard. Competition keeps growing, and companies pour large budgets into marketing — hundreds of them competing for the attention of that same first potential client.

That’s exactly why placement matters. If you only have a few hundred milliseconds of someone’s focused attention, the worst thing you can do is spend it on decoration while your real message sits in the blur. The principle is old and simple: put what matters most where people are actually looking. It’s easy to state and easy to forget — and in my experience, applying it consistently is what turns a page from something users glance at into something they actually read, and act on.

CLOSE

    NAME
    EMAIL
    MESSAGE
    CLOSE
    THANK YOU FOR MAKING US A PART OF YOUR DIGITAL VISION!
    WE'RE GRATEFUL FOR THE OPPORTUNITY TO BRING YOUR IDEAS TO LIFE.
    CLOSE