UK Government Website Experiment (24th May 2011)

In response to I like the new government look on Accessify Forum. The HTML, aesthetics and ‘direction’ of this new government website prototype is interesting. But the best of us already know the direction (it’s our day job) and many government websites started doing it years ago.

Background of the Project

With a short, agile, project like Alpha.gov.uk (we’ve had just over 10 weeks build-time with the full team in place) it’s all about setting direction, sketching out the product – even if all the bits don’t get coloured in – and about trying to make the right compromises.

Accessibility on the Alpha website’s blog.

Provides some useful context. A much more detailed “about the site” page provides many more interesting insights.

Information Architecture

It’s very web-friendly. How it will scale to encompass the whole of UK Government (even just the central bits) will remain to be seen.

The prototype will also test a new information architecture (IA) and a new open source-powered technology platform. It assumes people:

Mirroring the new information architecture is a single government brand to replace the myriad of different department and agency logos. The aim is to keep things as simple as possible.

About the Prototype.

In contrast, Direct.gov.uk basically ends up being a late-90’s portal site, with local pockets of navigation rather than a top-down IA. The difference is, these days you arrive directly at a relevant deep pages when searching from major a search engine. So that local navigation is all you usually need.

HTML Quibbles

Each person on the Government Ministors page page has this markup: 

<li>
<p class="minister-image"><a href="/government/ministers/parliamentary-under-secretary-of-state-legal-aid-a/">
<img src="http://assets0.alpha.gov.uk/government-assets/cache/85/af/85af1a82c719ace857fe0561de8523e7.jpg/b703eabcY.jpg" title="Jonathan Djanogly " alt="Jonathan Djanogly " width="135" height="135" />
</a>
</p>
<p class="minister-name">
<small>Jonathan Djanogly </small>
<a href="/government/ministers/parliamentary-under-secretary-of-state-legal-aid-a/">Parliamentary Under-Secretary of State for Courts Service and Legal Aid</a>
</p>
</li>

Oh dear. In fact, the Document Outline for most pages is kinda messed up due to how they are (and aren't) using heading elements.

All the lists are marked up as lists. Really, all of them. Nice to see that.

Javascript Required (in minor places)

Here’s a bit which requires Javascript and has no fallback: 

<p id="location-unset-message">
<span class="pin"><img title="Location icon (not set)" alt="Location not set" src="http://assets1.alpha.gov.uk/images/index/global-user-location-icon_unset-highlight.png/1a5af901Y.png"></span>
              Location not set. <a href="#" class="change-location">Set location</a> (<a href="#" class="explain-location">why?</a>)
            </p>

Text

The text size is enormous! I’m no designer but I have to side with Daz and say the aesthetics, even at the most basic level, could be much better. To me, the major areas of the page looks like a patchwork quilt. Good that they look separate but I can’t see an overall theme or style to them.

It is using CSS3 Web Fonts for all the text. Including the hand-written post-it notes about it being an experimental prototype.

Certain bits of link text will be meaningless if read out of context, or even if skim-reading. Clearest example is in the footer:

This site uses cookies. We have published a list and further information.

Hmm, that link text doesn’t include the word “cookies”. :|

Performance

Although they are using a memory cache system, they don’t have specific HTTP caching. So moving around the site seems to re-load certain images and landing pages every time. 

Age: 81
Content-Type: text/html; charset=utf-8
Date: Mon, 30 May 2011 18:22:09 GMT
Server: Apache
Status: 200 OK
Vary: Cookie
Via: 1.1 varnish
X-Varnish: 1438926293 1438925953
X-XSS-Protection: 0
Content-Length: 74838
Connection: keep-alive

200 OK

Most performance loss is due to network effects. That area needs to be optimised.

Competitors & Success

Some years ago I helped with the Department for Transport website and it’s still using the same system. Successfully. I just went back there and it remains miles ahead of the mainstream. Years after it was built.

New doesn’t mean better. We often forget that in IT. For example, remember the Clacksweb site we all sang the praises of around “March 2005”? Look at it now…and then View Source. Oh dear. Too often a new website is not as good as the one it replaced.

Good websites are the result of research, expertise, aesthetics and technical skill working together for the benefit of users. That way of doing things has been around for decades.

This new website one is currently quite far from being an exemplar of best practice in some respects, imho. Then again, it does remind everyone else that website can be done well, better than many others.