{"id":32228,"date":"2017-09-06T07:01:13","date_gmt":"2017-09-06T12:01:13","guid":{"rendered":"https:\/\/crazyeggblog.wpengine.com\/?p=32228"},"modified":"2026-01-14T08:32:06","modified_gmt":"2026-01-14T16:32:06","slug":"visual-perception-and-website-design","status":"publish","type":"post","link":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/","title":{"rendered":"What You Need to Know About Visual Perception and Website Design"},"content":{"rendered":"

There\u2019s no lack of data to suggest how visual-oriented we are as humans.<\/p>\n

For instance, \u201c90 percent of information<\/a> transmitted to the brain is visual, and visuals are processed 60,000x faster in the brain than text.\u201d<\/p>\n

\"90<\/p>\n

Or this: \u00a0\u201c65 percent of people are visual learners, and one of the best ways to drive messages home is through visual content.\u201d<\/p>\n

This data helps explain why visual marketing has really exploded recently, and visual-centric content such as infographics are so popular.<\/p>\n

Seeing is one of our primary senses by which we intake information and understand the world.<\/p>\n

Basically, it\u2019s a big deal.<\/p>\n

So it only makes sense that effective website design is done with visual perception in mind.<\/p>\n

Not only does it influence your bounce rate<\/strong>, average session duration, and conversion rates, but it heavily impacts your brand equity as well.<\/p>\n

In fact, \u201c46.1 percent of people<\/a> say a website\u2019s design is the number one criterion for discerning the credibility of a company.\u201d<\/p>\n

Getting it right from a visual standpoint is essential, so plenty of effort needs to go into understanding visual perception and the underlying psychology behind \u201cmaking a site look good.\u201d<\/p>\n

Here are some ways that visual perception applies to web design and some specific principles you can apply for an optimal UX.<\/p>\n

Keep in mind, these are big picture ideas<\/strong>, not nifty little tactics. Rather than provide prescriptive how-tos regarding visual perception, I\u2019ve sketched data-driven, high-level principles that can be applied in virtually any industry, business vertical, or niche.<\/p>\n

Strong Visual Hierarchies Provide Clear Guidance<\/h2>\n

The moment someone lands on your website, your goal is to guide them on a journey that ultimately culminates in a conversion.<\/p>\n

To accomplish this from a design perspective, it\u2019s essential to create a visual hierarchy.<\/p>\n

52 Weeks of UX<\/a> offers an excellent description of this process:<\/p>\n

\"Visual<\/p>\n

They also provide a nice example of a site with strong visual hierarchies versus one with weak visual hierarchies.<\/p>\n

\"Strong<\/p>\n

The aim of a web designer is to rank the various elements of a site in terms of importance as it relates to meeting your business objective.<\/p>\n

For instance, the focal point of a homepage might be a large image to instantly capture a visitor\u2019s attention. This might be followed by a headline stating what\u2019s being offered and then a well placed CTA for visitors to click on.<\/p>\n

Here\u2019s a really good example from the TOMS homepage that follows this formula.<\/p>\n

\"TOMS<\/p>\n

The key here is to rank the elements of your site according to their importance and arrange them in a way that walks your visitors through in a frictionless way.<\/p>\n

Eyes Tend to Follow an F-Shaped Pattern<\/h2>\n

I\u2019m not going to waste your time going into all of the gory details of this phenomenon. It\u2019s already been covered extensively.<\/p>\n

But it\u2019s necessary to point out that multiple eye tracking studies using heatmaps found a common trend in the way that people view website content.<\/p>\n

By and large, eye movement follows a distinct F-shaped pattern.<\/p>\n

One of the more notable studies done on this subject came from Nielsen Norman Group<\/a> back in 2006.<\/p>\n

Here\u2019s the crux of what they found:<\/p>\n

And here\u2019s what that looks like visually:<\/p>\n

\"Heat<\/p>\n

The first page on the left is the \u201cabout us\u201d section of a website. The middle page is a product page of an Ecommerce site. The third page on the right is a SERP.<\/p>\n

As you can see, there\u2019s a discernible pattern that arises between all three types of page.<\/p>\n

While the F-shaped pattern is most prominent on the product page of an Ecommerce site or SERP, it\u2019s clear that other types of content are digested in a similar manner.<\/p>\n

Optimal desktop user experience<\/a> can often be achieved by structuring your page layout following this principle in order to direct a visitor\u2019s attention.<\/p>\n

White Space Plays a Bigger Role Than You May Think<\/h2>\n

White space or \u201cnegative space\u201d is the area between objects. It\u2019s the empty space that separates graphics, text, headers, columns, etc.<\/p>\n

While it may seem insignificant, white space actually plays an integral role and greatly impacts the overall aesthetics of a site. If you really think about it, it\u2019s the white space that enables objects to exist in the first place.<\/p>\n

A cardinal sin that\u2019s committed quite frequently is overloading a website with excessive objects to the point that it looks clunky and saturated. You can think of it as digital maximalism.<\/p>\n

While loading a site up with more \u201cstuff\u201d may seem like an effective way to grab the user\u2019s attention, this is generally regarded as an ineffective practice. That\u2019s because this tends to be distracting and can overwhelm the visitor to the point of cognitive overload occurring.<\/p>\n

In a world that\u2019s saturated with data and information in excess, what most users crave is simplicity.<\/p>\n

There\u2019s a great post from ConversionXL<\/a> that discusses why \u201csimple\u201d websites are scientifically better.<\/p>\n

In the article, the author references a 2012 study from Google<\/a> that says, \u201cVisually complex websites are consistently rated as less beautiful than their simpler counterparts.\u201d<\/p>\n

So there\u2019s some real truth this argument. Less is more.<\/p>\n

Here are a couple of examples of websites that pull this off seamlessly:<\/p>\n

\"Farmstead\"<\/p>\n

\"Brault&Barnes\"<\/p>\n

Simply put, leaving plenty of white space in web design gives a site a clean feel and makes it easier for users to focus on your core message. They can absorb your copy more efficiently are more likely to notice focal points such as your CTA.<\/p>\n

Eyes are Naturally Drawn Toward Contrast<\/h2>\n

This ties in with our previous point and suggests that one of the most effective ways to get eyeballs to your intended focal point is to create contrast.<\/p>\n

It\u2019s one of the principles<\/a> of Gestalt Theory, which \u201cattempts to describe how people tend to organize visual elements into groups or unified wholes when certain principles are applied.\u201d<\/p>\n

\"Gestalt<\/p>\n

The other principles include proximity, similarity, multi-stability, continuity, and closure.<\/p>\n

\"Gestalts<\/p>\n

This aspect of visual perception is actually a big contributor to our collective survival as a species. Our ancestors\u2019 ability to identify contrast in their environment (e.g., a predatory animal in the woods) is what alerted them to danger and helped them stay alive.<\/p>\n

Spotting contrast is what we do as humans. So when it comes to getting visitors to take notice of key elements on your website, it\u2019s obviously beneficial to create contrast.<\/p>\n

Wonder Bread\u2019s website pulls this off really well and incorporates plenty of contrast.<\/p>\n

\"Wonder<\/p>\n

Your eyes can\u2019t help but gravitate to the bread.<\/p>\n

Similarity Aids in Content Digestion<\/h2>\n

Similarity is another principle of Gestalt Theory, which states that<\/a>, \u201cElements that share similar characteristics are perceived as more related than elements that don\u2019t share those characteristics.\u201d<\/p>\n

Simply put, arranging various elements into groups allows users to quickly differentiate them from the rest of your site. This is beneficial because it allows for a more seamless UX and requires less mental energy to be expended.<\/p>\n

Here\u2019s a simple example from the Harvard Business Review homepage where they place the HBR newsletters into a single group:<\/p>\n

\"Harvard<\/p>\n

The bottom line here is that using similarity is a highly effective way to break down the various sections of your site so that everything is easily digestible.<\/p>\n

Proximity Also Helps<\/h2>\n

There\u2019s one last principle of Gestalt Theory that I would like to point out, and that\u2019s proximity.<\/p>\n

It\u2019s pretty simple. \u201cObjects that are closer together<\/a> are perceived as more related than objects that are further apart.\u201d<\/p>\n

Just take a look at these groups of dots.<\/p>\n

\"Pink<\/p>\n

We\u2019re naturally inclined to consider the dots on the left as a singular object. However, we perceive the dots on the right as two separate objects.<\/p>\n

The law of proximity enables us to better understand website content and break various elements down into different categories.<\/p>\n

Here\u2019s an example:<\/p>\n

\"W3avenue\"<\/p>\n

You can use this aspect of visual perception to break content down to create categories and even sub-categories. In turn, this should add to the flow of your site and help users navigate it with greater ease.<\/p>\n

The Golden Ratio Can Optimize Overall Aesthetics<\/h2>\n

The concept of the golden ratio goes back well over 2,000 years and has been studied by everyone from Plato and Euclid to modern day mathematicians such as Roger Penrose.<\/p>\n

To put it very simply, the golden ratio is 1.618.<\/p>\n

\"The<\/p>\n

Here\u2019s what that looks like visually:<\/p>\n

\"Golden<\/p>\n

Also known as divine proportions, it\u2019s a ratio where elements are proportioned in a way that they\u2019re aesthetically pleasing to human eyes.<\/p>\n

You see it in everything from ancient architecture…<\/p>\n

\"Greek<\/p>\n

To the human body…<\/p>\n

\"1618\"<\/p>\n

And even on the macro level in the universe itself.<\/p>\n

\"Golden<\/p>\n

It\u2019s pretty amazing.<\/p>\n

It\u2019s a phenomenon seen all throughout the natural world. And interestingly enough, it can also be applied to web design.<\/p>\n

Here\u2019s a good example:<\/p>\n

\"Chris<\/p>\n

Notice how the layout and arrangement of elements fit in perfectly with the golden ratio. This is a scientifically proven way to maximize the eye appeal of your site.<\/p>\n

To learn how to apply divine proportions to your site, check out this guide from Tuts+<\/a>.<\/p>\n

Conclusion<\/h2>\n

Visual perception as it relates to website design is incredibly complex and multifaceted. What\u2019s amazing is that the principles I covered here are only a slice of what goes into the process.<\/p>\n

However, I feel that these principles are some of the most integral to effective web design.<\/p>\n

Understanding how people visually perceive content and the underlying psychological processes that take place put you in a position to optimize your site and create the best possible UX.<\/p>\n

This has its obvious benefits and allows you to maximize conversions and ultimately increase sales.<\/p>\n

What do you consider to be the most important visual element in a website?<\/i><\/p>\n

Featured image based off artwork<\/a> by Cmglee<\/a>.<\/i><\/p>\n","protected":false},"excerpt":{"rendered":"

There\u2019s no lack of data to suggest how visual-oriented we are as humans. For instance, \u201c90 percent of information transmitted to the brain is visual,…<\/p>\n","protected":false},"author":185,"featured_media":32266,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","_lmt_disableupdate":"","_lmt_disable":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[9],"tags":[],"class_list":["post-32228","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-design"],"yoast_head":"\nWhat You Need to Know About Visual Perception and Website Design<\/title>\n<meta name=\"description\" content=\"In this article I\u2019ve sketched data-driven, high-level principles that can be applied in virtually any industry, business vertical, or niche.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"What You Need to Know About Visual Perception and Website Design\" \/>\n<meta property=\"og:description\" content=\"In this article I\u2019ve sketched data-driven, high-level principles that can be applied in virtually any industry, business vertical, or niche.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/\" \/>\n<meta property=\"og:site_name\" content=\"The Daily Egg\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/crazyegganalytics\/\" \/>\n<meta property=\"article:published_time\" content=\"2017-09-06T12:01:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-14T16:32:06+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/09\/06075543\/visual-perception.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Daniel Threlfall\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/danielthrelfall\" \/>\n<meta name=\"twitter:site\" content=\"@CrazyEgg\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Daniel Threlfall\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"8 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/\"},\"author\":{\"name\":\"Daniel Threlfall\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/person\\\/8d7b61c07999b4b3a428204a5d34f8ba\"},\"headline\":\"What You Need to Know About Visual Perception and Website Design\",\"datePublished\":\"2017-09-06T12:01:13+00:00\",\"dateModified\":\"2026-01-14T16:32:06+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/\"},\"wordCount\":1655,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2017\\\/09\\\/06075543\\\/visual-perception.png\",\"articleSection\":[\"Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/\",\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/\",\"name\":\"What You Need to Know About Visual Perception and Website Design\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2017\\\/09\\\/06075543\\\/visual-perception.png\",\"datePublished\":\"2017-09-06T12:01:13+00:00\",\"dateModified\":\"2026-01-14T16:32:06+00:00\",\"description\":\"In this article I\u2019ve sketched data-driven, high-level principles that can be applied in virtually any industry, business vertical, or niche.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#primaryimage\",\"url\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2017\\\/09\\\/06075543\\\/visual-perception.png\",\"contentUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2017\\\/09\\\/06075543\\\/visual-perception.png\",\"width\":1200,\"height\":630,\"caption\":\"visual perception\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/visual-perception-and-website-design\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Design\",\"item\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/category\\\/web-design\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"What You Need to Know About Visual Perception and Website Design\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/\",\"name\":\"The Daily Egg\",\"description\":\"Conversion Rate Optimization Made Easy\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#organization\",\"name\":\"Crazy Egg\",\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/Crazy-Egg-logo-small.png\",\"contentUrl\":\"https:\\\/\\\/ceblog.s3.amazonaws.com\\\/wp-content\\\/uploads\\\/2015\\\/06\\\/Crazy-Egg-logo-small.png\",\"width\":191,\"height\":100,\"caption\":\"Crazy Egg\"},\"image\":{\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/crazyegganalytics\\\/\",\"https:\\\/\\\/x.com\\\/CrazyEgg\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/crazy-egg\\\/\",\"https:\\\/\\\/www.youtube.com\\\/channel\\\/UCJNe_xmPi07YezxaqfoRVqg\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/#\\\/schema\\\/person\\\/8d7b61c07999b4b3a428204a5d34f8ba\",\"name\":\"Daniel Threlfall\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/01ba9017f5f969a00b74d66fda97dd92552bdc863fa2a54d32e524f5f107b089?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/01ba9017f5f969a00b74d66fda97dd92552bdc863fa2a54d32e524f5f107b089?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/01ba9017f5f969a00b74d66fda97dd92552bdc863fa2a54d32e524f5f107b089?s=96&d=mm&r=g\",\"caption\":\"Daniel Threlfall\"},\"description\":\"Daniel Threlfall is a content marketing strategist who has helped to engineer the growth of blogs such as NeilPatel.com, increase the international expansion of Fiji Water, and improve the brand reach of Shopify. Daniel is the co-founder of Launch Your Copy, a resource to help copywriters triple their writing speed and blow up their income.\",\"sameAs\":[\"https:\\\/\\\/x.com\\\/https:\\\/\\\/twitter.com\\\/danielthrelfall\"],\"url\":\"https:\\\/\\\/www.crazyegg.com\\\/blog\\\/author\\\/dantheman\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"What You Need to Know About Visual Perception and Website Design","description":"In this article I\u2019ve sketched data-driven, high-level principles that can be applied in virtually any industry, business vertical, or niche.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/","og_locale":"en_US","og_type":"article","og_title":"What You Need to Know About Visual Perception and Website Design","og_description":"In this article I\u2019ve sketched data-driven, high-level principles that can be applied in virtually any industry, business vertical, or niche.","og_url":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/","og_site_name":"The Daily Egg","article_publisher":"https:\/\/www.facebook.com\/crazyegganalytics\/","article_published_time":"2017-09-06T12:01:13+00:00","article_modified_time":"2026-01-14T16:32:06+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/09\/06075543\/visual-perception.png","type":"image\/png"}],"author":"Daniel Threlfall","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/danielthrelfall","twitter_site":"@CrazyEgg","twitter_misc":{"Written by":"Daniel Threlfall","Est. reading time":"8 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#article","isPartOf":{"@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/"},"author":{"name":"Daniel Threlfall","@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/person\/8d7b61c07999b4b3a428204a5d34f8ba"},"headline":"What You Need to Know About Visual Perception and Website Design","datePublished":"2017-09-06T12:01:13+00:00","dateModified":"2026-01-14T16:32:06+00:00","mainEntityOfPage":{"@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/"},"wordCount":1655,"commentCount":0,"publisher":{"@id":"https:\/\/www.crazyegg.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#primaryimage"},"thumbnailUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/09\/06075543\/visual-perception.png","articleSection":["Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/","url":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/","name":"What You Need to Know About Visual Perception and Website Design","isPartOf":{"@id":"https:\/\/www.crazyegg.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#primaryimage"},"image":{"@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#primaryimage"},"thumbnailUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/09\/06075543\/visual-perception.png","datePublished":"2017-09-06T12:01:13+00:00","dateModified":"2026-01-14T16:32:06+00:00","description":"In this article I\u2019ve sketched data-driven, high-level principles that can be applied in virtually any industry, business vertical, or niche.","breadcrumb":{"@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#primaryimage","url":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/09\/06075543\/visual-perception.png","contentUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2017\/09\/06075543\/visual-perception.png","width":1200,"height":630,"caption":"visual perception"},{"@type":"BreadcrumbList","@id":"https:\/\/www.crazyegg.com\/blog\/visual-perception-and-website-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/www.crazyegg.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Design","item":"https:\/\/www.crazyegg.com\/blog\/category\/web-design\/"},{"@type":"ListItem","position":3,"name":"What You Need to Know About Visual Perception and Website Design"}]},{"@type":"WebSite","@id":"https:\/\/www.crazyegg.com\/blog\/#website","url":"https:\/\/www.crazyegg.com\/blog\/","name":"The Daily Egg","description":"Conversion Rate Optimization Made Easy","publisher":{"@id":"https:\/\/www.crazyegg.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.crazyegg.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.crazyegg.com\/blog\/#organization","name":"Crazy Egg","url":"https:\/\/www.crazyegg.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2015\/06\/Crazy-Egg-logo-small.png","contentUrl":"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2015\/06\/Crazy-Egg-logo-small.png","width":191,"height":100,"caption":"Crazy Egg"},"image":{"@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/crazyegganalytics\/","https:\/\/x.com\/CrazyEgg","https:\/\/www.linkedin.com\/company\/crazy-egg\/","https:\/\/www.youtube.com\/channel\/UCJNe_xmPi07YezxaqfoRVqg"]},{"@type":"Person","@id":"https:\/\/www.crazyegg.com\/blog\/#\/schema\/person\/8d7b61c07999b4b3a428204a5d34f8ba","name":"Daniel Threlfall","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/01ba9017f5f969a00b74d66fda97dd92552bdc863fa2a54d32e524f5f107b089?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/01ba9017f5f969a00b74d66fda97dd92552bdc863fa2a54d32e524f5f107b089?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/01ba9017f5f969a00b74d66fda97dd92552bdc863fa2a54d32e524f5f107b089?s=96&d=mm&r=g","caption":"Daniel Threlfall"},"description":"Daniel Threlfall is a content marketing strategist who has helped to engineer the growth of blogs such as NeilPatel.com, increase the international expansion of Fiji Water, and improve the brand reach of Shopify. Daniel is the co-founder of Launch Your Copy, a resource to help copywriters triple their writing speed and blow up their income.","sameAs":["https:\/\/x.com\/https:\/\/twitter.com\/danielthrelfall"],"url":"https:\/\/www.crazyegg.com\/blog\/author\/dantheman\/"}]}},"modified_by":"Montana Thomas","_links":{"self":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/posts\/32228","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/users\/185"}],"replies":[{"embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/comments?post=32228"}],"version-history":[{"count":0,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/posts\/32228\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/media\/32266"}],"wp:attachment":[{"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/media?parent=32228"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/categories?post=32228"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.crazyegg.com\/blog\/wp-json\/wp\/v2\/tags?post=32228"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}