Heading
Sunday, April 12, 2020
Users Still Read Content the Same after 14 Years
Some say old is gold. And so are Versace bracelets. Point is - user behavior in reading content on their devices from 2006 remains the same today. In other words, what we consider "old" is inevitably our past, present, and future. Like Tom Riddle is to Lord Voldemort. So the way that you - designer, CEO, CMO, CTO, CCO, *yawn* COO, CBO, Marketing Director lady, Marketing Coordinator man thing - decide to lay out the content on a screen will directly impact its engagement metric. And so we’re back for another episode of savagery and purely informational, yet comical, satirical, and eloquently lyrical article on what we believe is good design. All of which is probably completely off, or - completely a home run. So with a goblet of coffee, a thick blanket, Mickey Mouse pjs, and something that once looked like a chair before the Great Quarantine of 2020, but some may mistake it for a bed, we're going to cover the most common types of eye tracking patterns that have been observed across the web (teehee no pun intended 🙃) which have miraculously stayed somewhat consistent for almost 14 years now.
It's So Enticin'
You may recall that back in 2011, Rihanna dedicated a song towards this first pattern. The Layer-Cake Pattern helps users scan content and bring to their attention important features or details that are relevant to what the user is looking for. Content that implement the Layer-Cake Pattern tend to make use of strong headings and subheadings to provide a quick idea of what the remaining body is about. Check out the below to see exactly what this pattern looks like:
F-Shape Pattern
Ah now here's a familiar face. Heard of the F-Shaped Pattern? Sure hope so - it's actual quite simple to understand if you're not the brightest! Simply put - this pattern reflects a common behavior that a user exhibits: the eye scans the screen from left to right then starts at the next line and once again moves from left to right. This repeats until the end of the content is reached.
Now we usually don't pick favorites (just kidding we always do and so do you and you know it) but if we were to compare the F-Shape Pattern to the Layer-Cake Pattern, the latter is quite a distinct winner. By laying out clear headings and subheadings, it reduces the chance of users missing out on information that they were looking for. It also saves time for the user since they will not be scanning through body content of items that have an irrelevant heading or subheading.
Spotted
For the longest time, I pronounced "polka dots" like "poke-a-dots" and I thought it was spelled like it too. Relevant? Meh - perhaps more of just a fun fact. But this next one's called something that is relevant - the Spotted Pattern. The user's eyes navigates across a screen based on items that appear different in styling. For example, items that are italicized, bold, underline, a different color, quotations, numbers, capital letters, bullet points, etc. Anything that alters the standard or normal flow of words on a screen really.
Textbook
And last but not least, the Textbook Pattern for eye tracking or the Commitment Pattern. In other words, the user's eyes does not skim or scan across the screen. The user actually reads through the content. This is commonly done on Blog websites or content put out by the users's favorite brands. Anything that the user really wants to absorb and understand. Almost as if they were studying for a Biology exam the next day.
The Takeaway
There is nothing to actually takeaway from this article this time. No specific side that we're arguing for. There is no wrong way to go about how you should lay out content on your various kinds of medium, digital of print. There is, however, effective ways to communicate a message rather than just having it be sprawled across the user's screen. Manipulate your user's eyes to how you'd want your content to be viewed. The Layer-Cake Pattern is definitely going to be more effective in communicating quickly to your users certain features about a product you may be selling, for example, versus having too much details about your product in a large passage-like format which may force the Commitment Pattern behavior. Not only may this result in bounce rates to increase, but it'll be overwhelming. Fully think through your information architecture and you'll end up having a smarter layout. Think otherwise, and you might as well outsource your entire project to a remote island near Zimbabwe.
Remember, at the end of the day, bad design will always cost more than good design! 😉
Ready to create something awesome or transform your platform? Unlike anyone else in our industry, we can turn it around in less than 10 days, no matter the size of the project, and still cost 70% less than the national average creative agency price. Oh and all of our prices are up front, final, and transparent. So there's no random agency fees that we can sneakily add on overnight unfortunately. Strictly located in the USA. Beat that and we’ll get on the next shuttle SpaceX off of this planet.