Many banking websites occupy a space on the web that seems resolutely stuck in the recent past.

Most of the popular high street banks don’t operate responsively designed desktop sites, instead choosing a separate mobile site.

Many have homepages that are text heavy, offering a huge array of navigation and product options, but little in the way of persuasive design.

Some don’t even allow you the option to apply for an account online.

Usability is above everything else in design. The most tastefully austere website with innovative micro-UX to spare may be impressive for us web design fetishists, but if a visitor has to spend ages trying to figure out your navigation and ends up not being able to achieve what they (or your site) intended then your web design has failed.

Perhaps the greatest thing about our modern digital world is that many of our previously difficult, lengthy and inaccessible processes are being transformed into ones that can be done in a matter of minutes at our own convenience. Just take a look at how has transformed government services. manages to achieve this easy, distraction-free user experience whilst operating an uncluttered, fully responsive and simple website.

When it comes to digital transformation, the financial services industry above all else should be making similar strides in making its services and products accessible to any person, at any time of day, via the most convenient channel for the individual user.

However, many banks could also do with updating the design of their sites so they are much more user friendly and easy to navigate.

Of course banking websites also have to achieve something else that the doesn’t have to worry about, they have to sell a product.

So it’s a difficult balance to maintain: accessible products and services, delivered through a simple, easy-to-use interface while at the same time persuading new visitors they definitely should bank with them.

Lloyds has gone the non-responsive route for its desktop site, but it does operate a standalone mobile site. 

The same goes for HSBC…

Aesthetically the most obvious thing that stands out for these two brands is how neither has altered its look to embrace more contemporary flat or tiled design. 

But then this is all very fashionable, and of course the problem is with fashion is that it passes.

Flat, tiled design came from a need to make content work across multiple screen sizes on responsively designed sites. Tiles can be resized and rearranged much more easily than any other shape.

If the Lloyds and HSBC sites work just as well on a desktop as they do on a smaller screen and their products and features are easily accessible then that’s the most important thing.

On the Lloyds Bank site, it’s clear that you’re in the personal banking section, and if I want to find information on its current accounts this is accessible from two points: the products and services tab and from the hoverable buttons below which open up with further information.

Over at HSBC, current account info can be found under the Everyday Banking tab on the top nav.

Both of these sites could do with simplifying their on-page offerings, there’s a surfeit of information, messages and navigation options which could be streamlined to make for a more user friendly experience. 

HSBC and Lloyds however do offer you the option of opening a current account online. 

In fact HSBC’s product page is very persuasive, with clearly laid-out information and a terrific call-to-action. 

Transfer these buttons and this level of clarity to the homepage and HSBC’s site would improve greatly.

For Lloyds, the full information about its different current accounts is hidden beneath the fold, and that information suffers from poor visibility and layout.

As an example of best practice, take a look at Barclay’s fully responsive site.

Barclays has the confidence to highlight just two products here, with key benefits clearly highlighted, with bold calls-to-action and evocative imagery.

If neither of these products are what you’re looking for, the navigation is clear enough to lead you to the right destination without any distraction or clutter.

The wording across the top nav makes it completely obvious where you need to go: ‘Bank’, ‘Borrow’, ‘Insure’ etc.

And of course it’s fully responsive, so Barclays doesn’t need to build and maintain two separate sites. In fact if you so wish to, the responsive web-form is so good you can apply for a bank account on your mobile.

This provides every one of the components I mentioned earlier: ease of use, accessible services from all devices, and a very persuasive product. All from a single solution.

Christopher Ratcliff

Published 26 March, 2015 by Christopher Ratcliff

Christopher Ratcliff is the editor of Methods Unsound. He was the Deputy Editor of Econsultancy. You can follow him on Twitter or connect via Google+ and LinkedIn

686 more posts from this author

You might be interested in

Comments (6)

Save or Cancel

Kieran Fox, Head of Online at

Barclays have come on leaps and bounds with their digital offering over that past years. Having previously worked in the banking sector, Lloyds were always at the forefront of digital innovation however recently Barclays have taken that crown in my opinion. A really nice, well thought out site.

over 3 years ago

Becs Rivett

Becs Rivett, Email marketing manager at Becs Rivett freelance

Not mentioned here but perhaps you're not aware how much regulatory wording has to be added onto these banking webpages in order to comply woth FCA & PRA policies.

Would recommend you take a look at the award-winning responsive site of Leeds Building Society - although not a bank!

over 3 years ago


Deri Jones, CEO at SciVisum Ltd

You missed the big building society Nationwide -which has a responsive site.

And there's a few more banks: NatWest, TSB.

over 3 years ago


Robin Middleton, Head of Digital at Sovereign

Have a look at Nationwide's site, lovely homepage and real thought of how to crop a strong image to work responsively.

Having worked in banking, the real comparison is in the account management section and Lloyds leads the UK market here in their money management tools.

over 3 years ago

Peter Yates

Peter Yates, Director of Account Management at Axonn Media Ltd

Great article on a topic that's been an issue for me for some time. I bank with both HSBC and Lloyds, and so I am very familiar with the aspects of top level layout and navigation mentioned above.

However, I still have an issue finding specific info about my accounts, and in a format that's easy to understand. I think that the financial institution that nails that will revolutionise how in control people feel about their finances, and then in doing so have massive appeal.

over 3 years ago


Richard Hoolahan, Digital Manager at Banking

Firstly, the article is not quite correct. HSBC in a number of countries (including the UK) has adaptive websites. HSBC uses adaptive styles which detects the device and calls up the properly sized layout to view.

Secondly, I have to agree with Becs Rivett as there are a lot of challenges for Financial Institutions around legal/compliance disclaimers. These are very frustrating from a user experience/usability perspective. The key is to get them involved at an early design stage or to at least factor them in very early.

over 3 years ago

Save or Cancel

Enjoying this article?

Get more just like this, delivered to your inbox.

Keep up to date with the latest analysis, inspiration and learning from the Econsultancy blog with our free Digital Pulse newsletter. You will receive a hand-picked digest of the latest and greatest articles, as well as snippets of new market data, best practice guides and trends research.