Hacking web design with neuroscience: 5 ways to influence how users see your website – EyeQuant
Hack #1: Visual simplicity (de-cluttering your design)
Follow our Simple 3-Step Process for Decluttering your Website, which includes tips for:
- cutting back on unnecessary text,
- stretching the page vertically by adding more white space, and
- replacing “busy” imagery.
Hack #2: Luminance Contrast
Luminance refers to the intensity or perceived “brightness” of a light, or in this case, the brightness of a color used on your website. The idea that bright colors attract attention isn’t new, but here’s the thing: our data suggests it’s the contrast in brightness that really matters – particularly when it comes to text and background colors.
Hack #3: The Pop-Out Effect (Color)
We’ve found that the effect of luminance contrast is greater than the pop-out effect, but understanding both effects can help you determine the optimal color scheme. A good rule is to use a color that is high in luminance contrast but doesn’t appear frequently on the page. That means:
- No “ghost buttons” (more on that here)
- Don’t use your primary brand color to emphasize content
- It can help if headlines, key value propositions, and calls to action are a different color from the rest of the text on the page.
Hack #4: Center-Left Spatial Biases
Many consultants claim that users scan/read pages in an F or Z-Shaped Pattern, but our data suggests those rules of thumb aren’t reliable. We analyzed scan-phase eye tracking data from 99 websites (each one viewed by 46 people), and there is a center-left spatial bias.
Hack #5: Using Lines & Edges
You should avoid obnoxiously large text, but the data also suggests that if you want to increase the amount of attention going to your headline (or other text), you’re better off increasing font weight (boldness) than font size. You should also consider edge density when selecting imagery. Images containing areas of high image density are more likely to distract users. Be careful with images that contain patterns or high-density backgrounds (trees, grass, rows of windows, etc).
Very smart guidance on website visuals. When you click-through, the article provides terrific examples
MarTech requires constant optimization to continually squeeze ever improving performance. No time for continual CRO? Contact marketingIO. #MarTech #DigitalMarketing