Rather than going with a vertical layout, Stripe leverages the predictable F-pattern to optimize their page according to how our brains naturally scan for information. First horizontal swipe The most critical data, in this case, is the headline. If left-aligned or placed at the top left of the page, it will be the first element visitors are likely to zero in on. Without even reading the words, the bold font and large size communicate, “YOU NEED TO KNOW THIS.” The images to the right side of the page provide two more data points to boost consumers’ confidence in the product: sample client results and a sample payment process. Their purpose is to give you and your customers an idea of how the platform works.
Check this out, though: Stripe has a host of pages under their Stripe Docs library that can walk leads from creating a product on their platform to learning how to generate revenue reports—before they even sign up. What you see on the right-hand side can be thought of as a “mini-demo,” which assists 69% of consumers in making a purchase decision. Second horizontal swipe Did you read the description paragraph when you scanned left-to-right the second time? Wouldn’t blame ya if you didn’t. Though, this time around, the CTA is more pronounced. The CTA has one specific buy email list request and stands out due to the color contrast between the gray button and white text.
buy email list
They’ve also gone ahead with a multi-focus approach and added a second CTA in case page visitors feel like they still need to talk it over with a sales rep before signing up. Image courtesy of Nielsen Norman Group The diagram above shows heatmaps from user eye-tracking studies of three websites. This is a powerful representation of data that analyses where users click, how far they scroll, and what they look at or ignore on your page. The red areas depict the highest activity, yellow indicates fewer clicks and views, while blue represents the fewest of the two.