search engines reduce usability [when] they’re unable to handle typos, plurals, hyphens, and other variants of the query terms.

But there’s another reason why users have learned to distrust on-site search: poorly presented search results. Even Nielsen seems to have a blind spot for search results. For example, search Jakob Nielsen’s site for the phrase ‘wireframes’:

Issues with Search Results on UseIt.Com

• The number of results is confusing. Does ’25 of 920′ mean ‘displaying the first 25 of 920 results’ — my initial, intuitive understanding. Or ’25 matches were found out of 920 documents searched’ — what I now think it means?
• Results are grouped into different sections, but that makes me work to interpret them. I understand the logic behind this but if feels like system-matching rather than mental-modelling. It sure doesn’t look like Google’s results.
• The matched terms are not highlighted.
• In many cases, the search query is not present in either the article title or snippet — which makes the user distrust the relevancy of the results.
• The snippet is not contextual, i.e. it is not retrieved from a section of the article containing the search query. A related issue is some snippets look too similar, perhaps derived from the same template.
• The use of italics as default font style for snippets makes the page difficult to read.
• There is no spacing between individual results, making the results page look cluttered.

Other Changes We Implemented In User Journeys Search

On our own search results page, we have tried to avoid these problems. We have also added the following features, not present in the UseIt site:

• We numbered our search results. Google doesn’t do this seems a more intuitive design here, when the number of results is typically low.
• We used pagination, as 10 results seems enough for one page. (Perhaps in a future version we should let the user control how many they see per page.)
• We added ‘this works’ text in the search box. This gives the experience a sense of fun. It also encourages users to try the search function, and challenges their perception that on-site search doesn’t work

Are there any other ways in which we could improve our search results? Please let us know.

[ ] I disagree with this article and I have read the terms and conditions.

I recently noticed a clue to the answer when shopping for a tablet device. Many of the manufacturers offered cases that came bundled with USB keyboards.  Presumably they were responding to demand.

The Asus Eee Pad Transformer is one of many touch screen tablets that offers the option of an attachable keyboard. Maybe old habits die hard, or maybe people prefer the robust feeling of tapping on a keyboard, compared to the flat tactile experience of an on-screen keyboard?

Size matters.  Trying to navigate a touch screen on a mobile phone can be frustrating.  It’s not so bad if you have the dainty hands of a small child, but tricky for those, like me, with bigger digits.  At least screen sizes are increasing on smart phones — e.g. the Galaxy S2 has a 4.3” inch screen —  but I find I can still only comfortably use the keyboard only in landscape orientation, and it’s irksome when there is a lag.

The design of smartphones is such that we tend to type with our thumbs. The inherent problem with such a design, of course, is that our thumbs are bigger than our other fingers, and more “clumsy” when there is little space in which to manoeuvre.

Maybe, to provide a small-screen typing solution, it’s not the virtual keypad but the physical device that needs to be redesigned.In the meantime, I’m tempted by that USB keyboard.

Let us assume that the user of any software has three hierarchical types of needs:

1. The software must work; it must be functional. This is the user’s most basic need.

Making sure software works is a prerequisite to good usability and a good user experience.

2. The software should be easy to use. Over the last decade, websites in particular have become more user-friendly, thanks partly to the spread of usability concepts (see Jakob Neilsen), but moreso to the pressures of competition.

When a software tool has no competitors, users will tolerate bad usability, so long as the software is functional. But when there is a choice, users will plump for the tool that is easier to use. Usability is concerned with software’s intuitiveness, its ease of use.

3. The software should be pleasurable to use. When competition is fierce, the software that wins is not only easy to use, but also enjoyable to use.

Steve Jobs recognised this. Donald Norman, usability pioneer, recognised this in his book Emotional Design. Norman argues that software was more effective when users found it aesthetically appealing, or when they formed an other emotional connection to the software, e.g. when they found it aesthetically appealing. As he put it, “attractive things work better”.

User experience concerns designing software to be usable AND pleasurable or otherwise emotionally engaging for users.

When you’ve built a mobile version of  your website (congratulations!), the first UX rule to observe is: detect the device and offer a link to an alternative.

I had a strange experience today when I was viewing the design portfolio of Dublin digital agency Kooba.

One of their portfolio projects was the HSE’s official information site about breastfeeding. I clicked the link and thought the site looked rather strange. After a couple of minutes, however, I noticed the link to the desktop site, and everything made sense.

So, Kooba had indeed implemented Rule number 1 – Detect the device, but also Rule number 2 – Link to the alternative

There is another good reason to link to the alternative. Users sometimes want the ‘full version’ of the site. For example, on the mobile version of Facebook or Twitter, due to space restrictions, fewer features and functions are offered.

But users may nevertheless want to access the desktop versions. For example, I am sometimes willing to endure the full-version pain of a site I use to find flights, SkyScanner, even when using it from a mobile. Why? Because the mobile version doesn’t allow me to search the flight dates for an entire selected month, a feature available in the desktop version.

Maybe the ‘select entire month’ feature should be in the full version. Ultimately, however, some features will have to be omitted.

But those striving to grow online sales tend to focus too much on generating new visitors, while neglecting the experience of visitors on the site.

You can bring a horse to water, but you can’t make it drink.

Recently, the manager of a large retail store told me that he was embarrassed about the number of homepage visitors that were converting to paying customers. They had spent a lot of money on SEO, SEM, Google Adwords, social media marketing, etc.

I logged on. His site looked user friendly — the design was clean and professional, and simple tasks like finding a product were easy.

But I tried to buy a product. I was confused about the price: did it include shipping? Would I get free shipping if I added one or more products? I couldn’t find any links to the shipping policy or shipping rates. I proceeded through the checkout, to see if shipping would get added to the price — my frustration building — when, suddenly, I was asked to register.

Like most people, I hate filling registration forms. I hate filling any forms. Do I create a new username and password, or take the security-weak decision to reuse an existing username and password?

I didn’t proceed. I suspect many other people abandoned their carts at this point.

For the owner of this store, a few design tweaks could have removed my frustrations (make the shipping policy/price clear; remove the need to register, or push it to later in the cycle).

I believe that this web business owner has never observed real users interacting with his own website.

By spending a small portion of his budget on usability — testing, iterating the design, etc. — he may see his conversions improve quickly.

Today, I wanted to buy tickets for the upcoming Republic of Ireland vs. Estonia football game, so I logged onto the Football Association of Ireland’s homepage:

A snapshot of the FAI homepage.

It seems straightforward — click the picture, buy the tickets (walk down the aisle, get to the milk), right?

Of course not.

Clicking the picture, or even the “Click Here to Purchase Online” banner, took me to a new website — TicketMaster.ie — which opened it a new website.

Landed on the Ticketmaster homepage; what's all this other stuff?!

Worse, I am now on the Ticketmaster homepage, not a specific landing page for the Ireland vs. Estonia tickets.

Even worse, I can’t find any mention of the Ireland vs. Estonia game on the TicketMaster.ie website.

Was this a carefully designed experience — a plan to get me to check out all those other “upcoming events”?  Are the FAI and Ticketmaster trying to get me interested in Noel Gallaghers new band? Are they trying to tempt me with other groceries before I buy the milk?

Or have they simply put no thought into their user experience? You decide…

They could have just taken me straight to the milk.

A decade ago, most websites betrayed a lack of understanding of basic usability principles; so it is with today’s infographics.

This was starkly evident when Smashing Magazine recently published  The Do’s And Don’ts Of Infographic Design:

Sometimes you just have to bite the bullet and produce a traditional bar graph or pie chart; nevertheless, always consider ways to dress it up…

The article was met with horror by the data visulalization community. While infographics seem like an overnight success, data visualization has been established, particularly in academia, for decades.

Pioneers like Edward Tufte, Noah Illinsky and others have shown — to take one example of a useful data visualization design principle — that people can differentiate shapes more easily than they can differentiate colours, and they can differentiate positions more easily than shapes. So when encoding different dimensions of data, position is a better visual property than shape, and both are better than colour.

None of this means a designer can’t use colour as a visual property to encode data. But a good designer should at least be aware of the basic principles before breaking them.

Flawed as it was, Smashing Magazine’s “Do’s and Don’ts” article was useful because it started a debate about best practices — among the web design community and the data visualisation community. As well as the comments left by Smashing readers, a harsh riposte appeared on Flowing Data, which was subsequently published in Smashing Magazine.

This debate will hopefully bring some data visualization best practices into the grassroots web community, so that we will begin to see more infographics of the quality that the New York Times produces, and less chartjunk — like that infographic about infographics.

DoneDeal - A clean and effective homepage

When I arrive at any website, I know what I don’t want. Please — no waiting, filling out interminable forms, unticking radio buttons, or being redirected.  I want a site that is immediately effective.

With over two million visitors per month, Irish classified website, Donedeal.ie is one of Ireland’s most successful websites.

• On the homepage, you straight away see both the search and sell options.
• Each of the categories are indicated by simple, attractive graphics.
• The main menu is exceedingly simple: “Home / Search / Place Ad / Help”

DoneDeal has several usability issues (usability perfection is impossible!), but overall it is an easy to “get”, easy to use site.

The site’s good usability did not come through luck — the founders Fred and Geraldine Karlsonn explain that they have focussed on the user experience and that they regard ‘listening to customers’ as one of the most important steps to a successful web business.

Data visualization will be an important craft/technology over the coming years. As pointed out in Stanford University’s excellent video, we are still in the early days of the medium, and there are currently more bad examples of ‘dataviz’ than good.

Let’s take a look at some examples of infographics, which are author-crafted visual representations of data.

The visual.ly showcase features many good examples of 2-D infographics (typically poster-with-chart style). But I believe interactive infographics have more potential.

Some of the best examples of interactive infographics come from the New York Times, such as this chart of unemployment in the US or this cute interactive breakdown of household composition in the US.

Another example, from data journalist David McCandless, compares health products based on scientific merit.

I decided to see whether I could produce an interactive infographic, using the two most popular free dataviz tools on the web.

I got some data — a spreadsheet of the recently most popular girls names in Ireland, based on registered births between 1998 and 2010 — from the CSO.

The first tool I tried was IBM’s Many Eyes. I found it quick, easy and intuitive to use. I just had to paste my data from a spreadsheet into the web-based interface.

Many Eyes offered me a range of different ways to display the data, but the one that seemed most intuitive to me was a bubble chart. The whole process (once I had registered with the site) took about 15 minutes, and you can see the resulting infographic here.

My verdict: The software was easy to use. As for the finished chat — the bubble chart is a good visualization and one that I think is a good idea. However, I would have preferred to have offered the user a time-axis slider, i.e. a way for the user to be able to see each bubble chart as part of an animation, which the user could either play, or manually progress through, by dragging a slider.

Next, I used the same data with Tableau Public. This is the free version of a $999 piece of software. The limitation is that your infographic and data, once saved, are publicly viewable on the Tableau site.

A desktop app, I found Tableau reasonably intuitive to use — although I consciously ignored menu items that seemed aimed at users with knowledge of charts and statistics.

One gripe was that Tableau wasn’t able to import my Excel file, for some unclear reason. However, when I converted to a .CVS file, it imported fine.

The choice of charts was limited — there was no bubble chart. In the end, I settled on a bar chart, which you can see here (registration required).

My verdict: Tableau was easy to use, but I felt I wasn’t tapping into its full potential, and its advanced features were daunting. As a non-statistician, perhaps I’m not Tableau’s target user.

I was able to manipulate the chart in different ways but, as with Many Eyes, I wasn’t 100% happy with the finished chart. I would have preferred to make the most popular names show up first — or to let the user order the names.

Update 30 Sep 2011: I have since discovered that an interactive area graph is a better format for telling a story about the relative popularity of baby names over time.

Flowing Data gives a tutorial on how to create such a graph using open source software libraries, but programming skills are required.

I would love to have software that
a) helped me (a beginner to data visualisation, but with UX/design skills) to select the optimal chart for the story I wanted to tell and,
b) helped me to create and refine that chart exactly as I wanted

Maybe I’ll have to design that software!