10 UX Patterns Fund Websites Should Start Using In 2016

“When creating content, be empathetic above all else. Try to live the lives of your audience.”

This fantastic quote from Moz founder, Rand Fishkin, exemplifies the core of what UX is about – user experience. You could miss out on higher profits, increased sales and sign-ups if you don’t create a user experience that drives your website visitors to conversion.
Well-designed fund website’s have their own unique features which set them apart, but they all share common patterns. Keep your fund website at the forefront by following these UX patterns in 2016.

1. Put headlines before images

An eye-tracking study by the Poynter Institute has determined where people fixate when they view a news website or a multimedia feature.
Test subjects looked at text elements (headings) before their eyes landed on the accompanying image. This is typical for one-column articles – the general layout of most home pages.
AB Global place their headlines first, followed by an accompanying image:

AB-Global-article
AB Global article heading placed before image

2. Use plain language

The National Adult Literacy Survey  of 1992 and 2003 showed that the average American adult reads at the 9th-grade level. Whether this is still true in 2016 is debatable. The fact remains that the readability of your website copy is important.

Evernote-simple-text
Evernote’s text is simple and easy to read

Apply Occam’s razor when writing your copy. The simpler sentence is usually better.

3. Use a simple & minimal design

Have you heard of “flat design”? Flat design is a style in which elements lose the characteristics which make them appear as though they lift off the page. Examples include the design used by Apple for iOS7 and Material Design from Google.
Flat design is prevalent in recent times. Most websites tend to follow a more simple and minimalistic design pattern.

Flat vs skeuomorphic
Flat vs skeuomorphic

Bridgeway Capital Management‘s website was redesigned recently with a predominantly flat/minimalistic look and feel:
Flat/minimal elements used on the Bridgeway website
Flat/minimal elements used on the Bridgeway website

4. Follow the F-shaped pattern

In one of the earliest eyetracking studies Jakob Nielsen and his team discovered that users read web content in a F-shaped pattern.
Users initially scan the web page with a horizontal movement (the top part of the ‘F’), followed by moving their eyes downwards a little before moving horizontally again (the lower bar of the ‘F’), and finally moving vertically down the left side’s content.

The F-shaped pattern of reading web content
The F-shaped pattern of reading web content

5. Use side navigation

The horizontal navigation bar has been the typical navigation for the past couple of years. However, with the advent of mobile and responsive design, these menus typically transform into vertical accordion menus on smaller devices.
An emerging trend is the use of vertical navigation, as used by the WordPress dashboard:

WordPress navigation menu on desktop and mobile
WordPress navigation menu on desktop and mobile

The benefit of this approach is that the user’s menu interface translates easily from desktop to mobile, creating a seamless experience.
Sidebar navigation used on the Smith & Williamson website
Sidebar navigation used on the Smith & Williamson website

6. Use fat footers

Large footers at the bottom of pages became popular a couple of years ago and are still in abundance today.
Providing links to the different sections of your company website gives clients another chance to find exactly what they need. The fat footer content is usually divided into some common sections:

  • Information about the company (About, Team, Vision etc.)
  • Information about services and products
  • Latest blog / news articles
  • Contact information
Franklin Templeton Investments uses a fat footer
Franklin Templeton Investments uses a fat footer

7. Use responsive design

Is your fund website responsive? Mobile-friendliness has been considered a ranking factor by Google since 21 April 2015. How do most fund websites perform in 2016? We took some common fund website keywords and ranked the mobile-friendliness of the top 10 results in Google:

  • “asset management” ? 50% of website results were responsive
  • “mutual fund” ?  60% of website results were responsive
  • “wealth manager” ? 50% of website results were responsive

There are still a lot of improvements required when it comes to making websites responsive. You can determine if your website is mobile-friendly by using the Mobile-Friendly Test tool from Google.

Flagship Asset Management website is 100% mobile-friendly
Flagship Asset Management website is 100% mobile-friendly

8. Use high resolution photographs

Photos can have a huge impact on the usability of digital products and services. For a photo to be effective it should communicate the message clearly to the visitor and influence visitor behaviour.

Liberty Shares website uses high quality persona photography
Franklin Templeton’s Liberty Shares website uses high quality persona photography

There are studies showing that directional cues can influence where the website visitor looks. For example, users follow a pictured person’s line of sight to the website text (e.g. headline and opening copy).

9. Prioritise content instead of using a carousel

Carousels are still everywhere in 2016 and used by some of the biggest websites (like Amazon), yet study after study shows that they are ineffective.
Rather than using a carousel prioritise two to four content pieces for users to click on, instead of the hit-and-miss strategy of carousel.

AB Global prioritises content on their homepage
AB Global prioritises content on their homepage

10. Improve the user onboarding process

Onboarding refers to the process of explaining a new product to first-time users. On fund websites this can mean overlay tutorials explaining interface navigation to the user:

AB Global overlays informational windows to guide the user
AB Global overlays informational windows to guide the user

Before designing the interface, stop and think about the first time user’s experience. Using overlay tutorials can get your clients up to speed on navigating your fund website.
Are you following any of the above UX patterns for your fund website in 2016?

Facebook
Twitter
LinkedIn

Insights from our blog

Real growth. Realized.

Reduce time to market for websites, marketing documents and content portals by over 50%, and at one third of the traditional cost.

Times are changing. Stay informed

Get in touch

Drop us a line and a member of our team will be in touch with you shortly. Alternatively, use the chat feature at the bottom of the page.