Archives for "Usability"
Research / Reports :Mobile Usability
Usability in Mobile Applications is really an important factor and a challenge in today’s scenario where there are several applications getting designed for Intranets as well as for end-users. Most of them don’t serve completely as intended to the end-user’s needs, being not designed from the mobile usability perspective.
Research / Reports on Mobile Usability
Few days back, I was reading some article related to Mobile Usability on Jakob Nielsen’s website . I found it quite interesting and so trying to put in some facts which I think should be useful for us to understand the scenario.
To understand usability factors that makes mobile sites easy or an unpleasant experience, Jakob Nielsen had combined 3 different usability testing methods, namely: 1) Diary Study 2) User Testing 3) Cross-platform review.
Mobile devices’ users face several usability obstacles to overcome with, like Small Screens, Difficult / non-easy ways of input, bandwidth / download time issues and worst of all, badly designed website.
Surprisingly, as per the Jakob Nielsen’s tests which were designed to test participants using those sites which were specifically designed for mobile devices, their “average success rate” was 64% which is quite higher than the 53% success rate recorded for the “full sites”. And, as Jakob thinks, this is a enough powerful reason to start developing mobile optimized websites.
This “mobile usability” has several interesting facts unconvered. You can read the complete article here: http://www.useit.com/alertbox/mobile-usability.html
Some Resources:
Mobile Web – Navigation Design
Mobile Web Applications – Design factors
What is Banner Blindness?
Banners are common form of advertising on web, especially on portals like news sites. Paradox is, even though users do notice the presence of banners on the web page, they tend to ignore it quickly. Almost everything that looks like a banner on the web page is about to get ignored due to the “banner blindness”.
As Wikipedia describes it – “Banner blindness is a phenomenon in web usability where visitors on a website ignore banner-like information.” As Jakob Nielsen mentions, “Users almost never look at anything that looks like an advertisement, whether or not it’s actually an ad.”
The term “banner blindness” was coined by Benway and Lane (1998). It was a result of website usability tests where major test participants, consciously or unconsciously, ignored information that was presented in banner or looked like a banner.
This eye-tracking study by Jakob Nielsen has confirmed that most of the time, the banner blindness is real. Users are now ‘immune’ to these ethical and now-ethical ways of advertising on the web and tend to ignore those ads or something that looks like an advertisement and rather keep looking relevant information in the form of links, etc, while ignoring large animated or colorful elements like graphics.
Also, users generally read the whole content; rather they do scan the content. If the content is interesting for the user, then he might choose to read it in-depth. But, in all such cases, he still may prefer not to see those noticeable banners.
Source: Banner Blindness: Old and New Findings
(Jakob Nielsen’s Alertbox, August 20, 2007)
Heatmaps from eyetracking studies:
The areas where users looked the most are colored red; the yellow areas indicate fewer views, followed by the least-viewed blue areas. Gray areas didn’t attract any fixations. Green boxes were drawn on top of the images after the study to highlight the advertisements.
© 2007 by Jakob Nielsen.
References / Resources:
Benway, J. P., Lane, D. M.,
Banner Blindness: Web Searchers Often Miss ‘Obvious’ Links
1998, Internet Technical Group, Rice University
Norman, D. A., Commentary:
Banner Blindness, Human Cognition and Web Design
1999, Internet Technical Group
Pagendarm, M., Schaumburg, H.,
Why Are Users Banner-Blind? The Impact of Navigation Style on the Perception of Web Banners,
2001, Journal of Digital Information
Why Are Users Banner-Blind?
Journal of Digital Information (July 31, 2001)
Just How ‘Blind’ Are We to Advertising Banners on the Web?
Usability News (Summer 2000)
Please submit resources / insights for Banner Blindness here, if you have any.
Drop Down Menus – Usability
Using drop down menus is cumbersome for users, as it needs scrolling efforts by end-users, leading to usability and accessibility issues. Now, there is a new trend in the web design – of using large drop down menus. New mega drop downs are far better than regular drop downs, which hides several options when they open and may be a long scroll is involved to see all of them and still they all can’t be seen at the same time – involving usability issues like motoring and short-term memory.
These new kind of drop down menus has features like:
- Everything visible at the same time, so users don’t have to scroll (in most cases).
- Split into two or more panels for an easy to understand navigation interface and grouped sensibly.
- Has features like usage of typography, icons (even may be thumbnails), assistive features like tool tips.
- Users don’t have to remember a lot, everything being visible upfront (as the short-term memory is involved while browsing such objects and several users may miss it as they rely on short term memory).
These kinds of menus are easy-to-use and have been rated good on usability as per tests done by the Jakob Nielsen’s (Alertbox, March 23, 2009).
Also, in desktop application interfaces (GUIs) like Microsoft© Office 2007 , this kind of drop down menus with illustrations has been used effectively.
Microsoft Office Word 2007 – Formatting
Microsoft Office PowerPoint 2007 – Publish Slides
Below given are some of the examples:
Microsoft US homepage
BP homepage
CompareIndia.com homepage
You can read more about the Mega Drop Down menus on Jakob Nielsen’s website: http://www.useit.com/alertbox/mega-dropdown-menus.html
Mobile Web – Navigation Design
With the increasing usage of web on mobile devices, the need to understand the end-users has emerged with prime importance. End-users’ experience of web on desktop and mobile devices is almost entirely different and even these users has a different kind of ‘mental model’. Interface or navigation designs that works great on desktop may not work in the same way on mobile web as it is.
A usable navigation design improves the end-users experience and makes sure that users don’t leave the website due to frustration as they are not able to use your website on their mobile device.
While designing websites specifically for mobile devices, there are several factors which you will have to consider. In this article, we will discuss particularly about “navigation design for mobile websites”. You can read more about Usability Factors for mobile web as well as Design Factors for mobile web.
Here, we will discuss some important aspects of navigation design for mobile websites:
1.Provide only minimal navigation at the top of the page:
Only basic navigation to help users enhance the experience by reducing clutter for these relatively small screens. Core links upfront also help users to navigate across the application easily without getting much frustrated. In case of footer links, provide very few (2-3) and only if it’s really essential and helps users.
Provide only minimal navigation.
2. Balanced Site Structure:
Unlike desktop-based browsers, mobile web browsers has too many limitations like screen size, hardware’s processing capabilities, memory, etc. Scrolling too much could be painful for the users on such devices. So, the information architecture will need to take care of this balance between that will help end-users to reach the desired content with minimal links.
Inessential links or steps added to get the desired content make users frustrated and they simple stop using the site.
3. Consistent Navigation Mechanism:
The way users navigation on mobile devices is not as easy as pointing devices like mouse on a desktop and they have to rely on joysticks / 4-way navigation or keypad. In such a case, using a consistent navigation method helps a lot.
A “drill-down” navigation mechanism in such interface can help end-users, as it is based on the major headings that take you inside it based on your preferences. For example, someone who wants to see what’s available in movies or music can be directed to the same using main heading link as “entertainment”. Also, we should make sure that links that takes him to main homepage or category homepage are available, e.g. home, entertainment, up, back to top.
Consistent Navigation Mechanism
Make sure you keep these links minimal required and steps to get the desired content also very minimal, as users may not be interested in going for more retrievals or clicks to get the content he / she is looking for. Also, some form of breadcrumbs can help them to track their trail as well as to go back easily.
4. Device-based Access Keys:
Unlike traditional desktop computing, mobile device is not capable of relatively easy-to-use point device (but is bit easier in smart-phones with some point device like stylus). In such a case, we should use the built-in capabilities of the keys built on the device, which are keyboard shortcuts for a mobile device. Users can press a number on the keyboard to go to a link associated with.
Also, make sure that same access key assigned a link is used across the application for the same link.
5. Description for the link:
Provide information related to a link. For example, if a link is directed to a file which may not be supported by the end-users device, it may be frustrating for him as he isn’t ware of the kind of file type is linked with that particular link. Handsets which don’t support videos etc. may show undesired response and may frustrate the end-user.
6. Do not Use Image Maps-based navigation:
Even though it’s an effective way to navigate by using client or server-side image maps, most of the mobile devices don’t support them. Also, usage of images as navigation should be avoided as end-users with information-seeking behavior tend to disable loading images and your navigation may go completely invisible for the end-user, as browsing websites on mobile devices do involve data usage charges to the end-users and they may be simply not interested in viewing those images as they have to pay for it.
There could be more ways to design a better navigation for mobile web. Please contribute them here if you can think of anything.
Made by Symmetric Web
Distributed by Smashing Magazine