Big Four Banks

Australian bank websites – the good, the bad and the ugly

 

TL;DR

This is an article on the performance (load times and related metrics) of the home-pages of Australia’s biggest banks, from data accumulated over 4 years. Some have improved, some haven’t. I’ve given non-consequential grades on each.

Back to top  

Introduction

Australian banks are some of the biggest commercial entities in Australia. They have all, over the last 20 years, had to transition a large part of their traditional bricks and mortar interaction with the general public to online. In Australia, there are the “big four” banks – Commbank, ANZ, NAB and Westpac. These four banks make up over 80% of domestic banking transactions on the continent.

The financial services sector is infamous for its slow adoption of modern technologies, and the banks have been no different. The disconnect between their online experience to the one they try to create in-branch has been glaring, with only in the last few years the convergence being noticeable.

Back to top  

Back Story

Several years ago, October 2010 to more precise, I began measuring the performance of Australian banking sites – the big four, and the largest international competitor – HSBC. This performance is/was pretty rudimentary. I’ve utilized and online service called GTMetrix to measure both Google PageSpeed scores and Yahoo YSlow scores and then track those scores over time, the number and sizes of requests, along with the page load times. Unbeknownst to me at the time was that performance guru Steve Souders began his HTTP Archive project that leveraged the WebPagetest tool by Pat Meenan to track the top websites globally.

The difference between the data tracked by GTMetrix and HTTP Archive is that I had selected Sydney as the location for GTMetrix to run its measurements from – greatly improving/reducing any latency impacts compared to the US-based tests that the instance of WebPagetest run by HTTP Archive.

The purpose of this post is to look back over time to see how the different banks have approached their websites, looking at the performance of their home-pages as a base-line benchmark. I haven’t taken in to consideration aspects like site design or usability, but will take a look at some of the build factors as they stand at the time of publishing this article.

Back to top  

Overall

Load times are probably the best indicator of actual performance in a real-world context. The longer the site takes to load, the worse for customers:

Page Load Time

Oct 2010Jul 2014DiffChange
CBA7.3426.932-0.410-5.7%
Westpac3.0490.773-2.276-119.1%
ANZ3.2432.617-0.626-21.3%
NAB3.8883.351-0.537-14.8%
HSBC5.6714.510-1.161-22.8%

OK, good on Westpac for showing the biggest reduction in load time to under the crucial 1 second mark, sadly the Commmonwealth Bank only managed to shave 1/2 a second off their website load times in 4 years, but they are the only website of all 5 reviewed that put security ahead of performance.

However load-time is one dimension of performance. Lets look at how many bytes (total) each site is pushing down to users:

Total Bytes

Oct 2010Jul 2014DiffChange
CBA792018858420664028.0%
Westpac299902312752128504.1%
ANZ38314588924650610179.5%
NAB27475144471716996647.2%
HSBC132333450088317755109.1%

Again Westpac has managed to lead the pack – only increasing their overall payload by 4.1%. 2010 leader HSBC has blown out by over 100% to trail the rest.

So much for 4-year comparisons, lets take a deep dive into the trends and performance site by site…

Back to top  

CommBank

Commbank

First – lets check out the top-line comparison from 2010 to the latest report in Jul 2014:

Commbank Comparison

Commbank – Comparison 2010/2014

Here we can see that the Commbank – who has redesigned their website in the last 4 years – have managed to improve on all the summary measurements, except (as outlined in the summary) for their total page size. Let’s take a look into more detail.

Commbank - Trended load times

Commbank – Trended load times

It appears that towards the middle of 2013, Commbank had managed to get their load time down to about 2 seconds. Then – if the correlation to the time and sudden jumps/drops across the other graphs are any indication, a site redesign took place. The brilliant tool offered by HTTP Archive using WebPagetest allows us to do a side by side comparison of before and after the redesign.


*Load times will be longer in this video due to the testing being conducted from a US location and incurring round-trip latency.

There are two key things to note from this redesign:

  1. The move from HTTP to HTTPS of all elements. Commbank is currently the only bank of the top four (and also including HSBC) that have a site-wide secure browsing experience. It’s worth noting that while the technology is improving, there is still a latency hit from making all requests handled over HTTPS.
  2. The redesign actually reduced the number of HTTP requests made to generate the site (mostly images, down from 74 to 23), but the size of those requests increased (again driven mostly by images). This, combined with the additional latency introduced by HTTPS negated the request reduction to a large degree.
Commbank - Trended sizes  & requests

Commbank – Trended sizes & requests

This graphs shows that while since mid 2012 the number of requests has been in steady decline, the actual number of bytes has remained (with some spikes) around the 800k mark, putting it on par with ANZ.

Commbank - Trended YSlow & PageSpeed

Commbank – Trended YSlow & PageSpeed

While the Google PageSpeed score has improved with the redesign, the YSlow score has remained pretty flat. The key reason for this appears to be the weighting by YSlow on the use of (or in Commbank’s case the lack of) a CDN. Looking at both scoring algorithms, the key aspect that Commbank is failing to address is leveraging browser caching so that repeat requests for resources aren’t unnecessarily downloaded from the server. This could be an intentional design or development decision, but it’s hard to imagine why.

So much for looking at reported metrics, lets take a look at some of the other aspects of their site. As part of the redesign in mid 2013, Commbank has leveraged a number of modern web technologies, including HTML5 (using HTML5Boilerplate), Adobe’s CQ5 CMS, and a heavy dose of JavaScript and jQuery libraries. You can get a better appreciation of what they’ve crammed into this version of the site by looking at BuiltWith’s profile.

The term/brand ‘Commbank’ as a contraction of “Commonwealth Bank” is a tricky one for the bank, as it’s also referred to as the ‘CBA‘ (Commonwealth Bank of Australia). Someone has thought of that and the site correctly (301) redirects requests for those two variants to the www.commbank.com.au URL, however Commbank have chosen to use the /personal.html sub-directory index file as the “canonical URL.

Strangely, the use of the .html filetype is maintained – possibly due for legacy reasons. It is redundant, and more so when you consider that ‘/personal.html’ switches to /personal/ as a subdirectory in it’s own right to house all of the personal banking related content. Some of this content is also housed under a /can/ sub-directory – marketing gone too far in my humble opinion as it provides no structural or semantic value to the URL design.

Interestingly, little optimization has been done to this /personal.html ‘homepage’ of the bank. It’s title is “Personal – Commbank“, and not “Personal Banking – Commbank” (like it’s Business counterpart, although the Corporate section suffers from the same implementation).

Like most of the other banking websites, they’ve paid little attention to how a production website should be taken an extra step in terms of delivery than a testing or staging environment. The best example of this is when you view the source code of the home-page. Key areas I would recommend to the bank in this area would be:

  • Removal of all white-space and inline HTML/JavaScript/CSS comments – a production site doesn’t need to expose all of this unnecessary bytes and more importantly unnecessary development commentary to end users. The HTML at this point is for the browsers and crawlers only.
  • Pay attention to the ordering of non-visible elements – unnecessary duplication of the content encoding (already declared in the HTTP headers), an empty and redundant meta keywords field
  • Unstructured positioning of JavaScript & CSS (inline and external) through-out the page instead of fully external and delegated to either the(as required) or to before the closingtag.

To be fair, there are a lot of things the Commbank does do well:

  • Most of the external JavaScript and CSS files are minified
  • The site does use rel=canonical
  • Redirections are done using the correct 301 HTTP response
  • As mentioned earlier – the entire site is delivered over HTTPS with proper HTTP headers

Given where this bank has come from in the last 4-5 years, there’s lot for them to be proud of with the current state of their site. The Commbank used to be infamous for it’s antiquated approach to technology and is now firmly in the fast-lane.

I’ve given the Commbank a “B+”, mostly for effort.

Back to top  

Westpac

Westpac logo

As per the summary earlier, Westpac might be the #2 bank (going by market capitalization) in the country, but it’s leading the way in terms of website performance. Even back in 2010 it was leading the pack in page load times, but since then it has managed to wipe off an additional 119% to be the only bank to deliver a sub-second homepage.

Westpac Comparison

Westpac – Comparison 2010/2014

Westpac - Trended load times

Westpac – Trended load times

From the trended load time graphs, Westpac has been able to almost consistently deliver a sub-second load time since the beginning of 2012.

Westpac - Trended sizes & requests

Westpac – Trended sizes & requests

The redesign that took place around March 2013 significantly reduced the number of HTTP requests – almost by half – yet maintained the page load performance. The before and after of the subtle change can be seen in this following timelapse, and in more detail here:


*Load times will be longer in this video due to the testing being conducted from a US location and incurring round-trip latency.

Westpac - Trended YSlow & PageSpeed

Westpac – Trended YSlow & PageSpeed

The YSlow and PageSpeed scores have been at a consistently high level since the redesign. As with the Commonwealth Bank, the primary aspect that has been ignored is caching of static resources.

Looking beyond the comparison metrics, it’s pretty hard to fault the build quality of the Westpac homepage. They still suffer from some of the oversights that were called out on Commbank – some of the HTML comments still persist, for example, but they also have minified their HTML, JavaScript and CSS, added a bunch of other rich social and meta data, and have a clean and consistent URL structure and site architecture. Their HTTP headers are very clean an leak very limited information in terms of the tech-stack that powers the site, but some information can be gleamed as BuiltWith shows.

Interestingly, Westpac does honor requests for the site over HTTPS (see https://www.westpac.com.au ), but doesn’t force redirect requests that aren’t. I think this is something that they should strongly consider.

It’s clear that there’s someone (or more) with a clue sitting at Westpac – they’ll be hard to beat if they stick to this approach.

Westpac gets a “A” grade from me.

Back to top  

ANZ

ANZ logo

[Note: Please refer to the disclosure statement at the bottom of this article]

ANZ Comparison

ANZ – Comparison 2010/2014

As with the other three previous sites, ANZ has also gone through a homepage redesign. Theirs took place around the middle of 2011, and unlike the redesigns of Commbank and Westpac, it was actually worse in terms of overall performance, with the only actual measurable benefit being the reduction in HTML download time (you can view before/after comparison here).

ANZ - Trended load times

ANZ – Trended load times

Time to paint – a phrase that indicates how soon the webpage begins being rendered in the browser was noticeably affected by this redesign, as shown in this time-lapse of before and after the redesign:


*Load times will be longer in this video due to the testing being conducted from a US location and incurring round-trip latency.

As shown in the graph below, the redesign tripled the number of HTTP requests and doubled the actual number of bytes. The number of requests and bytes has slowly but steadily continued to creep up since then.

ANZ - Trended sizes & requests

ANZ – Trended sizes & requests

A sudden, but immaterial in terms of performance, drop in ANZ’s Google PageSpeed score around the beginning of 2012 lasted for a year before it was addressed. Looking further in to this it could be that the test browser and test suite versions went through a big change at that time, however this isn’t mirrored in terms of impact by the other sites. Expiry headers was detected to be a big site-specific change that looks to have been the major influence.

ANZ - Trended YSlow & PageSpeed

ANZ – Trended YSlow & PageSpeed

It’s relatively easy to find issues with ANZ’s homepage – they’ve struggled internally to get it any better than it is currently. The homepage redesign is part of a multi-phase project that has attempted to pull the entire site into this decade. Some of the more glaring issues they need to address are:

  1. Figure out whether they are www.anz.com or www.anz.com.au – allowing both versions to be exposed without redirecting or canonicalizing is causing massive duplicate content issues for their SEO efforts.
  2. Simple minification of their JavaScript and CSS files would go a long way, combining/concatenating them would go further.
  3. GZip compression is not enabled for all of their static assets – enabling this could reduce the entire website payload by over 70%!
  4. The site makes requests for assets that return a 404, that 404 response weighs in at 94kb each time.
  5. Every asset request is delivered with a cache-busting query-string value, reducing it’s ability to be cached, even if browser caching was enabled, which it isn’t.
  6. Every asset request is returned with a cookie that adds another kilobyte in bloat to each request.
  7. Every image can be losslessly compressed to reduce it’s file size, most up to 70%

So clearly there’s significant room for improvement, but I’m not confident that we’ll see it any time soon.

ANZ gets a solid “C-” grade – much to improve.

Back to top  

NAB

NAB logo

NAB’s performance, at least measured by it’s homepage, has been a “steady as she goes” result in terms of the 4 year trends. It’s load times, sizes, requests and PageSpeed / YSlow scores have been a mixed bag of improvements and degradations.

NAB Comparison

NAB – Comparison 2010/2014

NAB - Trended load times

NAB – Trended load times

There was a period where the GTMetrix tool saw a pronounced delay in load times. This wasn’t reflected in manual testing at the time, so it may have been a form of configuration of the testing mechanism or the way that NAB at the time responded to requests that may have looked “unnatural”.

NAB - Trended sizes & requests

NAB – Trended sizes & requests

A minor redesign took place around the beginning of 2013, this saw a short period of bloated request numbers and sizes, but there appears to have been some effort in the last year or so reducing those numbers. BuiltWith’s tool also shows that NAB, like some of the other banks have gone with Adobe’s CQ CMS to power the consumer facing site.

NAB - Trended YSlow & PageSpeed

NAB – Trended YSlow & PageSpeed

Despite all of the above, the YSlow and PageSpeed scores have trended in a relatively narrow and consistent range over the last four years. NAB’s key quick wins are much like the other sites in that they also don’t make any effort to leverage browser caching and unnecessarily send cookies with each static resource request. This makes second and subsequent requests overly bloated. Some other aspects of the NAB site I think their team could take a look at are:

  • Combine the number of JavaScript files to the smallest number possible – currently over 25 individual JS file requests are made.
  • Reorder the JavaScript files – especially with regard to placement after the CSS file(s). Where possible place them close the closing body tag.
  • Minify the HTML – there’s not good reason that production HTML contains redundant white-space.
  • Remove the homepage carousel

Some low-hanging fruit for NAB.

I think that there’s been some good effort by the NAB, so I’ve given them a “B-” grade.

Back to top  

HSBC

HSBC logo

[Note: Please refer to the disclosure statement at the bottom of this article]

The HSBC story is slightly different to the others. Firstly, they’re not one of the “Big Four” banks, but are one of the biggest banks that have an overseas headquarters that has a retail banking presence in Australia. They’re also one of the few banks that hasn’t undergone a redesign in the recent 4 year period. Given that the UK site has undergone a massive redesign effort, I’m sure that the AU version of the site is not far away. Anyway, here’s the 4-year summary.

HSBC Comparison

HSBC – Comparison 2010/2014

Apart from a weird blip at the end of 2012, load times have remain relatively consistent:

HSBC - Trended load times

HSBC – Trended load times

Both the number and size of requests has doubled in the last 4 years, more so in the last 12 months as intensive marketing campaigns have kicked in:

HSBC - Trended sizes & requests

HSBC – Trended sizes & requests

Ignoring the dip and recovery of PageSpeed scores, the overall rating by the performance tools has had a very flat trend ending up no better or worse than when I first started tracking results.

HSBC - Trended YSlow & PageSpeed

HSBC – Trended YSlow & PageSpeed

I’ve previously used the HSBC website as an interview tool to gauge how many things an interviewee can find wrong with a site. HSBC (AU) is a gold-mine of how not to build an enterprise banking website. While the upcoming redesign might provide a more aesthetic appeal, it will be no more than putting lipstick on a pig. The institution is at least 10 years behind in understanding online, and nothing is more telling than it’s antiquated linking policy: http://www.hsbc.com.au/1/2//footer/hyperlink-policy – linked to in the footer of the website that opens up in a pop-up, with a misconfigured URL. Having personally dealt with the HSBC HQ staff in Hong Kong, it’s clear that digital excellence is far from one of their objectives.

In the interests of education, let me list some of the obvious and not so obvious aspects of HSBC’s homepage:

  • The domain URL hsbc.com.au redirects, via a temporary (302) redirect to a sub-folder /1/2/.
  • That last trailing slash is sometimes linked to internally with, for no other reason than slashes are sexy, to a double slash (e.g. http://www.hsbc.com.au/1/2//personal/services)
  • The site uses no compression in it’s HTML, it’s CSS or JavaScript – it’s all there for all and sundry to view (except the public doesn’t)
  • There’s no structure to the JavaScript files being referenced, and a large portion of JavaScript is inlined

I could go on, but it would be unfair to do so. Until they decide to update their website they can only be judged against more modern equivalents, and it would be an unfair comparison.

I give this site a grade “F”.

Back to top  

Summary Takeout

Given the complexity of banking systems, their monolithic structures and infamous bureaucracy, it’s refreshing to see at least some of the bigger players have a cohesive digital strategy and satisfactory digital presence – if only measured by their home-pages. Clearly there’s lot to improve on – some of the banks have put security first, some have put user experience front and centre. These are some of the oldest institutions breaking into unknown territory for themselves and the ones that adapt to change the best, are the ones that will prevail. Being slow to change and adopt put major historical investment at risk. The public has already become digital savvy, and have high expectations and low tolerances for enterprises that don’t meet their needs online.

Out of the four big banks, Westpac leads on performance, but Commbank takes the security initiative. ANZ and NAB have some catching up to do while HSBC is following up at the rear kicking and screaming against the changing environment. This analysis has only scratched the very cosmetic surface of online banking. In fact online banking itself hasn’t even been touched on at all – the home-pages of these banks are nothing but digital store-fronts – some have been newly fitted out with shiny spaces, some have the worn-out carpets.

Ultimately it’s the public that votes and grades, with their wallets and patronage, so this has been nothing but an entertaining exercise in digital shop-front judging, I hope you made it this far.

Back to top  

Disclosure

In 2012-2013 I’ve provided consulting services on Search Engine Optimization to the ANZ bank’s digital marketing team while I was employed as the SEO Director for FirstClick Consulting. Almost all of the issues (and many many more) that I’ve outlined were presented, with recommendations on their resolution.

In 2013, as SEO Director for FirstClick Consulting, sub-contracted by HeathWallace, I provided SEO proposals and guidance to HSBC Global Marketing and Digital divisions as part of their global strategy. I left FirstClick Consulting before any of the recommendations, changes or development was conducted or implemented.

Back to top  

Disclaimer

This article has been written without any prompting, permission, or commission by any banking service. I began monitoring these websites out of my own curiosity. This monitoring began before any professional engagement was undertaken in my own time, using my own resources. Where appropriate, I have used some of the reporting and insights as part of professional advice to some of the banks (see the disclosure statement above).

I make no claim of any internal knowledge of strategy, systems, or development of these websites. I have restricted the scope of this article to the home-pages in terms of monitoring. Any ranking, grading or any other assessment shall form no professional or financial opinion on any of the businesses mentioned to provide their services to the public in any way that is not in their best interests.

Back to top