How knowing about the eye's Foveal viewport may change the way you look at your next campaign.
At Emma, we're always thinking about audiences and the important role design plays in communicating your message. We also do a lot of thinking about the concepts behind the why. Why is one campaign more effective than another? Why do some links get clicked more?
We often talk about reasons like headlines and timeliness, but here's another concept you might want to be consider: the Foveal viewport. The fovea is the part of the eye that makes it possible for us to have 100-percent visual acuity. So what the heck does that mean? Well, when we look at something, we see only a small area of it in complete focus. We may think we see the whole picture clearly, but we don't. Leonardo da Vinci was actually the first person to discover this issue with sight lines. Elements that fall outside this area get blurry – they get blurry quite fast, actually. As our eyes move, or to use a fancier term saccade, this area of complete focus moves as well. This area of complete focus is called the Foveal viewport.
For example, when we look at this web page, we may think we see the whole page in focus:
But here's our reality, with only the Foveal viewport in complete focus:
Another way to see the size of this is to hold your thumbs up next to each other — the area of your two thumbnails is roughly the same size as the Foveal viewport.
So how can you apply this to email design?
+ You can place your most important content where your audience is most likely to see it when they first open your campaign.
+ You can place pieces of related content in close proximity to each other.
+ Since the Foveal viewport moves as a person looks at something (and our eyes look for things that stand out), you can place any calls to action as close as you can to the related content.
Let's say you're creating a campaign with an announcement about your new deli lunch menu.
Not bad. Appealing photo along with hunger- and thirst-inducing copy. (Excuse me while I go grab a pop.) Ah. Now, let's take a look at the Foveal viewport.
Your first thought might be that the viewport will move, so no worries (that's what I thought too). But it's been shown that people often don't even see items that fall outside the viewport. So what if you shortened the copy a bit to get that button closer?
Much better. Besides the copy being easier to scan, the button you want people to click on now falls within the same Foveal viewport. Pretty cool.
It's also worth noting that too much focusing between saccades can cause fatigue. This refocusing happens hundreds of times every minute without us even knowing it, but the effort adds up, so you might want to avoid making your audience work so hard when they're reading. Because let's face it – do you really want your audience to feel tired after they read your emails?
Here's what you can do:
+ You can minimize the amount of content you're asking people to look at.
+ You can minimize the amount of content you're asking people to decide between.
+ You can be sure your email templates aren't too wide.
Knowing what Leonardo da Vinci knew about how eyeballs work just might change the way you look at your next campaign. With a few tweaks to your designs, you can help your audience see things the way you want them to see them.
Editor's note: This post launches a new series from Emma's UX team – they'll be sharing ideas, tips and expertise about email usability (and perhaps occasionally mentioning medieval geniuses).