August 13th, 2006
Competition among search engines to “deliver fast and relevant information” is fierce. Companies such as Google, MSN, Yahoo, Lycos, etc. are in a frenzy to grab your loyalty (and your homepage) by shoving down your throat the power of their search algorithms, uniqueness of their results layout and innovativeness of their added features.
When Ask.com reinvented itself in February of 2006 - most visibly with the retirement of Jeeves - they introduced new technologies and features in the hopes of turning around one of the lowest ranked search engines. (For more information about these enhancements, read Richard MacManus’ well-informed post on the subject.)
One such feature, named “Binoculars“, allows the user to see a site preview by rolling over a, you guessed it, binocular icon. With the help of AJAX technology, this thumbnail image appears without refreshing the page. While it’s obviously a cool feature that’s intended set Ask.com apart from the competition, there are some usability and design issues that should be addressed.
I’m sorry to have to break it to all of my fellow web designers out there, but this pixilated 246×260 screenshot is now part of the user’s decision-making process. This also means that it should be part of our design process. Let’s explore how.
- Visual Emphasis of Site - Search engines are used to find a requested contextual or graphical item with varying degrees of specificity. The thumbnail view shifts the focus away from this relevant information to a high-level visual layout of the site. The result is that the user could choose to visit a site because it has the right shade of blue instead of the best information for their search task.
- Inaccurate Previews - According to their FAQs, screen captures are taken periodically and not in real-time. This means that what the user sees is not always what the user gets. The large PDA sale image in the preview is suddenly replaced my something completely unrelated once they click to the site. And even though it’s a technological limitation of Ask.com, do you really want a potential client subconsciously blaming your site for the differences and visit another site? I’m not saying that this will happen, but it’s a consideration because it could happen.
- Product Treatment – Usability principles state that the main reason someone goes to a site is to perform a task, regardless of how targeted or loosely-formed it may be. When the user’s task is to find a product, they’re specifically scanning for details of that product. They want to know how it looks, how it’s used and how it benefits them. Think about the user. They’ll have to click through to see how the product is used and its benefits, but they can see how it looks right in the site preview. And that image can lead them to or away from your site. So, when you’re designing, remember that what looks like a perfect image size of your product on the actual site might look small and inferior in the preview and vice versa.
- Behavioral Interruption – With roughly a decade of search engines behind us in one form or another, users are accustomed to the visual and behavioral aspects of these engines. They know what keywords to search for and how to type them in (and, or, comma, etc.) as well as what to expect in the listed results. Users, including myself, quickly scan the first few words of each result plus any relevant search content (abbreviations, numbers, etc.) and move on to the next listing until they find what they’re looking for. This behavior is fast and effective.
What these binoculars do is place a big stop sign in the middle of the highway. The user has to get out of their almost automatic scanning mode, slowly move the mouse so it hovers over the binocular icon and then view/comprehend the preview image. If it’s not what they’re looking for, they press the gas pedal down to once again get up to scanning speed. This adds time and frustration to their search. There’s a reason Steven Krug titled his usability book, “Don’t Make Me Think”.
Now this analysis is all well and good if it wasn’t for one important question – do people actually use it? I’ve talked to several people in and out of the web profession who consider the “binoculars” preview just a gimmick and nothing more. If that’s true, I just wasted a whole lot of words. But on the other hand, I’m sure there’s someone within the hundreds (or millions) of people reading your search result that consider the preview just a little bit more useful.
So, are the “Binoculars” Site Previews a gimmick or gold? Are they fantastic or just fluff?
What do you think?
|
13,909 Views |
Design, Usability
Digg this |
Bookmark at del.icio.us |
E-mail This Post
July 14th, 2006
In his recent post and MediaPost article, Gord Hotchkiss expands on Jakob Nielsen’s following point at a recent usability conference:
When responding to a question from the audience about the seeming contradiction between the need for building of brand exposure and best practices for usability, Jakob said that online, brand value is built through experience, not exposure.
Unlike so many followers of Jakob Nielsen would have you believe, branding is not just experience. Branding is a combination of experience and exposure. This “experience-only” position is usability-centric point of view that’s contradictory to the real world. It doesn’t take into consideration what visual branding is, what it accomplishes and what it represents for the business and the consumer.
Before I go any further, let me make one thing clear. I am a strong proponent of usability. I study it and incorporate it into every project I do. But usability is not the sole measuring stick in creating, and especially branding, a web site.
Defining Usability
Jakob Nielsen defines usability as:
Usability is a quality attribute that assesses how easy user interfaces are to use. The word “usability” also refers to methods for improving ease-of-use during the design process.
Let’s take a closer look at what he is saying. This definition refers to “…how easy user interfaces are to use” as well as “…methods for improving ease-of-use”. This is all about the interaction between the user and the web site. That’s it.
He then expands on this definition by saying that usability is defined by five quality components:
- Learnability: How easy is it for users to accomplish basic tasks the first time they encounter the design?
- Efficiency: Once users have learned the design, how quickly can they perform tasks?
- Memorability: When users return to the design after a period of not using it, how easily can they reestablish proficiency?
- Errors: How many errors do users make, how severe are these errors, and how easily can they recover from the errors?
- Satisfaction: How pleasant is it to use the design?
Again, this definition is only about user interaction. I know there are other definitions out there, but it’s appropriate to use Jakob’s definition since he’s the one who made the statement about branding and experience. So based on his definition, where does branding come in? It doesn’t.
Defining Brand
I’ve been through many sites to find the best definition of branding and here is a complete and concise explanation. (feel free to disagree)
A brand is a product, service, or concept that is publicly distinguished from other products, services, or concepts so that it can be easily communicated and usually marketed. A brand name is the name of the distinctive product, service, or concept. Branding is the process of creating and disseminating the brand name. Branding can be applied to the entire corporate identity as well as to individual product and service names.
So what are we saying here? First of all, a brand is “…a product, service, or concept that is publicly distinguished from other products, services, or concepts…” Branding is the act of “…creating and disseminating the brand name.”
Think about a product or service you’ve used recently. Let’s take orange juice. What are your initial impressions of these brands?
- Tropicana – Family, tradition, and nutritional health
- Florida’s Natural – the orange groves and the natural growers that support it
- Simply Orange – the natural quality of their oranges because they are left alone
Now think about how you came to these conclusions. It is the combination of imagery, content, audio, video, etc. that creates those messages and reinforces them across all media. This may include print, radio and TV spots, signage, packaging and – wait for it – web sites.
Take a moment to visit these sites (links in list above) and think about their branding. How does it make you feel and think? Are you as interested in their products without it? Go ahead, I’ll wait.
What we get is an immediate impression of one product branded three different ways – and the importance of the visual elements in these brand choices.
The Discussion
Jakob Nielsen and other usability experts have said that on-line users crave consistency and hate change. That’s why usability standards dictate that navigation is on the top or on the left, the search field is on the upper right, hyperlinks are underlined, etc. I can go on and on. But does this desire for consistency stop with user interaction?
Absolutely not. It flows right into their feelings, impressions, and yes, experiences of a product and/or service based on that branding message.
Another very important aspect of branding is that it exists below the surface. The true effectiveness of a brand is when you don’t notice it. Branding gives the customer comfort and reassurance that this is the place they should be and confidence in the end result. When it isn’t there, then you definitely notice it.
This is the reason why eyetracking studies by Jakob Neilson and others – as Gord Hotchkiss discussed - show minimal or non-existent movement on images. The user instantly recognizes the brand and moves on to the information they are tasked to find. Eyetracking shows a concentration on content because the user doesn’t need to look at the visual branding elements any more. They registered it. They’re done. Yes, users have gotten smart about innately skipping over advertising or graphics that look like advertising. This is not disputed or my point. We’re talking about branding.
Hotchkiss continues:
They’ve come to the site not because they’re engaged with your brand, although that may have helped sway them in your direction, but because they’re engaged with a task.
People do go to a site for a task. Whether the task is focused or unfocused, they are going there for a reason. But don’t discount the fact that the reason they go to that site in the first place is because of the brand message that they’ve been exposed to and accept. If a potential customer went to a site and just saw the logo and text without any other branding element, what would their response be? Am I on the right web site? Maybe not on the surface, but just that instant, subconscious moment of doubt gives them an opportunity to leave the site.
And while I agree that huge home page images are a detriment to a site, Jakob intends to give the user only the information they want for that particular task and forego text and images for branding purposes. That is a detriment to the site as well.
The Point
Steven Krug, in “Don’t Make Me Think”, describes his principle of usability as follows:
In means that as far as humanly possible, when I look at a Web Page it should be self-evident. Obvious. Self-explanatory. I should be able to ‘get it’ – what it is and how to use it – without expending any effort thinking about it.
It should be obvious. But pay attention to what else he says, that he should be able get what it is and not just how to use it. “What it is” is the web site of the company he intended to go to and here is the information I need. Brand and content. Exposure and experience.
And he did it “…without expending any effort thinking about it”.
A Designer’s Side Note
In his supportive post of Gord’s article, Gary Bourgeault states that
…high-priced designers are being asked to make lower priced sites. There is nothing else to it. People are beginning to understand , after years, that pages that load slow and sites that aren’t clear in what the visitor is expected to do, underperform tremendously.
His point that “high-priced designers are being asked to make lower priced sites” is the only reason why they are up in arms about this “discussion” is absolutely ridiculous. Some designers are high-priced because they have the knowledge and experience in design, coding, usability, and/or content.
And yes, designers are being asked to make lower-priced sites because there are hacks out there that can read a book or open Dreamweaver and call themselves web designers. Any designer worth a damn will tell that person to go to that lower-priced designer, knowing full well that when their site does “underperform tremendously”, they’ll be back in a month to get it done the right way.
And By the Way…
I was also in the eyetracking seminar at the San Fran Usability Conference. No, I was not the self-serving “hot-shot” designer who spouted textbook design terms with nothing to add except stroking his own ego. Like the rest of the room, I thought that idiot should just shut the $@(%$*% up.
However, I was one of the many who brought up branding. It was a valid point and I would happily do it again.
|
2,289 Views |
Design, Usability
Digg this |
Bookmark at del.icio.us |
E-mail This Post
May 26th, 2006
Hyperlinks are like most things in life - there’s a right way to use them and a wrong way. The choices we make in their visual treatment, content, user experience, and accessibility affect the success of your overall site.
Think about it another way. You’re driving down the road a little too slowly (especially to the people behind you) trying to find Main Street, a very common road. What subtle changes would help or hinder your success?
Here are some of the common good and bad practices of hyperlink usability.
GOOD: Make your links one consistent color and underline them.
Singing a very poor rendition of Garth Brooks, you drive happily along searching for the elusive Main Street. As you move along, your eye gravitates towards the green rectangular signs because you inherently know that those are street signs. Like these signs, a specific color and underline quickly signifies to the user that this is a link.
Source: Jakob Nielsen
BAD: Show text that is not a link underlined or with the same link color.
What if the Stop, School Crossing, and Falling Rock signs were also green rectangles? Not so easy to navigate anymore, especially during the “I’ve got friends in low places…” reprise. How would you know which is a street? The same goes for hyperlinks. Text that are not links should not be treated as such and vice versa. Blue should also be avoided since it’s the default hyperlink color and perceived to have the greatest clickability.
GOOD: Use different colors for visited and unvisited links.
What happens if there are three Main Streets in the area? What about ten? Instead of getting lost, wouldn’t it be nice if a road sign changed from bright green to a duller green to let you know that you already went down that street? Like these roads, different link colors help reduce navigational confusion for the user as long as they are different shades or variants of the same color.
Source: Jakob Nielsen
BAD: Keep all link states the same.
Would you know when to stop if the traffic light had three green lights? One out of three is pretty good odds. A long-standing usability guideline for navigation is to “help users understand where they’ve been, where they are, and where they can go (past, present, and future).” If this is not followed, users could revisit the same pages, get lost more easily, misinterpret links, and give up faster.
GOOD: Avoid changing links when the cursor hovers over them.
Imagine that every street sign you pass changes color, shape or font size. Kind of like driving in Vegas, isn’t it? And like Vegas, your site will appear more cluttered as the mouse moves around the screen. If you like hover states, I would probably go with a subtle color change from the unvisited state. It’s just enough to stand out but not enough annoy the user. Link titles (like ALT tags) that tell the user where they are going are also good practice.
BAD: Use bold and/or italic as a hovering effect.
This is not recommended because changing the text in this way increases the width of the font and may cause the text to realign.
GOOD: Do not use “Click Here”.
Try to avoid non-descriptive text. A link is supposed to “Explain what users will find at the other end of the link, and include some of the key information-carrying terms in the anchor text itself to enhance scannability and search engine optimization (SEO).”
Source: Jakob Nielsen
GOOD: Open new windows only for a specific reason.
Opening a new window disables the back button as well as annoys the user and clogs their toolbar. In most cases, only open a new window for a PDF or other non-web document, such as a large image. And make sure to give the user adequate warning by including a link title, secondary text, or a graphic icon (usually a double-window or a single-window with an outward arrow).
Source: Jakob Nielsen | SitePoint
ONE FINAL GOOD: Test your links.
You’ve driven through heavy traffic and traveled up and down many, many streets called Main, but you finally found the right address. Congratulations. So where’s the house? Why does that sign in the ground say, “404 Error: House Not Found”? After working so hard to follow best practices for your links, make sure they actually go somewhere. Smiley Cat offers some good advice on link checking software for the financially set and the financially strapped.
Source: Smiley Cat
Remember that these are guidelines, not absolutes. If your site utilizes different styles and techniques to reach your target audience and they work, then more power to you. But in most cases, some or all of these standards will aide in your on-line success.
|
1,250 Views |
Usability
Digg this |
Bookmark at del.icio.us |
E-mail This Post
A closer look at the Binoculars Site Preview of Ask.com
