Case Study 2: the Bank of England

The Bank of England's site has some similarities with the UKAPW; the BOE site has three columns and left hand "expandable" navigation. The navigation is not entirely consistent. The third column is a more reliable "related links" than the UKAPW. The BOE home page beats the UKAPW's hands down.

The Bank of England home page: professional and to the point

The BOE site has ten content areas, including the home page (see 3 below). This is similar to the UKAPW. In my view the BOE home page is almost a work of art. Key home page features include:
  • The 3-column design
  • The bank's purpose (7) and corresponding metrics (6)
  • The small amount of core functionality at the top of column 3 (2)
  • The minimalist approach to news in column 3 (5)
  • The main areas of the site (3) and quick links (4) in column 1
BankOfEngland - a neat website Table: BOE home page
Element Comment Element on
1 Logo and branding. The home page logo cycles through various images, while there is a separate static image for each main area of the site. Although basically "fluff", each image has a clear link to the Bank. All pages
2 Site search, print page, contact us and automatic updates from the site are prominent. All pages
3 Main navigation: this is covered in more detail below. All pages
4 Quick links. Perhaps these are based on site statistics e.g. using Google analytics. Home page
5 News. Up to date and closely related to the Bank. No Yahoo feeds here. Home page
6 Key facts. It is clear that these really are key. Home page
7 Main content. On the home page this gives some indication of what the Bank is all about. Home page
8 Events. Appropriately brief coverage. Home page

Learning points for UKAPW

[1] Home page

A glance at the home page and a few clicks gives valuable points to take away. The BOE home page compares favourably to the UKAPW home page in simplicity, design, ease-of-use and content. The BOE home page has a simple column-based structure, explains the Bank's role and highlights the most important areas of the site.

A contrast with the UKAPW home page is drawn in the right hand panel. More detailed coverage is given in the myFIA critique of the UKAPW home page The BOE home page passes the "at a glance" test. Does UKAPW's?

[2] The Bank of England layout: simple and effective

The graphic below shows a typical "level 2" page on the BOE site – the history of the Bank. Elements appearing on most pages outside the "special" home page, are as follows:
  1. Site search, print page, contact us and automatic site updates are very prominent.
  2. A clickable breadcrumb which is generally reliable.
  3. The well written main content.
  4. The standard navigation.
  5. More content: the pages "cleverly" avoids loading a new page – unusual on this site.
  6. Key resources: typically you can do rather more than just read these.
  7. Related internal links. And usually they are indeed related.
  8. External links.
BankOfEngland - history

[3] The Bank of England content: extensive and impressive

There's a lot of content, with much at "lower levels". So far, so similar to the UKAPW. But the content quality is superior to UKAPW; the introduction to a page immediately confirms the page's purpose. Related links abound and are always in the same place; nothing is "left hanging" and the reader is not "left wondering".

Examples of the BOE's tightly-written content, and illustrations of where the UKAPW does not reach this standard, are set out in the right hand panel. This is relatively easy for the UKAPW to put right, but requires time and effort. Volunteers might be prepared to write content.

[4] Navigation: a common challenge

Like the UKAPW, the navigation in the left hand column "expands" as it is clicked, revealing lower levels of navigation and content. After the home page, up to 3 further levels are revealed, as shown in the table below.

Table: BOE navigation levels
Level Examples - and how to identify the level and active page
1 (1) Home, (2) About the Bank, (3) Monetary Policy, (4) Banknotes, ... (10) Careers
Dark text on grey background if inactive and orange shading if "active".
Clicking on 3 (Monetary Policy) opens up the next level of links, described below
2 (3.1) Monetary Policy Framework, (3.2) Monetary Policy Committee, ... (3.6) The Bank's Agencies, (3.7) Economists at the Bank
Orange text on white background while inactive. Lighter orange shading if active.
Click on 3.6 (The Bank's agencies) opens up the next level of links, described below.
3 (3.6.1) Agency contacts, (3.6.2) People and Biographies,(3.6.3) Contact Details
Grey text on white background, with the active link in bold.

This is broadly the same approach as the UKAPW. Displaying several levels of information in a limited amount of space is inherently challenging. I would recommend giving up, and instead following the QFINANCE approach of showing only the higher level navigation; it's just too hard to see where you are. Another approach would be to abandon the orange/grey, bold/non-bold and label all the links with their levels, rather like the content of a book.