The message displayed to the user when the Sky+ HD box attempts to go into standby.

Note for foreign readers:  Sky, or BSkyB, is a provider of satellite television in the UK.  Their Sky+ HD receiver combines a satellite tuner with an Electronic Programme Guide (EPG) and Personal Video Recorder (PVR) functionality.  This particular box, made by Samsung, has been updated with the newest EPG software, which is exclusive to the high definition edition of their service.

While I applaud Sky for implementing a feature designed to reduce the power consumption of their boxes, this dialogue leaves much to be desired.

The first problem is the use of STB as an acronym.  Presumably this refers to “Set Top Box”, harping back to the days when the Sky Satellite Receiver sat on top of an old CRT Television “Set”.  My television is mounted on the wall, so the receiver clearly isn’t on top of it.  This wouldn’t necessarily be a problem if STB was a widely accepted and understood acronym, but it’s not.  It sounds like a term an engineer would use to describe the equipment, which is problematic in this, the most consumer of consumer electronic devices.  I have no doubt that my parents would be confused as to what “STB” referred to.

There is an air of uncertainty introduced by the wording of the instructions.  ”Press SELECT to continue” misleads the user.  The implication is that pressing SELECT will continue with putting the box into StandBy.  In fact, it does the opposite.  Whilst this is the least risky position to take (i.e. it would be worse for a user action to accidentally turn off the box as opposed to accidentally leaving it on), any benefit of this is lost through the confusion and uncertainty caused by the poor wording.

There is an easy fix to this:

Your Sky+ HD Receiver is about to go into StandBy mode to conserve power

Press SELECT to leave the receiver on

This particular dialogue, as well as the Auto StandBy feature in general, has been raised by a number of my less technologically experienced friends and family members.  They didn’t realise it could be turned off, and they didn’t know what to do when this confusing dialogue appears.  They also seemed to be confused as to when the receiver would go into Auto StandBy, it would be at different times on different days.

I know that Sky made a fairly big deal of this feature when it was launched, but obviously the pertinent information eluded those who needed it the most.

After giving it a bit of thought, it seemed obvious that the websites of newspapers would be a good place to start.  I chose newspaper sites for two reasons.  Firstly, they have a massive amount of content that’s being added to daily.  Secondly, they’ve had to make the move from one media to another, which makes it unlikely that they feel bound by the conventions of the old web.

What They Get Right

After looking through numerous newspaper websites, I’ve highlighted some aspects that I think work particularly well.  It’s certainly an interesting exercise just examining different sites that effectively serve the same purpose, just to get a handle on what they do differently.  Sometimes the differences between sites are more telling that the similarities.

Drawing Attention

Almost all of the sites I looked at for this article had areas on the front page that highlighted specific pieces of content.  This content is out of the normal flow of the content stream (i.e. arranged by date created) and is meant to draw the reader’s attention to a piece of content that the site editor deems interesting or important.

The Times Online has a featured area within the header

Each site takes a different approach to this.  The Times, for example, has a quote from an article along with a picture of the author in the banner alongside the logo.  Not only is this prime real estate, but the use of the author’s image will immediately draw a reader’s attention to that area (people are instinctively drawn towards faces, particularly eyes, when confronted with a lot of visual information).

The Sun's featured area uses bold text and images to draw attention (click to enlarge)

The Times’ approach is fairly unique.  A more popular technique, and one that is also used by the Times, is to utilise large photographs to draw reader’s attention.  The Sun takes a somewhat bolder approach more in keeping with their style and theme.

They’ve used strong, bold text set against images.  This style, right down to the typeface being used, mirrors the actual paper very closely.  The image to the left shows one of several featured areas that appear on the front page.  There are similar areas within each section, highlighting content from that category.

Some of the more conservative websites, for example the New York Times, use images alongside text to draw the user’s attention.

Branding

Taking the image from The Sun’s featured area above as an example, you can spot multiple ways the design brands itself as belonging to The Sun.  As I mentioned, the text and image combination is very similar to that of the paper, and is immediately recognisable as belonging to the most popular paper in the UK (I know).  They’ve also used their own logo when referring to a story they apparently broke.  All this branding in such a small space.

Whilst the on-site branding varies in quality and quantity between the sites, a common thread is the branding of associated services.  Most papers have associated job sites, especially the higher-end papers (The Times, The Guardian, The New York Times etc.) and continue consistent branding across to these sites.  This is important from a usability point of view as it allows any good will the user has towards the paper to carry over to the jobs listings.  In some cases, this is despite the fact that the job listings are actually managed by third parties (e.g. the New York Times uses Monster to manage their job listings, but pushes the NYT branding over the Monster branding – a strong brand in its own right).

Most of the sites also use consistent fonts, colours and wording to really hammer home a consistent brand identity.

Colour Cues

Given the amount of information generated by newspapers every day, organising that information is critical to the success of the site.  As part of this organisation, it’s important to ensure users feel comfortable and have some form of context.  If your user feels lost in the site, then it’s likely they’ll leave and go somewhere else rather than hunting around.  News provision is a very competitive space.

One technique that’s used by websites such as The Guardian’s and The Daily Mail’s is colour cues for various categories.  The approach of the two sites is broadly the same, using a colour to provide consistent formatting throughout that section as well as providing easily remembered and familiar entry points to the section.

Both The Guardian and The Daily Mail use the colour green to signify the Sport section

The image above shows the Sport section from The Guardian and The Daily Mail respectively.  Note that both papers have gone for the colour green to represent this section (no doubt to evoke feelings of the outside, grass, fields etc.).  Both sites use small colour cues to identify the section, some cues are subtle (note the .co.uk has changed to green on The Guardian’s page) whilst others are more overt.

A slight variation in the use of colour comes in the navigation bar.  The Guardian’s site constantly shows the colour and on mouse-over changes the background of the link to the section’s identifying colour and sets the text to white.  The Daily Mail’s site only displays the section’s colour when the user mouse-overs the link.  For the sake of consistency, and branding, I prefer The Guardian’s approach here, although I suspect the selection of such subtle colours was a tough job.  If The Daily Mail were to take the same approach, utilising their current palette, it would likely look messy and lack cohesion.

What They Get Wrong

I’ve picked up on some design aspects that I think some of the sites have failed at.  It may not be true of all the sites I looked at, but it is true for one specific site.

White Space

The front page of The Sun's site has no white space at all

I’ve inserted a picture of The Sun’s homepage above to demonstrate the complete lack of white space in the design.  They’ve picked a fixed width and then just crammed as much content into it as possible.  It’s as if they didn’t want to waste paper.  The effect is claustrophobic, chaotic and difficult to read.

Fortunately most other sites make far better use of white space and are the better for it.  The Times Online is particularly good in this regard.

Readability

Readability can be a tough thing to get right.  It combines so many factors, all of which need to be finely balanced for optimum performance.  Readability is a combination of the right type face, at the right size, with the right amount of space between lines, the right amount of space between paragraphs, the right amount of contrast between text and background, the right colours and the right width of paragraph.

Readability is also relatively hard to judge.  The average user won’t consciously notice whether a site is easy to read or not, they must just become tired while reading or leave the page because of uncomfortableness.

A comparison of readability on four newspaper sites

The image above takes some text of roughly the same size from four sites and compares them.  This text is actual size, using the actual colours.  The image is a PNG, composited of four PNG screenshots, so there should be minimal quality variation between what you see above, and the actual site.  Read each set of text through as quickly as you can.  Do you notice any differences?

Let me tell you my opinion.  The text on The Daily Mail and The Times is too small.  I find it uncomfortable reading the text, and looking at the respective sites, reading a whole article feels like a bit of a chore.  The Daily Mail compounds this by making their columns particularly wide, which is even more tiring on the eyes.  The relative spacing between paragraphs is too small on The Daily Mail and just about big enough on The Times.  It also looks like there’s a slightly larger differential between font size and line height on The Times over The Daily Mail, which helps The Times somewhat.

The Sun uses a refreshingly large font size but oddly for the web uses a serif font for the main body text.  The general consensus is that serif fonts work best in print while sans-serif fonts work best on screens.  Apart from the font, The Sun doesn’t give the text enough room to breath.  The line height it too short and there isn’t enough spacing between lines nor between paragraphs.  What you can’t see here, and what sets The Sun apart from the other sites here, is that the width of the paragraph increases drastically further down the page.  From approximately 400 pixels across to approximately 690 pixels across.  A 75% increase mid way through an article.  At this font size, or any other, 690 pixels is too wide for heavy reading.

I think The Guardian is the best of the bunch here.  There’s nice line height, nice paragraph spacing and it’s a fair width that remains constant down the page (unlike The Sun).  I think it could benefit from a slight increase in size, but I’m sure it’s an aesthetic decision rather than a readability decision to size it the way it is.

For the record, The Daily Mail is the worse here by some way, although they do get bonus points for copious use of images in-line with the text.

Natural Linking

One of the great benefits of the web over, say, newspapers, is that a content creator can link to other content in order to provide context, background information or a different viewpoint.  This linking is most effective and natural when it occurs in the body of the text.

Unfortunately, this is an underused technique on newspaper sites.  In fact, only The Guardian appears to use the links to any notable degree and even there it appears to be automatically generated based on certain category and content pages (for example it links to Manchester United, Premier League and Wayne Rooney but not mentions of previous results or news events).

Search…

I’ve found the search functionality to be uniformly awful across all these sites.  So much so that I’ve dedicated the entire next section to the topic.

Dissecting Search Results

It would be easy to dedicate an entire article to the way these sites handle searches.  Each one is subtly (or in some cases, vastly) different.  Each has positives and quirks.  To apply a fair test I came up with a test.  I will search each of these sites for the word “Manchester”.  I chose this search term for a couple of reasons.

Manchester is a city in the North of England.  It has two major football clubs (City and United) who both played English Premier League games on the day of the search.  ”Manchester” also appears in company names and person names.  This gives us quite a range of data that might possibly be returned for the search term, allowing a fair, balanced opinion of the results to be reached.  In particular, the term “Manchester” presents a certain challenge to search engines that attempt some form of semantic analysis of the term.  By this I’m referring to the sort of technique Google applies to certain searches, where it provides data to the searcher which is relevant but not necessarily part of the results set (e.g. search Google for “Weather in Manchester” and above any results Google will tell you what the weather is like in the city of Manchester.  It does this because it has semantically analysed the search term and determined that you want to know what the weather is like in the location “Manchester”).  Will the search functions attempt a semantic analysis of the term or will they perform a “dumb” text match?

So let’s go through each site one-by-one.

The Guardian

The Guardian provides numerous options for sorting and filtering search results.

The Guardian search did appear to perform some semantic analysis and displayed links to the two football clubs as the first two results.  The third result was for the Manchester International Festival.  It’s a promising start, and given the fairly generic search it makes sense to provide generic information first.

It seems that following these first three results are general text-match results from the various different categories.  Handily, there’s the option to filter results by category, date and change their order.  This is particularly useful as the remainder of the results don’t seem particularly well considered.

40% of the results are for the two football clubs, and only 1 is a local result

There are 10 results, not including the first three (which I feel are separate, and treated differently).  Out of these 40% (4 results) are relating to the two football clubs whilst only 10% (1 result) are what I would consider a local result (it was relating to an exhibition being held in Manchester).  The remainder are general news results that just happen to mention the word “Manchester”.

Somewhat baffling is the absence of colour cues on the search page.  Despite the remainder of the site using colours to identify different types of content (a practice I praised earlier), these colours are absent from these results.

If I were searching for the Football Clubs: I would be pleased.  The results themselves aren’t particularly good, today’s results are bizarrely absent for example, but the links provided right at the top of the results are very handy and would no doubt lead me to the information I wanted.  However, if I wanted to see the results at a glance it would require additional clicks which some might deem unnecessary.

If i were searching for local news: I would be disappointed.  Only one result on the first page contains any news that’s actually local to the area.  performing a regular search on this site for news in a particular area does not appear to be an efficient way to keep up with the news.

The Daily Mail

Similarly to The Guardian, The Daily Mail’s results offer numerous ways to filter, sort and refine the results.  I would hazard a guess that if a usability analysis were performed on these search results the “Sort By:  Most Recent” option would be used fairly often.  The results are ordered by “Relevance” by default, but the relevance seems to be calculated based on some sort of algorithm that doesn’t consider timeliness as a factor.  Rather, it must use something like the number of times a term is mentioned, or something similar, as a key attribute for sorting.  Hence, on the first page there are numerous articles about the Manchester Derbys (Manchester United against Manchester City) that occured earlier this year – presumably because the word “Manchester” gets numerous mentions.

This fails to consider that the date of the article is a key attribute when considering relevance when the domain you are searching is related to news.  Some of the news that gets returned is so old, I would hesitate to call it relevant at all to a search on a news site.

The results page features thumbnails, brief descriptions and colour coding.

I criticised The Guardian’s results for not carrying through the colour cues found elsewhere on the site.  This is where The Daily Mail gets it right.  Each result is accompanied by a thumbnail image (if available) along with a colour-coded label telling the user which category the result belongs to as well as a small indicator which displays the type of content (e.g. article, video).

The vast majority of results (85%) relate to the two football clubs

The first result in my search is a review of Manchester as a travel destination, which is interesting in itself.  For a news website to serve an article such as this as the first result, as opposed to any actual news, says much about the algorithm the site uses to prioritise stories.  It clearly doesn’t favour news items.

It does, however, appear to favour sports stories.  A whopping 85% of the first page’s results are related to the two football clubs.  Unfortunately, even if I were looking for news on either club I would be out of luck, as the most recent article is from the 29th of January, an age ago in sporting terms.

If I were searching for the Football Clubs: Whilst undoubtedly there is a heft of results to appease me, they simply aren’t up to date.  There’s no sign of today’s results and the search function hasn’t given me a link to a page covering specifically either club, even though I know such a page exists and can be reached from elsewhere.

If I were searching for local news: This also suffers from the timeliness issue.  There is local news here, but it’s very old.  For example, one of the results refers to the possible building of a “super casino” in Manchester, a plan that’s since been cancelled.  This result would be forgivable, were it not so high in the results (5th!).

Switching the order to show the most recent results, rather than the completely misjudged “most relevant”, favours sports results so heavily (18 out of 20 results are for sport) that any local news is completely drowned out.

The Times

No search results are visible above the fold on my browser

The Times’ search results page loses points with me immediately for not actually showing any results above the fold (i.e. without scrolling the page down, I can’t seen any results).  I may be on a relatively small screen, but it’s the only site which takes this approach.  The image to the right demonstrates what I see upon the page loading.

Having said that, the bottom item on the page, under “Times Recommends” is related to my search term.  It points to an external site (which is branded to appear as if it’s on the Times’ main site) and provides a summary of a company.  This is the search function identifying the company name as partially matching my search term and giving me a result.  The line immediately below the fold points to a page for “Manchester United”.  There is an odd quirk in the results.  The search function has identified, and given a link to the Manchester United page but not the Manchester City page, yet the first three results all relate to Manchester City.

The Times provides a list of keywords to assist the user in narrowing down the search results. Some are helpful, some are not.

Options are provided for filtering the results and for re-ordering them.  Curiously there’s also an option to search in the “archive”, but no explanation is given as to what this actually means, rendering it useless in any practical sense (at what point does an article enter the archive?  Is it still archived if it’s popular? Can I search archived and non-archived articles together?).

All the results were related to sport.

Following the trend set by The Daily Mail, the results are heavily weighted in favour of sporting  news and also fairly out of date.  Once again this comes down to the default sort order of relevance, and the failure of the designers to understand what’s actually relevant to people searching the site.  It’s highly unlikely to the point of being ridiculous that the result I think, as a user, as most relevant to my search for “Manchester” is the result of a football match played a fortnight ago.

And when I say “heavily weighted”, I really mean heavily weighted.  Every single one of the results were relating to sport, and every single one was out of date.

If I were searching for the Football Clubs: Yes, there were a lot of results for the clubs, Manchester City especially, they were all out of date.  Again, none of today’s results were shown.  There were also no links to generic club pages, even though they exist.

If I were searching for local news: Hugely disappointing.  There is news relating to the Manchester area on the site, I’ve seen it, but the search function doesn’t seem capable of finding it and presenting it to the user in an effective manner.

The Sun

The Sun’s search mechanism differs from the other sites as it is branded as being performed, or at least enhanced, by a third party.  In this case Google.  I’m not clear what this means, as the results don’t share any visual similarities with Google’s normal results.  The results also differ to those seen by doing a “site:thesun.co.uk manchester” search on google.co.uk.

Unlike The Times and The Daily Mail results, The Sun’s are ordered by date by default.  Does this provide any real benefit?  Possibly.  Unfortunately it’s hard to measure any possible benefit as the latest articles appear to be missing from the results.  For example, there are results covering the build-up to today’s football matches but not any match reports or even the results.

The results page's height is dictated by the uselessly long list of categories. (click to enlarge)

There are some usability issues with the search results as well.  Like The Times, The Sun provides some categories to assist the user with refining their search.  However this list is very very long.  This causes two problems.  The first being that the sheer number of options reduces the usefulness of this feature fairly dramatically.  I count 99 categories, some of which seem wholly unrelated to the search term.  Additionally, some that are highly related to the search term, e.g. Manchester United, have very few results (“Manchester United” appears to have only 3 results.  In contrast “Scottish News” has 93).  This points to a fairly fundamental failure with either the categorisation system, the search system or the content cataloguing guidelines.  In short, extremely poor Information Architecture.

The other problem created by this list is that there’s a very large gap between the bottom of the search results and the links for moving on to the next page.  I’ve labelled this the “Void of Uncertainty” on the image to the right.  On my, allbeit smallish, monitor, I can’t see the links pointing to the next page at all when I’ve viewing the last search result.  The white space is the height of my browser’s viewport.  I would imagine many users get lost at the bottom of the first page of results, believing wrongly that there are no more (I’d love to see usage statistics for this results page, I bet they’d be very telling).

Nine out of ten of the results are to do with sport

By this point, it won’t be any surprise to learn that the results are sport-heavy.  Nine out of the ten results are to do with sport.  The odd one out is actually a bit of celebrity gossip, which I’ve classified as “local” because it occurred in the area, but it’s a bit of a stretch if I’m honest.

If I were searching for the Football Clubs: In terms of actual results, probably the best of the bunch so far.  There’s still no sign of today’s results on the first page, but at least the articles are more up-to-date than the others.  It would greatly benefit from having links to the pages for the relevant clubs placed more prominently though.

If I were searching for local news: Nothing of use, really.

Search Takeaway

If I’m honest, I found the results of this little experiment a little depressing.  It seems as if a minimal amount of thought has gone into designing the search functions on these sites.  They’ve looked at other search functions and produced a tick-box feature list that they’ve then implemented.

Unfortunately it appears they’ve failed to correctly identify and understand the context of the information on their own sites.  They certainly don’t appear to understand what makes an article “relevant”, and that belies a certain lack of research and thought.  As I mentioned earlier, if they think the most relevant result for a user searching the term “Manchester” today is the result from a football match that finished a few weeks ago, they are severely misguided.

The search functions also seem unable to recognise the best landing pages to send users to.  As I alluded to in the introduction to this section, the term “Manchester” presented the opportunity to the sites to understand the search and direct me to specialised landing pages for topics like Manchester United and Manchester the location.  This rarely happened.

The search term did present a challenge though.  If the sites weighted their results purely based on chronology, they would only be showing sports results on a day like today.  Therefore, a touch of craft and guile is required when ordering them for the user.  What I found really odd is that almost all the sites did have a heavy sport weighting, but the results just weren’t up to date.  The curse of irrelevance striking again.

There are a few consistent options that seem to reappear between sites.  For example, most paper sites cover a number of publications.  Each site offers the ability to narrow down the results by publication.  This feature would only be of use in two circumstances.  Where a user had read something in a particular paper and then sought it online or where the publications offered different types of articles, in which case the filter acts as a further category filter.  I don’t think either situation is particularly likely.  The most egregious examples of these useless separations were where the search function distinguished between the website and the paper (The Guardian or guardian.co.uk, The Times or The Times Online? What’s the difference to me,  a normal user?).

The best performer in terms of search results was The Guardian.  The results were ordered by date rather than some ineffective relevance by default, which left them sport-heavy, but it identified some appropriate landing pages for me.  It also suggested some refinements in a more natural way than the other sites (although in the case of my search term, they weren’t particularly appropriate).

Conclusion

I set out to seek inspiration and best practice for a WordPress theme I’m working on, and I found just that.  Some of these sites have some really nice touches, whilst others have taught me valuable lessons on how not to do things.

It’s unfortunate that in many ways we seem to be in the same position we were ten years ago with certain aspects of these sites (e.g. search), and I’d have to question how much research had gone in to each design before hand.

For my money the best sites are The Times and The Guardian.  I like their aesthetics, their readability and their information architecture, and I’ll attempt to build my theme in a similar vein.  I’m also tempted to dig a little further into these sites to extract more information on certain aspects, like article design and homepage design, rather than the high level review I’ve performed here.  I think it might also be an interesting and worthwhile exercise to compare the paper’s online presence to their publication.

What’s your favourite newspaper, and what makes it so good?  Do you use any of the sites mentioned in this article?  if so, what do you think?  Let us know in the comments.

Understanding your Audience

The BBC is about as mainstream as UK websites get. For some, it represents the entire internet (I know people who only visit the BBC site) in the same way the big blue e on their computer represents the internet. It’s important to remember this when considering a redesign of a site, and targetting the audience is one of the most critical aspects.

The BBC’s audience is typically resistant to change. The criticism levelled at the BBC for what I thought was a fairly decent home page redesign demonstrates this. And to bring it a little closer to the subject of this post, the barrage of complaints following the redesign of the weather maps was remarkable.

Given the relative lack of internet (and technological) experience these users exhibit, resistance to change is to be expected. To fully understand this, the significant effort involved in learning anything new has to be considered.

Timing is Everything

The above is an introduction to some of the challenges the BBC faced when considering this redesign. To counter this, the BBC went with a soft-launch, making the redesign optional to those users who wanted it. Those early adopters who were comfortable enough to experiment with new features and an unfamiliar design. This week, however, they fully rolled out the redesign, removing the old look all together.

Timing is an underrated aspect of usability. A user’s satisfaction with a redesign is directly proportionate to the amount of comfort they feel using it. e.g. how easy is it to perform set tasks, how much feedback is there, how many mistakes to the make etc. Comfortableness comes from the stress that a user feels whilst experiencing the design for the first time. Understanding this relationship is key to a successful design.

Comfort does not come from needing vital information quickly and finding that you have to learn a new interface.

I don’t blame the BBC for launching a new weather design during the worst week of weather for years, after all, plans are made far in advance of roll out dates. However, I do think they could have either extended the soft release, or offered an alternative version should users require it.

Starting off on the Wrong Foot?

The key bit of information regarding weather is the location. You have to be able to quickly identify and provide your location, and it should be as easy as possible. The image to the left is the result of performing a search for “Bristol”. As you can see, it’s giving four results, any of which could be the actual Bristol. The Bristol I’m looking for is both close to Bath and close to Avonmouth. It’s also in the United Kingdom and may possibly be so good the BBC decided to name it twice.

So which Bristol is it? You get similar problems when doing less specific searches, say for Cornwall. It seems as if you have to know the postcode to get an accurate result. Requiring common information in a specific format does not a happy user experience make. And we all know how important search is on sites with less experienced users.

Re-Opening Old Wounds

When the BBC redesigned the weather maps, I really didn’t like them. Since then, they’ve been tweaked and updated, and I still don’t like them and they are carried over into this redesign. The image to the right contains the much used small icons that represent weather conditions. It’s very difficult to tell at first glance what the portrayed weather condition is unless the conditions are extreme or greatly contrasting.

This problem isn’t limited to the small icons either. Take a look at the image to the left (click to enlarge), which is the main weather map that dominates the centre of the page. Can you tell, from looking at this image, what the weather in the area is going to be? I can’t, unless desaturated is now a type of weather condition and I missed the relevant memo. Looking further at this image and you’ll see a slider at the bottom of the map. What do you think moving the slider to the right will do? Will it zoom in, reposition the map, advance time? Who knows, there’s no label and no tool-tip.

Customisation, but not too much Customisation

As is the trend for redesigned BBC pages, the weather site offers some customisation options. The page is split up into different sections, each of which can me expanded or contacted using a small arrow at the top of the section.

That’s all well and good, but it doesn’t go far enough. There’s some information I don’t need or want to see. And there’s some information that I want to have more prominence, but alas the content boxes aren’t movable – this is a feature we’ve come to expect of pages like this and is something the BBC does elsewhere on the site.

Introductions

The introductory panel does an adequate job of describing the features available. However, even this isn’t perfect. Some of the phrasing is confusing, and leads less experienced users to believe they need to typing into a section heading (the orange “Search” box).

This information is also static, in that the instructions remain after you’ve followed them. This can be particularly confusing when typing a location, as the intro box still tells you to type a location even after you’ve just provided one. To exacerbate matters, the intro box appears above the fold where the actual forecast appears below the fold. The net result is that the feedback given to the user after entering a location suggests that nothing has happened. If this can confuse an experienced internet user such as myself, the less experienced internet users that frequent the BBC’s website have no chance. This intro box has to be manually cleared by the user before it disappears.

A quick browse through the links on the page also reveals that many of the help pages are yet to be updated. They seem to be suggesting that the site is still in beta, and only displayed to users who requested it.

Praise where Praise is Due

So far, this has been a fairly negative review. To me, the new weather site feels like death by a thousand paper cuts. It’s not terrible, but there are enough small annoyances to make it an unpleasant user experience. However, there are some things the BBC get right.

The integration of forecast videos is a nice touch, and the hint that there will be customisations available is promising. The BBC have also been very noble in including links to other sites, almost in acceptance of the fact that they get things wrong.

The summary feature is particularly nice, but should be given more prominence on the page. It would be a great way to introduce the page. A suggested improvement to this “plain English” interpretation of the forecast would be to make it relevant to the current / previous day’s weather. For example, tomorrow is going to be warmer than today. There are iPhone apps that do this, and it really does allow you to get a firm grasp on the weather very quickly.

Try out the new weather pages and read the documentation.  What do you think?  Better, or worse?

So what happens when a new site, like Natuba, gets criticised on TechCrunch for missing features thar it actually has?  Surely the interface designer starts kicking themself?  You’ll notice that there have been a couple of updates made to the TechCrunch article since it was originally published.  This is to clear up that most of the functionality Mark Hendrickson bemoaned as being missing, is actually there.  While it’s admirale for TechCrunch to go back and make the changes, the ship had already sailed.  The majority of readers, who no doubt use RSS, would have read the un-amended article.

This should really be a lesson to anyone launching, designing or thinking about launching a new web service.  Having the functionality isn’t enough, it has to be findable, obvious and easy to use.  Submitting a site to something like TechCrunch is like a usability test distilled.  The TechCrunch bloggers get to spend very little time looking at a site, having to go through many every day.  They are also very specific users.  At the cutting edge and used to web services.  They represent their readers, who you would have to say fall into the same ilk.  Tech savvy with little time on their hands.  The TechCrunch bloggers, and by extension their readers, simply don’t have the time to go and learn a new interface.

The remaining question is, how much did the original posting hurt Natuba?  Personally, the original posting won’t hurt as much as the visitors it will lose because of the poor interface design.

The Write Post Window

For most bloggers, this is the screen they see the most of.  So it has to be perfect.  Unfortunately, it’s not.  Oe of the major problems I have is that when using the visual editor, pressing return moves the screen position back to the top.  This appears to be a FireFox (3 Beta) issue, but is annoying nonetheless and should have been picked up in testing.

There are, however, some other strange choices that have been made.  To my mind, the logical flow of the page has been broken.  Previously, the right hand side of the screen contained fields for setting categories, something that you need to remember to do.  having it right there, visible all the time you were writing the post, above the fold, really aided me.  I’ve put two screen shots below.  The first image is of the write page in WordPress 2.3 where the second image is of the write page in WordPress 2.5.

The main difference here is that in 2.5 it’s possible to write and publish an image without ever being made aware of the category options.  It’s below the fold.  In 2.3, you knew it was there.  The strange thing is that the post status has been given prime position, yet I can’t really see any good reason for it.  Personally, and I’m sure a lot of bloggers are the same, I’ve never manually changed the post status.  I just let WordPress update it for me at the point of publishing.  Upon closer inspection, this form is actually quite confusing.  If I change the status to “Published” and then click on “Save” is the post published?  What if I change the status to “Unpublished” and then click on “Publish”?  Confusing?  Contradictory?  Misleading?  Yes.

Also gone is the ability to manually re-order elements of the write page and the list of drafts that used to adorn the page.  The missing drafts has had a particularly big impact on the way I navigate WordPress.  Previously, I’d head to the write page regardless of whether I was starting a new post or continuing a draft one.  This worked because the page was accessible from any other page in the admin area.  To edit a draft post, from anywhere in the dashboard, it was a maximum of two clicks (providing it was a relatively new draft).  One to get to the write page, one to select the draft.  Now it’s three.  One to get to the write page, one to view the list of drafts (from the “related” links on the right hand side) and then a third to select the actual draft.  While it’s true that the list of drafts is on the dashboard, it’s not logical to go to my dashboard when I want to write a post.  I’m going to go to the write link.

Confusing Terminology

An often overlooked aspect of usability is the labeling and identification of options.  Functionality needs to be labelled clearly and concisely, and the label should be an accurate description of what will happen when the functionality is invoked.  Language is a crucial part of usability.

When it comes to HCI (Human – Computer Interaction) metaphors are often used in place of written descriptions.  Visual metaphors are very difficult to get right.  So where does WordPress 2.5 go wrong?

One of the much promoted aspects of the redesigned admin interface is the media browser.  There has, in general, been a bit of a mixed reaction to it.  Looking at it from a usability point of view, certain aspects can be seen as confusing and counter intuitive.  To start with, there are two buttons labelled very similarly but which perform different functions.  There’s an “Add Image” button and an “Insert/Edit Image” button.  It’s really not clear what the difference, if any, is between these two options.  Combine this with the fact that the new “Add Image” button uses a particularly poor visual metaphor (is it a table, or a square?), and you have a recipe for confusion.  There is a similar situation with the more generic “Media” options.

The two buttons actuallt share functionality for inserting images into posts.  Both allow you to add images from external sites, but only one allows you to upload images.  Can you guess which one purely from the buttons and descriptions?  I didn’t think so.

There’s also some strange terminology used in the new widget interface.  This part of the WordPress admin area was in desperate need of a revamp.  The old version fell over if you had more than a couple of sidebars.  However, the new implementation isn’t much better.  The old drag and drop interface has been replaced with a more procedural implementation.  You first select which widetised area you wish to edit, and then add, remove or change widgets within that area.

Something that initially threw me, and probably many other people, is the “Show” button.  If you select a Widgetised area from a drop down, and then click a “Show” button next to it, what would you expect to happen?  Would your expectations change if this was the first time using the theme and hadn’t previously set up any widgets?  Probably.  There are, realistically, three possible outcomes from clicking this button.  You could be shown the area in your theme that contains the widget functionality.  “Show me Widget area 1″.  You could preview any changes you’ve made to the widgetised area.  “Show me the updated widgetised area 1″.  Or you could be shown a list of widgets currently assigned to the area.  “Show me the admin view of Widget area 1″.  Out of the three, given the layout and wording used in the form, the first option seems the most likely.  And to less experienced users, this is probably something they would want to see.  The action result is the third one listed.  But, if there are three possible outcomes, all of which are completely reasonable, the interface is too imprecise.  Especially for inexperienced users.

Navigation and Screen Flow

One of the most striking differences, conceptually if not visually, is the separation and re-classification of links.  There are now eleven permanent links dotted around the header in the admin section.  These have been seperated into four groups.  The top left has links for viewing the dashboard or the site.  Bottom left has links to Write, Manage, Design and Comments.  Top right has links to your user Profile, a link to Log Out, a link to the Codex (labelled as “Help”) and a link to the Support Forums.  The bottom right has links to Plugins, Settings and Users.

When you have links such as these, the language used to describe them is vitally important.  And I don’t think the WordPress team have got it quite right.  There are too many links that could reasonably do the same thing.  For example, the “Manage” link is far too vague and could refer to almost anything.  Anything that appears in the Settings, or for that matter the Design, section, could logically be placed in behind the “Manage” link.  You are, after all, managing your blog.  Even after a few weeks using this interface, I’m not confident in finding a certain piece of functionality.  I don’t really know behind which door it resides.

The Media Browser

I briefly touched on the Media Browser earlier, concentrating on the write page.  This time I want to touch on the actuala act of uploading images and inserting them into a post.  It seems woefully inconsistent.  Some times I can upload an image and am given the option to insert in into the post there and then.  Other times I can only save changes to the image, meaning I have to locate the image in the library, select it, and then insert it.  I can’t see any logical reason for this differing behaviour.

Summary

Overall, I actually think the new admin interface is a huge improvement.  Issues such as those pointed out above will be more obvious in a situation where you are revamping an exisiting interface, and it wasn’t an easy job.  There were, however, some simple improvements that could have been made to ease user’s transitions to the new interface.

I’ll return to this subject later in the week and point out what the new WordPress does well.  In the meantime, what do you think?  Have any of the issues above changed your approach to WordPress?  Do you disagree?  Let us know in the comments.

I parked up my car yesterday and for some reason left the steering on “full lock” (i.e. the steering wheel was turned all the way in one direction). Not something I usually do, but I’m glad I did on this occasion.  As i was returning to my car I noticed some uneven wear on the front tyres.  On further investigation, it seems the inside shoulder of the tyre had worn to point where the wire supporting the side-wall was exposed.  So, I needed to replace the tyres promptly.

Unfortunately, yesterday was Saturday and I didn’t notice the excessive wear until fairly late in the evening.  No where was open.  So I hit the net to see what was open today (Sunday) and get a rough idea of the cost.  I know that within a couple of miles there’s a Kwik-Fit, an ATS Euromaster and a National Tyre centre.  So I Google’d their respective websites looking for three things:

1. What hours, if any, are they open on Sunday
2. Do they stock the tyres I need, and are they in stock at the branch
3. How much will it cost

Nothing spectacular, and information you would reasonably expect to find on the website’s of national garages.  So how did the fare?

ATS Euromaster

The ATS Euromaster website was, by far, the most useless.  There are so many problems with this website, it’s difficult to know where to start.  The first problem I came across was trying to locate my local branch.

The image to the right shows two versions of the same “button”.  The one on the top is how this appears on the ATS Euromaster homepage.  The one below is the same button with the clickable areas highlighted.  Can you see the problem?  Even though the entire graphic looks clickable, only the actual text is.  To compound this, the graphic has an arrow surrounded by a circle, usually an indication that clicking on that shape will progress the user through to the next step.  It doesn’t.  Suffice to say I clicked the button, and nothing happened.  Not a good start.

Once I found the branch locator, and used to find my nearest branch, I came across my next problem.  While I can see the branch, there’s no opening times.  There is a (generic to all branches) email address, and a phone number, but it’s 21:00 on a Saturday.  I won’t get a response.  I just want to know if the branch is open or not.  Going hand in hand with this massive omission is the fact that, once again, the title of the branch looks clickable (see the image to the left, click to enlarge).  Of course, it’s not.

As you can tell, this website is failing on some fundamental aspects of usability.  So how does it do with my next test, finding a tyre?  I headed to the “Retail” section of the website and looked for a tyre search feature.  And continued looking.  The image to the right is the “Our Tyre Services” section of the Retail page.  Apparently, they don’t do tyre replacement or tyre fitting.  All I could really do is head to the Tyre Brands link.  This really didn’t help.  I know I’ve got Bridgestone Potenza tyres currently on the car, but Bridgestone aren’t listed.  I also know that Pirelli do tyres in the right size in their “P-Zero” range, so I hit Pirelli.  What I got shocked me, even given the complete failure of this website to meet my expectations up to this point, it still shocked me.  The Pirelli page contains a brief history of Pirelli and a list of Pirelli ranges they sell.  This list isn’t clickable, so I can’t tell what sizes they stock, and there’s no prices.  There isn’t even a link to the Pirelli website so I can look up the sizes each range covers.  If I didn’t already have the knowledge I have, there would be no way for me to accurately choose a tyre manufacturer for my model of car, and no way to choose a range within that manufacturer.  This is, for all intensive purposes, a completely useless web page.

I have to say, in all honesty, I think this is the worse website I’ve ever had the misfortune to come across.  i set out with three goals, they weren’t unreasonable, any reasonable person would expect the information to be readily available on the website.  The usability failures are so glaring, from the fairly minor (like inconsistent link indication) to the unforgiveable (a complete absence of information), that one has to question the benefit of the website.  I certainly could have found my local branch through either Google Maps or Yell.com, and the ATS website didn’t provide any information above and beyond this.

National Tyre Centre

My next step was National.  And wow, what a difference.  Right there, in prominent position on the home page is functionality to search for tyres by size, by car registration number and to find a branch.  So the first test, is my local branch open?

I found my local branch quickly by entering my post code (although the inability input an area as opposed to a post code is a fairly serious omission).  Unfortunately, for Sunday opening times I had to ring the branch, which of course would be closed.  Not particularly helpful.  I was also intrigued by the “Select this Branch” option.  So I clicked it to see what would happen.  The next page displayed a photo of the branch and a message indicating I had now set this to be my default branch.  The page had a list of services available at the branch but, the list wasn’t a list of links.  It also never really explained what setting my default branch actually meant.  Are the quotes now tailored to this branch?  Am I only going to see products available at this branch?  Who knows!

The next step (even though I don’t know if the branch is open or not when I want to go) is finding and pricing tyres.  Looking at the menu across the top of the page the most logical place to start would be “products”, so I choose it and am presented with seven cartoon characters.  Each representing a different service.  Now, I have nothing against branding, but this is a poor way to navigate through a site.  Using visual metaphors is fine, but they are very difficult to get right.  In this case, it’s a bad decision.  Each character represents a car part, and while most people know what a tyre looks like, it’s not so clear cut when you start looking at oil changes, suspension components and brakes.  There’s also a bit of confusion between car and bike tyres.  The bike tyres are represented by the tyre character wearing a helmet, which could just as easily represent high performance or racing car tyres.  Fortunately, there’s some text links down the right hand side (which eye tracking studies seem to suggest will be missed by many users).

Clicking the “Tyres” link doesn’t necessarily do what you expect it to do.  Instead of allowing you to find a tyre, it takes you to a page that gives you advice about tyres, when to replace them and such like.  Bizarrley there’s no way to actually find a tyre.  You can select a manufacturer, which lists the types of tyres they supply, but that’s about it.  Even when viewing the list of tyres, you can’t select a particular model to see what sizes are supported.  There’s also a rating, which appears to be an arbitrary number out of five, with no explanation of it’s meaing, or whether high or low ratings are better.  Pretty useless really.  But at least there’s more information available than ATS.

Now I know there’s a facility available to search for a tyre, I saw it before.  But in order to search for a tyre, I have to leave the tyre section and go back to the home page.  Backwards logic.  Fortunately there are a number of options to find a tyre.  My car, I know, has optional wheels on it, so using the car or registration search won’t work, I need to manually enter the size.  This is actually quite well designed.  The image of a tyre is colour co-ordinated so that you know where to read the dimensions from your current tyres.  A good idea.  It is a bit risky, however, as the speed rating is located after the size on my tyres, not where the image indicates.  I entered my dimensions, search, and I get five results.

The image to the right is an example of one of the tyres returned.  You’ll notice that there’s a rating assinged to the tyre, which now seems to be above 5, which I assumed was the upper limit for the ratings on the other page.  Presumably, either they are using two different rating systems or there weren’t any tyres rated above 5 on the other page.  I think the second choice is unlikely, as I was looking at reasonably expensive, performance orientated tyres.  The other thing that I noticed was that there’s a small “i” next to the fitment.  To me, this means information and, seeing as fitment isn’t something I am familiar with (and therefore I can assume most people won’t be aware of), I assumed that clicking the “i” will provide more information.  It doesn’t.  The only purpose it serves is to cause confusion.

The National website is much, much better than the ATS site.  While it has its problems, they aren’t in the same league as those with ATS.  Some usability focused testing, and navigation analysis could really improve the site significantly.

Kwik-Fit

The third large chain I knew was close by is Kwik-Fit.  Upon loading the site there is an immediate feeling of class.  Aesthetically, the site blows the other two out of the water.  While it’s not ground breaking, and it’s not going to win any awards, in this company it’s Kiera Knightly to the others Anne Widdecombe.  Not even close.  The five most prominent links are the ones you would be looking for when visiting a site like this.  It’s unfortunate they chose to put these links down the right as opposed to the left, but they are visually obvious enough to get around this.

Upon choosing “Locate a Centre” something slightly strange happens.  You are taken to the page with the search form, but you also gain a new tool bar across the top of the page.  This isn’t present on the home page.  I’m very much of the view that navigation such as this, global navigation, should be just that, global.  When a visitor enters the site, they immediately have a problem to solve, “how do I complete the task”.  By changing your navigation part way through the site, you force the user to solve this problem twice.  The site does do a good job when you want to search for a branch.  You can search by street, town/city or post code.  If you’re a tyre centre, I see the ability search by location rather than just post code as key.  There are many occasions where you urgently need their services, but you may not know the post code of your current location, it’s not always easy to get hold of this information.  However, you almost always know the town you are in.  Another thing this page gets very right is a brief summary of the typical opening hours of their branches.  I can instantly see that most branches are open on Sundays.  Great.

So to find my nearest branch, I type in my city name and click “Locate a centre”.  Nothing happens.  So I click it again.  Nothing.  The page is definitely loading, my browser is telling me that, but I can’t seen any results, nor can I see any error messages.  I’ve seen problems like this before, and it usually comes down to the browser I’m using.  It is a beta version of FireFox after all.  So I try it in Safari.  It is at this point the problem becomes evident.  The results are loaded below the search form!  In FireFox, at my screen resolution, there’s absolutely no indication above the fold that the search as been performed and I need to scroll down to see the results.  In Safari, which allows for a slightly bigger canvas, I can see one line under the search form.  After performing the search, this line reads:

Your results are shown below.

So the results are there, but the website didn’t want to tell me about them in any meaningful way.  Luckily the centre is returned and there are some handy links next to it.  I can instantly see that the opening times are available, and I can tell that it’s an MOT centre.  There’s also the option to plot directions to and from the centre and show it on a map.  To me, the key is the opening hours.  So I click the link and I can see that it’s open 10 – 4 on Sundays.  Out of three major websites for national, if not international companies, why does only one have this information?

So now I know it’s open, I can go and find some tyres.  Choosing the “Tyres” link in the new menu bar I am taken to a screen with three tyre search options.  Search by Car Registration, Search by Car Make and Model and Search by Size.  The most complete and sensible options so far.  I know the size, so I try and search on size.  The form is very similar to that found on the National site, but they’ve implemented it slightly differently.  Instead of colour coding the fields to the tyre image, they highlight the area on the tyre that you need to be reading.  Very slick.  The only slight problem I have with this approach is that it doesn’t let you know before hand that you’re going to get any help with finding these values.  This may put off some users who aren’t confident enough to try the form.  Ideally, a hybrid of this and the National approach would be best.

The search results are fairly straight forward.  It lists the tyres available in that size with a brief description of them and the price.  Any offers specific to those tyres are also clearly indicated.  Once you’ve chosen the tyre you want, you can select a quantity and get a quote.  Unfortunately the quote is a PDF document you have to print, which is a pain.  There are also some hidden extras, such as balancing, valce replacement and fitting, which aren’t clear on the tyre search results.  This is a bit deceptive but I guess you can buy just the tyre for the price quoted.  I’d still like to see some form of warning that the price will increase.  i couldn’t clearly see whether the tyre I had chosen was in stock in the local branch.

The Kwik Fit website seems better thought out than the others.  I doubt they’ve done and usability focused testing, otherwise some of the points I’ve highlighted above would have been shown up, but it seems as if it’s at least been considered.  The result is a site that’s more usable than the others, contains more useful information than the others, and is more aestheticaly pleasing than the others.

Summary

Buying tyres is something most people have to put up with.  It’s not a pleasant experience, and is often expensive (it cost me £300 for two) and confusing.  The websites of garages that provide tyre services should be tailoured to low-experience internet users and clearly thought out.  They should be goal orientated.  You don’t go to one of these sites for entertainment.  You go there because you need something.  The sites should be fully focused on meeting those needs.  I’m sure there are people out there who have other needs than mine, but I’d be willing to bet that the vast majority of users will have the same goals as me.  They want to find a branch, see if it’s open and get the cost of tyres )or exhausts, or brakes etc.).  The fact that two of these websites fail these most basic of needs is pretty damning.  When you consider many of the users aren’t experienced in the internet, these aren’t tech sites after all, the need to simplify and guide is foremost.  The ATS website especially is awfull in that regard, and even I, as an experienced internet user and someone who builds websites, found it impossible to find the information I required.

Probably the biggest endorsement I can give is that the £300 I spent on tyres went to Kwik-Fit.  The only company that could tell me that the branch was open, and give me a price on tyres.  I wonder how many times ATS Euromaster and National have lost out on business because of their badly conceived and implemented web presence?

Tyre photo by Eric Castro.

At this point, it’s important to note that I primarily go to the WordPress Codex as a theme developer, so as far as I’m concerned, its success will be judged on how well it helps me find the information I’m looking for. This is mostly template tags. Essentially, I approach the codex in one of two ways. I’m either trying to do something so I’m looking for a template tag to do it – or – I have a template tag and I want to tweak it’s implementation (i.e. I want to see what parameters I can pass to it, and what the outcome will be). Two different approaches, but the outcome should be the same. I should end up at the page relating to the template tag. Unfortunately, finding content in the Codex is hit and miss, to say the least.

Let’s use an example. I’ve been exploring the use of post excerpts for category pages as a way to reduce duplicate content, something Google isn’t keen on by all accounts. I know the template tag for excerpts, “the_excerpt“, but I wanted to see what else I could do with it. So I searched for “the_excerpt”. You would expect, quite reasonably, that the template tag page for the_excerpt would come out on top. it doesn’t. In fact, it doesn’t even appear on the first page. This isn’t an isolated problem either. A search for a whole host of template tags simply doesn’t return the expected results.

So that covers searching for a specific template tag. But what if you want to figure out how to do something? Well a search for “display post excerpt” turns up similarly useless results. So the WordPress Codex search fails, fairly miserably, at both tasks I would use it for. The strange thing about this is that WordPress outsourced the search functionality to Yahoo. They proudly display this fact at the bottom of the useless search results.

Work Arounds

It’s unfortunate that the search is so bad you have to use work arounds, but unfortunately that’s the situation I find myself in. By far the quickest way to find the page relating to a template tag, such as the_excerpt, is to go to the template tags page. From here you can find pretty much all the template tags you need. The other work around is to use Google and the “site” operator. Just prepend your query with “site:codex.wordpress.org” and Google will search just the WordPress Codex. While even this can be a bit hit and miss, it much more accurate and useful than the default Yahoo search.

Does anyone else have this problem?

Below I’ve listed some key points that bloggers should consider when designing, or redesigning their blog. I should point out that I take a holistic view of usability, which is something many so-called usability consultants don’t agree with. I guess this puts me firmly in the “user experience” camp but I fail to see the difference between the aim of the two approaches.

So what areas should blog design concentrate on when thinking about usability?

Is the Purpose Obvious?

Most blogs have a purpose. Whether it’s to get across a point of view, promote a product or service or cover the latest news, every single one has a purpose. It’s key to convey this purpose to your readership, especially if that purpose relates to an action you want the reader to take. In these cases, the blog becomes an extended sales page, and so should contain many of the same elements. It’s probably best if I give an example.

I stumbled across a blog called Scribe Fire earlier. It’s a fairly nice looking blog, very clean and easy to read. Upon looking at the front page it’s obvious that the blog is for a product called Scribe Fire. That’s all well and good, lots of software products have blogs these days. What makes this blog different is that the purpose of the product isn’t stated anywhere. I defy anyone to explain to me what Scribe Fire is from reading the first page of the blog. You can see some recent changes and features, and I know what the latest version is, but I don’t know what it actually does. This is a bit of an oversight by the designer and is compounded by two things. Firstly, this is the landing page of the www.scribefire.com domain. This isn’t a blog linked to from the “main” site, as many product suppliers do, if someone hears Scribe Fire they will end up here. Secondly, there aren’t any clearly worded links that would point to the purpose of this piece of software. There’s a “Getting Started” link, which implies that this is where you go after installing the software. Following this link confirms this.

By the way, Scribe Fire is a FireFox plugin that allows you to quickly post content to your blog. Why they don’t have that simple text anywhere on the front page is beyond me. You can get a description of what Scribe Fire does by clicking on the “Download” link (which actually takes to to a completely separate site), but why would you want to download a piece of software without knowing what it does?

Categories, Tags and Archives. Oh My!

To access the vast majority of content on a blog, a reader is going to have to leave the front page. When exploring a blog, there are a few ways the content may be organised. Firstly, there are the “Archives”, which are typically organised by date. Then you have the Tags and the Categories. Personally, I don’t see the point in the date based archive. If I’m navigating a blog, I’d have no way of knowing when a post I’m interested in was actually posted. I wouldn’t know whether to go to September 2006 or April 2002 to look for a specific post. So I’m definitely a fan of Tags and Categories.

There are some problems with providing links to Categories and Tags, namely that there tend to be a lot of them. There are a few options available, like listing them in the sidebar, Tag Clouds or putting them in a drop down list. I favour simply listing links for two reasons. Firstly, it follows the web usability convention of linking to new pages. Secondly, I’m not a fan of using drop downs to link to other pages. Why not? Well, drop downs are essentially form elements. They are typically used for providing information to a page, things like selecting a colour when buying an item of clothing. Using the same page element to navigate away from the page will confuse less experienced users. Another factor that will confuse less experienced users is the multiple ways of dealing with navigation drop downs. Some will change page as soon as the option has been selected where some require a button to be pressed. In my personal experience, I’ve found it difficult to label and name drop downs such as these effectively. For example, take a look at the category drop down at Techie Buzz (screenshot to the right). By clicking on the “categories” button will I get taken to a list of categories, as the name implies, or the category I’ve chosen in the drop down, which is what happens. There is also a default category, which further confuses the issue.

Link Me Up

I’ll keep this one short and simple. Just because it’s a blog, there’s no need to treat links differently to any other web site. So, they should be carefully and descriptively worded, underlined and relevant. I can’t click something if I don’t know it’s a link.

Good Form, Chap!

Many forget that most blogs do still have forms within them. The most common example is the comment form which, despite it’s simplicity, can still cause problems. Similar to the Links point above, there’s no reason to not follow standard usability guidelines just because your on a blog. So, something you may want to concentrate on.

• Readability – I’ve lost count of the number of blogs that, for some unknown reason, have tiny text boxes. There are two ways this can play out, either the box itself is too small or the text within the box is too small. At the end of the day, I link back to my blog when leaving a comment, so if I leave a poorly conceived comment, or one riddled with spelling or grammatical mistakes, it’s going to negatively impact on the image of me as a blogger. So I’d rather not run the risk. To solve this, you may want to look at Forms that Leap Out.
• Required Fields – Most forms have compulsory elements, make sure your readers are aware of what they are.
• Feed Back – Even if you design the perfect form, people will still make mistakes. When this happens you need to provide them with usefull feedback. This should include stating exactly what’s gone wrong, why, in which fields and how they correct it. Tone is very important when providing this feedback, and should be helpfull and supportive, not condescending. You should also leave the data the user entered in place to avoid the situation where a user spends ten minutes writing a comment and then gets it cleared when they put a typo in their email address.
• Spam Prevention – Unfortunately, spam prevention needs to be considered by all bloggers. Most use a tool like Akismet to catch spam after it’s been submitted but increasingly CAPTCHAs are being used. If you use CAPTHA you need to consider a few things. Firstly, you need to offer an audible challenge for those who cannot actually see the CAPTHA test. Secondly, there are CAPTCHAs which use mathematical questions, or similar. Be carefull when setting the difficulty and be sure not to discriminate against those who’s first language is not your own. Even better, I would recommend using the previously mentioned ProtectWebForm CAPTCHA which tends not to even challenge genuine users.

I hope you enjoyed this post. I deal with usability every day and I really can’t overstate quite how important it is. With that in mind I’m announcing two things. Firstly, I’ll be redesigning this blog with an emphasis on usability. Secondly, I’m offering free usability assessments to bloggers. When I was doing this as a job, I would charge over £50 ($100) for this, so take the opportunity while you can. If you are interested, leave a comment or send me an email and I’ll consider you. Each assessment can take a long time, so I’m only looking to do one a month, depending on the level on interest.

Consider the section of the page in the screenshot to the left. You can buy various pieces of software to use on your MBP but strangely, they have used Radio Buttons to select them. It’s worth noting that from a usability point of view, there are various reasons for choosing each type of form element on a web page. Radio Buttons mean you can select one and only one option. No more, no less (typically). Usually, Radio Button elements are used to limit the choices a user can make. Are you Male or Female? You can only be one, so this would warrant a Radio Button element to choose. Check Boxes are different. Check Boxes allow for none, one or more than one options to be selected.

So let me ask you the question, if you were designing a web store and wanted to generate as many sales as possible, would you limit your customers to only one piece of software on the purchase page? No, neither would I. There are a couple of reasons you may want to, for example if the software was mutually exclusive (i.e. buy iPhoto if you’re an amateur, Aperture if you’re a Pro), but this isn’t the case here. There is only one reason I can come up with for Apple making this design decision, usability and the impact it has on customer’s perceptions. Imagine finding a check box form element on this page. Apple would haveto default to having nothing selected as opposed to selecting a “None” option by default (the concept of a “None” selection doesn’t work with Check Boxes). A user could select whichever product they wanted and move on, which is fine until you find yourself in the situation of a user wanting to change their mind. This means that they have to click the option again, which almost seems counter-intuitive when compared to the “None” selection available when using a Radio List.

Counter-intuitive? I bet you’re questioning that statement, and you’d be right to. It isn’t counter-intuitive to me, and it probably isn’t to you. But it may be to people who aren’t familiar with internet mechanics. For these people they have accidentally selected to purchase something and now can’t intuitively de-select it. This will leave a sour taste in people’s mouths. If you find yourself questioning my logic, consider this. You are wondering around a supermarket and you decide you fancy some steaks, so you put them in your basket and carry on your merry way. A few minutes later you realise that your date for the night is a vegetarian, so those steaks aren’t going to be popular. Now how do you get them out of your basket? Do you put them back on the shelf (i.e. select the “None” option) or do you try and put them into your basket again (i.e. clicking the radio button again to de-select it). You can scoff at my logic all you want, but this is how some people will see it.

I have to say though, despite Apple trying to target the sorts of consumers that may not be familiar with computers and the internet, it seems as if the amount of extra possible sales would far outweigh the possible confusions.  What would you do if you were Apple?  Or do you think I’ve put more thought into it than the store designers?

1. Open it up – Yes, this is the obvious one but I’d be negligent if I didn’t point it out. Of course, you could argue the BBC is being negligent by making it an issue in the first place, and that’s an argument I’d throw my weight behind. It is such a shame that the iPlayer is Windows only, it really is. The BBC had the opportunity to take the moral high ground on this issue but didn’t. I’m also worried that the noises currently coming out the BBC on this issue, aren’t entirely positive. Certain sources are saying the aim is to get a version out for OSX and Linux in six months, this isn’t the case. The only official word says there are six monthly reviews. There’s a big difference there. It’s also worth bearing in mind the amount of time it took to get the Windows version up and running, a full two years.
2. Simplify (or remove) the DRM – I am willing to accept that DRM may be a necessary evil. I personally think the current implementation of DRM is way off the mark, not just for the iPlayer but across the entire industry. Unfortunately, vendors saw that they could lock content down tighter than ever before and went over board. How they can justify putting putting more constraints on a downloaded file than there is on a CD is absurd and deeply flawed. The BBC’s iPlayer DRM is flawed for a completely different reason. It’s utterly confusing. You have multiple expiry periods to deal with, that change when certain actions occur. I know DRM and it confuses me, the non tech savvy are going to have an uphill struggle trying to understand it.
3. Single Sign-On – Quite why the BBC force you to link your iPlayer account to a BBC.co.uk login, and then make you sign on twice is beyond me. Is the technological challenge of only allowing certain BBC.co.uk account holders access to the iPlayer insurmountable? Despite the fact that many other sites have segregated areas for certain users (e.g. pro areas). Not only do you have to sign on twice, but you also have to complete the forms to create the accounts and remember the logon details.
4. Better, more consistent interface – I’m really over the whole “three windows just to watch a video” thing with the iPlayer. For me, it’s a complete failure in interface design. Considering every page is essentially a web page with various embedded objects, why do you need three separate windows?  A start would be giving users working links to easily navigate between the pages. Forget about all the fancy gradients and Web 2.0 colour schemes, why didn’t they spend any time actually thinking about usability?  Although the BBC just generally seems to be more about style than substance these days.
5. Offer streaming – What year is it?  2002?  We all have broadband and companies seem to have the technology to send us content of a decent quality quickly, see Joost, so why can’t the BBC?  Considering the vast resources and piles of money extracted from the British public, streaming is the least they could do.  I don’t like having to wait for shows to download before watching them, I don’t like having to plan my viewing an hour before I actually do it,  it really defeats the purpose of delivering content over the internet.

I can think of quite a few other failings of the iPlayer, and other sources have also been fairly critical of it.  And rightfully so.  Those of us located in the UK are forced to fund the iPlayer through out license fee, they could have at least delivered something decent and at the very least, something that can be accessed by all computer users.  Can you imagine the uproar if the BBC suddenly announced their TV channels would only work on Sony TVs?

Have you been “lucky” enough to get in on the iPlayer beta?  What are your thoughts?  How could they improve it?  Drop a note in the comments.