After spending a day performing about 500 Google searches of various businesses for a recent project, we made the observation that many organisations are not optimizing the metadata tags in their websites for their users; namely neglecting to use metadata to communicate the nature and content of the website and to encourage people to click on their link.

Example of Metadata

(Note: don’t know what metadata is? It’s essentially ‘data about data’, and is entered into the head tags of your HTML content. It is made up of a number of tags, including “description”, “keywords” and “language”. Search engines essentially read metadata to ‘understand’ what a page is about).

Our observation about metadata was inspired by the search results of a large business, who had not edited the descriptive metadata tags in their website after it was created with a template, leaving the ‘lorem ipsum’ filler text to display in their search results. Metadata is the foundation of all information retrieval processes and its importance in good user experience should not be taken lightly. It is possible that certain metadata tags have been both neglected or abused over the years, due to aggressive black-hat SEO tactics, or theories about SEO and the relevance of the metadata tags. Despite the rumours and the SEO myths, metadata is still a critical step in correctly identifying and defining the content and structure of a website.

Descriptive metadata entered in a website source code is important because it is the first port of call for users to gain an understanding of a website (this is the metadata entered in the meta “description” tag of your website code). It is the text that is displayed in search results and is generally all a user will refer to when they determine if they want to click on that link. If the metadata gives the users false expectations of the content of a website, than user dissatisfaction can occur. Users do not want to have to click around to find information they expected to see elsewhere, or be taken to a dead end. Descriptive metadata needs to be a brief, accurate and keyword rich description of the site’s content. No more than 250 characters will be displayed in search engine results, so keep it short and to the point so users don’t miss out on vital content.

Metadata within a website should also be consistent; a unified metadata structure also indicates a clean and intuitive taxonomy within your website. Using a metadata vocabulary such as Dublin Core can ensure your website’s metadata is thorough and aids in content retrieval and management. When evaluating the information architecture of your website, look beyond your navigational structure and ensure your metadata is also intuitive, relevant and matches your target audience’s expectations of content and classification. Good information architecture structure encompasses all elements of the page, including those the users don’t necessarily see.

Accessibility is often one of those things  placed in the ‘too hard’ basket, or worse deemed unimportant as it thought to be only relevant to a small portion of the population.  The fact of the matter however, is that accessibility benefits all internet users.  Accessible websites and the information they contain are generally easier to comprehend, more user friendly and often more compatible across a range of web browsers, including mobile browsers.

Image from http://www.korten.in/Accessibility.aspx

While undertaking a full accessibility review can be a daunting process that may require the input from a professional, there are a few simple things everyone can do, to ensure that their websites are more accessible.

1. Do not make your website dependent on colours.
   Colour alone should never be relied upon to convey meaning to users. Links should always be underlined, and important information and forms should always be labelled correctly.It is easy, when designing a website, to think your website is immune from colour blindness problems because it doesn’t use red or green. In reality, there are many different types of colour blindness and the only way to ensure that your design is truly accessible is to check your foreground and background colour combinations to determine if they provide good visibility. 

   The W3C official statement on colour visibility is: “two colours are considered to provide good colour visibility if the brightness difference and the colour difference between the two colours are greater than a set range.” The range suggested by the W3C is > 125 for colour brightness and > 500 for colour difference.”.

   An easy way to check the contrast levels of your website’s colour scheme is to download the Vision Australia Colour Contrast Analyser for webpages: (http://www.visionaustralia.org.au/info.aspx?page=628). This tool analyses all colour schemes according to the W3C guidelines for contrast and provides a pass or fail mark. It can be changed to particularly target different types of colour blindness so all types of visually impaired users can be tested.

2. Place alt text on all images and media.
   Text equivalents should always be provided for all images on your website, as screen readers cannot ‘read’ images, they read the information provided in the alt tags. If the image used contains text, all text should also be included. Having alt text in the image tag ensures users relying on screen readers can hear the description of all images, rather than just hearing the file name. It can also be useful when pictures cannot be downloaded from the server, which often occurs when users are on slow connections. Alt text is particularly essential when an image is used as a main navigational link.Alt tags can be easily placed within the <img> tag of your website’s HTML body code. For those who are unsure, look for the tags that look like this: <img src=”/images/styles/usabilityone.gif” alt=”UsabilityOne”/> The alt text for this image exists after the ‘alt=’ tag, and reads as “UsabilityOne” 

   If you’re not sure about whether to provide alt text for your graphic; the safest solution is to always include it.
   It is also good accessibility practise to ensure your page is not dependent on images for navigation, or that the whole page is an image (e.g. one huge JPG created in Photoshop).

3. Use meaningful and distinctive page titles.
   Another easy way to improve the accessibility of your website is to ensure each of your website’s pages has a different and meaningful title. The title is the text placed between the <title> tags in your website’s source code, and is displayed in the tab of each browser, so you can see the description of each page you’re on (see image below). 

   It is also the first thing a screen reader will come across after a web page fully loads, so it is vital that it gives your visually impaired users a meaningful description of what page they are on, and to differentiate between other web pages.

   Have a look at the titles on each of your web pages that come up in the tab of your browser. Is it succinct and descriptive enough to give a reader an understanding of the page they are on? If someone was just relying on this, could they tell it apart from the other pages within your site? If it doesn’t do these two things, it’s worthwhile manually changing the text in-between the <title> tags in your source code, or asking your web developer to change it to something more appropriate.

   A good habit when creating a window title is to ensure it always follows the format “Page Title | Company/Organisation Name”. This format lists the page identifying information first.

An increasing number of the websites that we test, particularly redesigned websites, contain some level of social media integration. Social media integration can be very powerful and if implemented in the right way, on the right website can provide an excellent means for a business to communicate with their customers.

Examples of social media bookmark buttons

One aspect of social media integration on websites that interests me is the almost ubiquitous inclusion of social media bookmarking buttons. The most common of these is the Facebook ‘like’ button; however, many websites provide access to a very broad range of similar functions for other social media websites.

In our experience, users tend not to attend to these links during general use of websites. It must be conceded that users may not be in the mindset to spontaneously share information about their usage of social media in the context of a usability session that is not explicitly testing this functionality. Based on our observations so far, it is somewhat  unclear whether the  lack of spontaneous use is due to a lack of prominence, a lack of interest or the test environment, however, when we explicitly test social media bookmarking, we see that a proportion of participants like and use it.

Social media bookmarking has the potential to be a powerful tool in reaching your audience through recommendations, however, when deciding whether to include this functionality it is important to ask the following questions:

1. Does the website audience use social media?
2. Does the audience use social media simply as a means to communicate with friends or also as a means to broadcast information about themselves?
3. Is my content something that users would want to share using social media?
4. How can I use the connections that are made to my audience using social media once they are established?

Back in the early 1990s I began exploring how task models could be used to support usability evaluation.  Twenty years on, and I’ve found a potential contender in the business world. But first, let’s explore what I mean by task model.

A task model is anything that enables you to graphically represent a task, its components, and the logical and temporal relationships between those components.

In the mid 90s the software engineering community adopted UML (User Modelling Language), along with tools such as Rational Rose transforming UML models into source code. But, what’s available in the User Experience community?

Many task models have been developed by Human-Computer Interaction researchers to support the representation of user interaction with systems. GOMS (Goals, Operators, Methods and Selections rules) and its extensions (Keystroke Level Model or Cognitive Perceptual Model) being the most popular. These models remained mostly in the academic world – complexity being their worst enemy. Other popular models are flow charts or mind maps.

However, you may ask, “What models are there to help us, usability practitioners, represent the interaction between users and systems?”

The potential answer is BPMN (Business Process Modelling Notation – http://www.bpmn.org/). It is a notation gaining adoption through the industry world. Its strength is its simplicity. With little explanation, the notation is readily understandable by all stakeholders. Although BPMN’s aim is to represent business processes, it can easily be adapted to represent user interaction with systems and processes.

The figure above presents an illustration of a recruitment process (from http://www.rickgeneva.com/wp/posts/swimlane-lane-or-pool-learn-to-swim-first/). The circles with envelopes represent events that trigger a task to start (the event is the email being sent or received), while the empty circles represent the start and end of the task.

So, why do I use models? I use them to communicate and validate user interactions or processes, to support usability evaluation, to help define the language to be used and/or to create training material.

Twenty years later, and I am still puzzled why models are not more widely used amongst the various members involved in the design and development of digital solutions.

I recently purchased a Kindle e-reader from Amazon. When the package arrived, I was quite amused to see the following message on the packaging of the power adapter that I had included in the order: “Certified Frustration-Free Packaging”.

Quite a big call. I immediately wondered what had led them to include this “certification” on their packaging. My amusement quickly turned to … that’s right, frustration, when I could not work out how to open the packaging!

In user experience we often speak about affordances, that is the way in which something is designed suggests how you can interact with it. Along one side of the packaging are two rows of dots which often suggests an affordance of “tear here”, (see below) which was consistent with the packaging of the Kindle device. I quickly found out that this is not the way to open the package. Next I looked for another common affordance on packaging a “tab” (like that on the image below) that suggests where you should open a package, but no joy.

Eventually I worked out how to open the package and happily charged my Kindle. I found the experience quite amusing (also a little frustrating) and think that it is a great demonstration of how user experience principles don’t just apply to graphical interfaces. To my mind, there are three important design considerations that the packaging didn’t adhere to:

1. Don’t promise something you can’t deliver on – certified frustration-free experience

2. Affordances – the design should provide visual clues of how users can interact with a product

3. Consistency – interactions and the way in which they are presented (e.g. “tear here”) should be consistent

We recently conducted focus groups and one-on-one interviews on behalf of a Client who was looking to break in to a very well established segment.  Findings from our work indicated that there was a a high reliance on search in the segment – as a result, traffic in the segment is predominantly driven towards one existing and very well SEO’d website.  Interestingly, however, was that the site’s brand recognition was extremely low.  By name, users were not able to identify the site, yet were able to instantly identify the site on viewing one of its listings pages.

Naturally, implementing a thorough SEO strategy was one of our top recommendations coming out of the project.  But that wasn’t the most important outcome of the study.

There was a more nefarious impact of the users’ habits.  Due to the large proportion of traffic being dominated by this one site, its characteristics tended to dominate when we explored what participants were looking for in a website for this category.

So, is this a bad thing?  Well, not necessarily.  On the one hand, we were able to very clearly identify those features which support task fulfilment in the segment.  But on the other hand, users tended to gravitate to that particular site’s visual design in describing their preferences.  When we probed further on the issue, it became clear to us that these preferences were the result of familiarity only.

UsabilityOne doesn’t ascribe to the school of ‘design by rote’.  Having a site with a visual appeal that is exactly the same as your competitors’ sites may help drive acceptance in the short term, but without a unique positioning, there is little to drive repeat visitation or brand recognition.  And in the case of this particular segment, we feel the market dominance of the existing site is clearly at risk, when it could easily be toppled by a similarly designed site with a better SEO strategy.

We spent a lot of time analysing the data from our fieldwork, and were able to provide our Client with a clear picture of the users’ needs, which they’ve used to drive their design approach to producing a site that will be clearly focused on user task fulfilment, while also being unique in its design approach.  Lesson learned here:  Your (potential) customers only know what they know – beware of taking their feedback too literally, or risk creating plenty of bland ‘me-too’ websites that lack stickiness.

From online flight boarding passes to application forms, we all use PDF more than we probably realise. And with the Federal Government making all paper-based forms available electronically in PDF format as part of its Electronic Services Delivery strategy, PDF continues to be an essential part of our day-to-day lives, both at work and at home.

However, while we encounter PDF frequently, it doesn’t necessarily follow that it is the best method for us to use. In fact, it’s almost taken for granted that it’s just the way to do things – so we at UsabilityOne decided to investigate this further, and bring to light the real user benefits and limitations of interactive PDF forms.

You can check out our findings in our latest report, Incorporating the role of PDF in the Australian Government’s Electronic Services Delivery strategy.

Once you’ve checked out the report, make sure to tell us about your experience of using PDF by commenting here!

Of late, there have been discussions around the office, and with some of our clients, as to why in one-on-one user testing we get users to begin each task from the homepage. Following on from the previous blog post ‘Is your homepage, your homepage?’ there are arguments that not all users arrive at the homepage, so getting them to begin from there is not representative of a real world scenario, particularly since Google and other search engines encourage users to arrive deeper into the site.

That being said, even though the majority of your users might be landing deeper in your site, it is not to say that particular content should not be easily accessible from the homepage. Often when users are browsing a site they will use the homepage as a base to access different areas of your site, continually coming back and using the homepage as a reference or starting point. So even though users may have initially arrived deeper in your site, there is a good chance that during their visit they will click through to your homepage in order to locate other content.

Generally speaking, we feel that tasks presented during user testing are largely independent from each other and we encourage users to approach each task as if they had just arrived at the site. While it may be appropriate to base the first task of a testing session on a page other than the homepage, in most cases, we recommend that subsequent tasks begin from the homepage. The homepage provides a logical reset point from which users can begin their next task and provides an opportunity to test the effectiveness of the homepage and site navigation.

When on an important client call it can be quite stressful figuring out which button to use to place the call on hold and avoid rudely hanging up on the person. No matter how many times I’ve taken calls using this phone, time and time again I get confused . So much so that I’ve had to create my own work around for the device by placing a sticky note on the phone.