The elements of the layout design of home pages include titles, headings, text, graphics, images, background videos, cards, and lots and lots of mock-ups. These elements recur in patterns along most financial technology websites, and are usually ordered similarly within the page.
A general layout guideline is that viewers are most likely to browse the page in an F-shaped pattern, so important elements should be left-aligned and centered vertically in the page to catch attention first [8].
The top left is the first priority, so you’ll usually see the brand’s logo here. Then, from top to bottom, we have the navigation bar, hero section (most important page imagery), overview sections, a final big call-to-action section, and lastly, a footer including extended navigation and your fine print.
The choice of design elements to include in the home page, and how much of them to include is based around a combination of coherence, legibility, mystery, and diversity [11].
Diversity, or complexity, is the most important of these for determining the quality of the page’s design. However, just because complexity is the most important, doesn’t mean that more complexity is always best. The visual complexity and communication effectiveness have an inverse curvilinear relationship, meaning that in most cases, a moderate amount of complexity is best, and complexity being too high or low is less effective [7].
Referring back to the purpose of a home page, a page that serves as a background for the advertisement is best served by low complexity, because more attention is drawn to the complexity of the advertisement itself when it is juxtaposed with less complex surroundings. In this case, simplicity is favored by consumers. On the other hand, when the site serves as the ad itself, moderate complexity is favored, and the inverse applies to the site design [10].
All of these considerations serve the purpose of increasing the “involvement” or “exploration potential” of the site. This is a measure of a page’s ability to engage the audience and motivate exploration of a site, amounting to a rich user experience that encourages users to go deeper and stay longer [10].
When it comes to guiding audience intent, involvement is much more important to holding interest and spurring action than understanding. This means that contrary to how the goal of a home page seems on the surface, the audience understanding the organization of the site and comprehending the range of services isn’t actually the top priority here. No matter how well organized the content of your page is, consumer conversion is unlikely to occur unless there’s lots of involvement and exploration opportunities [11].
Especially within financial technology, the flashy design and scroll based animations serve to increase involvement through a sense of discovery as you move through the page. These dazzling graphics and impressive use of technology signal the end benefit that the audience is actually (maybe subconsciously) seeking: access to the future. The page is the ad itself, showing off the impressive technology that businesses and startups seek to harness, alongside the maverick individuality that consumers such as crypto traders and those disillusioned with traditional banking have come to value.
After discussing how content is arranged on the page and visualized, we can move onto discussing what informational content is included and excluded from financial technology home pages (and how they serve our goals).
All brand assets of Stripe, Chime, Square, PayPal, Cash App, and Adyen are cited on this page and within a separate downloadable document. Each asset was acquired either through a Creative Commons license or via press kits, allowing permission for editorial/educational noncommercial use. The entire site was created without template, in Webflow, and exists as a visual representation of the patterns identified and analyzed in the aforementioned companies' desktop home pages.
Home is a genre analysis, not a financial technology company.
1
Stripe | Financial Infrastructure to Grow Your Revenue. Stripe, n.d., https://stripe.com/.
2
Chime - Banking with No Monthly Fees. Fee-Free Overdraft. Build Credit. Chime, n.d., https://www.chime.com/.
3
Power Your Entire Business | Square, Square, n.d., https://squareup.com/us/en.
4
Pay, Send and Save Money with PayPal | PayPal US. PayPal, n.d., https://www.paypal.com/us/home.
5
Cash App - Do More with Your Money. Cash App, n.d., https://cash.app/.
6
Engineered for Ambition - Adyen. Adyen, n.d., https://www.adyen.com/.
7
Geissler, Gary & Zinkhan, George & Watson, Richard. (2001). Web Home Page Complexity and Communication Effectiveness. J. AIS. 2. 0-. 10.17705/1jais.00014.
8
Sutcliffe, A., & Namoun, A. (2012). Predicting user attention in complex web pages. Behaviour & Information Technology, 31(7), 679–695. https://doi.org/10.1080/0144929X.2012.692101
9
Doty, P. (1997). Selling the Home Page: An Essay on the World Wide Web and Rhetoric. Internet Reference Services Quarterly, 1(3), 99–105. https://doi.org/10.1300/J136v01n03_12
10
Geissler, G. L., Zinkhan, G. M., & Watson, R. T. (2006). The Influence of Home Page Complexity on Consumer Attention, Attitudes, and Purchase Intent. Journal of Advertising, 35(2), 69–80. https://doi.org/10.1080/00913367.2006.10639232
11
Singh, S. N., Dalal, N., & Spears, N. (2005). Understanding Web home page perception. European Journal of Information Systems, 14(3), 288–302. https://doi.org/10.1057/palgrave.ejis.3000525
Thank you for reading!
