Case Study: AIB & The Business Benefit of Web Standards

March 1, 2007 · Posted in Uncategorized 

Screenshot of the new AIB homepage

Hello again, Lar here from iQ Content, writing my third in a series of posts on accessibility. This time, I’ll be discussing the business benefits of adopting web standards, using the new AIB (Allied Irish Banks) homepage as an example.

Via Michele Neylon’s blog, AIB have redesigned their homepage, this time using web standards.

Big deal, so what? In this post, I’m going to compare the before and after, hoping to quantify the tangible benefits of designing with web standards.

The argument against web standards: that old chestnut!

The argument (that I’ve heard) against adopting web standards is that it compromises the existing look and feel of the site, and make a site look boring. Presumably, that argument has been well and truly lost by now. But, just in case, let’s look at AIB’s new homepage and compare it to the previous Personal Banking homepage.

Screenshot of new site beside the old site

What’s the difference?

Although the content has changed, we’re not directly comparing like with like, hopefully I’m still making a good case. The difference between designing with web standards and not, i.e. using tables, is less code. Let’s take a look under the bonnet of the previous version. The layout is based on using tables and “spacer.gifs” (not good).

Screenshot of old site showing table-based layout

The new AIB site: DIVs, not tables

Screenshot of new site showing divs

So, let’s tot up some numbers. The old design

  • used 22 tables to layout the page
  • used 42 “spacer gifs” (invisible images used purely to help lay out the page) and
  • file size of the HTML (not including decorative images) was 34 KB.

What about the new design?

The new homepage

  • is 29KB in size, (a saving of 5KB, or 15%)
  • Uses no tables and
  • Uses no spacer gifs

Saving 5KB: Surely this makes no difference?

Actually, it can. According to AIB, they received 40 million visits to the site last year. If each of these visits came throught the homepage, this translates (roughly) into a saving of 20 gigabytes. So, a saving of 20 gigabytes for only one page! Multiply that by the number of pages in the site, and we’re beginning to see big numbers.
Clearly, there are the benefits of bandwidth savings and better server performance. But what else?

Benefit: Faster downloads, happier customers

Less code means faster downloads for your customers. Making your customers queue, whether online or offline is not really ideal for business. In AIB’s own words,

“Bank online. Not in line.”

Benefit: Reduced development time, happier staff

With regard to development and maintenance the bare HTML is much simpler code to deal with which allows for faster development and faster changes. In addition, as structure is now separate from presentation, the integration of the HTML in the development process can proceed independently of the look and feel, i.e. before the final visual design has been signed off.

Benefit: Reaching a wider audience, happier users

As structure is now independent of presentation, the same content can potentially have a number of different presentation layers to suit different devices and different abilities of users:

  • PCs / laptops
  • Printers
  • PDAs/phones/other handheld devices
  • Braille and aural browsers.

Benefit: Accessibility Compliance, happier users (and a happier legal department)

Though web standards doesn’t equate to accessibility, it can get you much closer. Legal compliance and avoiding litigation may be the main motivation for accessibility for some organisations (something I’ll discuss in a later post). With web standards firmly in place, accessibility is a lot easier to integrate. Building accessibility in, rather than bolting it on is much easier and cheaper.

Kudos to AIB

Introducing web standards can be a long a difficult path, particularly for a big organisation with a large and complex website. In my experience, there’s an initial steep learning curve, but it’s definitely worth it. So, well done to anyone and everyone involved in the new AIB homepage.
Disclaimer: iQ Content did not work on the redesign of the AIB website. These opinions represent my opinion and not those of the IIA.

Tags: no tags

Comments

One Response to “Case Study: AIB & The Business Benefit of Web Standards”

  1. » Web standards could account for huge savings at AIB - iQ Blog on July 11th, 2008 10:10 am

    [...] design of the new page, I’ve done a quick case study on the potential benefits of AIB’s adopting web standards on the IIA blog. Hat tip to Michele Neylon whose post alerted me to the new AIB [...]

Leave a Reply