IT Solutions Blog

• 10 unexpected online user behaviours to look out for (by webcredible team) – the really interesting thing is that they talk about “People” and not “Users”
• A Review of Consistent Designs on the Web (by Noam Almosnino) – a check list (like it) and visual examples (love it).
• Design Multilingual Website: A Beginner’s Guide (by Christian Arno) – often only a back-thought, but it shouldn’t. I18N and all the good stuff.
• uxurls.com: a user experience aggregator (by Harry Brignull) – Harry is collecting and presenting blogs about UX, 130 sites and counting…
• How to Build a Footer That Doesn’t Stink (by Ben Gremillion) – yes, this kind of footer
• 34 Outstanding Admin Panels for Your Web Applications (by Madalin Tudose) – more inspiration.
• My biggest mistakes (by Scott Berkun) – call it life lessons, call it learning from other people’s mistakes, call it a must-read…
• Web designers announce IE6’s ‘death,’ slate party (by Gregg Keizer) – Thank God, finally?
• So You Call Yourself A Designer? (by Niki Brown) – Niki illustrates which qualities/skills are needed to be a good Designer

Which browser platform should we design for? To most web developers this question is a nightmare and dilemma at the same time, but yet again we face it almost on a daily basis. Just to show you how difficult an answer might be is the disparity between two projects I’m involved in, one for a federal government body that by definition only supports IE6 and another that is expected to be finished in 6 months and therefore was hoping to target IE8. Are these expectations realistic?

Analytics

Let’s have a look at some website analytics that were collected over the past year (July 2008 – July 2009), taken from Fanposter.org, a social media website with over 5000 registered users from almost 100 countries and collected through Google Analytics.
Note: While I’m aware that the audience of this website might not be representative for all age groups or countries/regions, it still provides valuable hints about browser usage and trends.

Lesson 1: Internet Explorer on the fall

Internet Explorer is historically bundled with Microsoft Windows Operating Systems. IE6 was released August 27, 2001 just months before WinXP; IE7 was released October 18, 2006 and included with Windows Vista and Win Server 2008; IE8 final was released March 19, 2009 and will be included with Windows 7.

The combined total market share for Internet Explorer over the past year was 76.5% but the trend shows a clear decline over the past months from 74.0% in May to 68.8% in June and 53.9% in July.

Will this trend continue to hold true?

A lot will depend on the upcoming release of Windows 7 in October 2009 with Microsoft’s power in reaching the people to upgrade their browsers. But almost certainly Microsoft will loose its dominant position of 95% in 2002 and 2003 (IE5 & IE6) or over 75% in the past year to its numerous very capable competitors.

Lesson 2: IE8 on the rise

When comparing the 3 current versions of Internet Explorer out there (IE6, IE7 and IE8 with IE5 and lesser not appearing in the analytics anymore and therefore being disregarded) it seems to be evident that IE8 is on the rise. Though the really surprising observation is that this increase cannot be accounted to users abandoning IE6 but rather to users upgrading their version of IE7. How come? The answer seems to lie in fact that many companies and their IT departments as well as governmental bodies still continue to hold on to and enforce the use of IE6. Can Microsoft overcome these – mostly security-related – concerns through IE8?

Lesson 3: IE6 might not die as soon as we all may wish

As discussed above IE6 is still a requirement for many users. A quick look at Google Trends reveals that searches for IE6 (Figure 3: blue line) have been pretty stable over the past 4-5 years while searches for IE7 (Figure 3: red line) are declining and searches for IE8 (Figure 3: yellow line) are in the lead. This goes hand in hand with the observations in Lesson 2 above.

In the meantime let’s join the numerous battles to kill IE6 like Norwegian Websites Declare War on IE 6 and IE Death March or more seriously at Bring down IE6. Joke or not, IE6 will be around for some more time and therefore needs to be considered if we want it or not.
It won’t even help that Digg is discussing to drop support for IE6 or YouTube Will Be Next To Kiss IE6 Support Goodbye. Both sites don’t need users that cannot upgrade IE6 e.g. due to limitations at work because exactly these users have limited access restricted by their companies anyway.

Lesson 4: Firefox stays on top

A very interesting observation is the fact that Firefox does a really great job in staying on top of things and keeping their user base up to date. In the last month of the observation period less than 5% of all Firefox users had a version lesser than 3, or in other words, the great majority of Firefox users was using version 3 and higher. And with versions 3.7 and Firefox 4 in the making, a huge base of motivated developers and fascinating plug-ins the future looks bright. Firefox’s marketshare seems to climb steadily also, as of July 2009 it showed 32.1% (20.5% average over the past year) with the majority Windows versions and only 0.6% on Mac and 0.2% on Linux. Obviously we all love the high commitment to standards compliancy that makes developing web apps a blast, right?

Lesson 5: Chrome & Safari

Google Chrome was released December 11, 2008 and first received as Google’s never-ending battle against Microsoft (see graphic by Federico Fieni) but more likely just another smart move to keep users on the web – the faster, the better – or like Ben Parr explains “Revenue = Amount of Time on the Web”.

As far as marketshare is concerned, Chrome rose to 2.3% in July according to my analytics. This is still fairly small but not to be underestimated. In terms of testing Google’s developer page for Chrome suggests that “if you’ve tested your website with Safari 3.1 then your site should already work well on Google Chrome”. But what about Safari?

Safari accounts for 1.3% in the yearly average (with 1.2% on Mac and the rest on Windows). Should we test Safari with a marginal share like this? It really depends on your budget and company structure which might require unjustified additional resources for your QA team. Do the math for yourself: 1% of 10k visitors are 100 potential customers – is it worth the effort?

Lesson 6: Opera is the misunderstood genius

Opera shows an average of 1.1% with an unexpected peak in July 2009 – I need to continue observing where and why that came from. Needless to say, Opera is strong in European countries like Russia and on mobile devices such as mobile phones, smartphones and PDA’s (personal digital assistants). It’s a shame that Opera is not further ahead, it has been and still is innovator and spearhead in terms of new useful features as well as standards compliancy and implementation.

What are your experiences?

Without giving any decisive conclusions I’d like to hear your experiences or analytics to this subject. For which browser platform do you design for? What do you tell your clients when they ask you this question?

Marti Hearst generously made her upcoming book “Search User Interfaces” available for reading online. She is definitely not a newcomer to the scene and the book for sure not a Best-Of compilation, moreover the book is written in an academic fashion that backs up its theses usability studies, log studies, or some other form of proof (like it!) – like Harry Brignull states: “Caution: actual thought may be required when reading this book.”

Contents: Search User Interfaces

The book has two main parts: search fundamentals (Chapters 1-7) and advanced topics (Chapters 8-12).

0: Preface
1: Design of Search User Interfaces
2: Evaluation of Search User Interfaces
3: Models of the Information Seeking Process
4: Query Specification
5: Presentation of Search Results
6: Query Reformulation
7: Supporting the Search Process
8: Integrating Navigation with Search
9: Personalization in Search
10: Information Visualization for Search Interfaces
11: Information Visualization for Text Analysis
12: Emerging Trends in Search Interfaces
References
Index

Suggested reading:

Search User Interfaces

Marti A. Hearst. Cambridge University Press 2009, Hardcover, 408 pages, $31.99

“It was already one in the morning; the rain pattered dismally against the panes, and my candle was nearly burnt out, when, by the glimmer of the half-extinguished light, I saw the dull yellow eye of the creature open…” (Chapter 5). Sounds familiar to us geeky programmers out there? Yes, and the root of all evil are clients that design their webpage from a sushi menu, picking whatever they like.

Usually I encourage my clients to look around, get inspired and show me what they like. It gives me a sense of how they think and into which directions they want us to go. But never forget: Clients identify problems, designers provide solutions! Understand why the client shows you a specific page or design element and what exactly they like in it. Don’t feel pressured to include every detail in your final design otherwise you wake up at 1am facing a yellow-eyed creature and you’ll end up with a Frankenstein Design.

Warning Signals

What are warning signals that your project might face a Frankenstein Design?

• Client mentions Stakeholders too often. Money makes the world go round, but will eventually ruin the user experience.
• Client fell in love with a bad design. Try to build solid knowledge about good and bad design principles so you can explain the pro’s and con’s of a particular design.
• Client needs to please too many interests. It’s understandable that every party involved wants to see their logo on the page, but honestly, one is enough
• Client decides on a color scheme. Besides corporate colors clients feel strongly about certain colors that either clash with your design, psychological theory or existing color schemes or are simply bad taste altogether.
• Client has no idea at all. That means trouble! Not now, but once you are done. Guaranteed.
• Got more?

What you can do

• Listen. Hear what the client tells you and try to understand why they say it.
• Feel. Sense what the underlying need is and translate it into design elements.
• Talk. Speak up, don’t shut up, don’t wait until it’s too late.
• Fight. Pick your battles, don’t let rules overrule what you think is right, at least voice it.
• Reconsider. Don’t get hooked to an idea too strongly, be open to erase your white-board drawings and start over.
• Document. Make notes, sketch ideas, capture screens, summarize. Send these notes out.
• CYA. Cover your ass, seek consensus and approval, set it in stone through written acknowledgments (mockups help).

Send me your experiences? What is missing on this list?

The last couple of weeks were pretty busy for me. We were trying to design an application that has potential to grow beyond national importance and get high visibility. Needless to say expectations are high. Time constraints aside, my focus was to extract the goal of the application and streamline the user experience, do I sound like a marketing person yet?

Powerpoint Wireframes

In order to get quick and accurate feedback from our client I wanted to create visuals as early as possible. That’s when Microsoft Powerpoint came in handy. I created wireframe mockups and iterated through the slides via video conference which turned out to be not only useful but essential to the mutual understanding. The client was able to adjust their process, our project managers increased their knowledge about the domain and our developers identified potential issues with integrating our mapping software.

Free Download

Download Powerpoint Wireframe Stencils

During the process of designing the wireframes I created my own set of Powerpoint stencils that covers all common interface elements as well as a set of small icons.

Example Usage

Just recently I started to redesign www.actress.at, the website of my sister who is an actress currently located in Berlin, Germany.
What better opportunity than this to put the wireframe stencils into work. After talking with her for some time over the phone I got a good sense of what her vision is based on the needs of job. Together with some photos from her agency and videos from youtube I created the following three mockups:

Next Step: XHMTL Prototype

Following the wireframes exercise we created a color palette and implemented an XHTML prototype which roughly took us 3 days. Screen snapshots fed another set of Powerpoint slides for the big demo and will eventually go into the design doc as well. So far, so good.

Help me to improve the stencils

I really hope the wireframe stencils will be helpful for your work (as they made my life easier). I am interested in your opinion. What is missing? What can be improved? Send me your suggestions, ideas, updates

I just came back from an extended trip to Las Vegas, a fascinating city for a multitude of reasons. Not only is it the fastest-growing city in the US, it is also constantly transforming and reinventing itself, a Disneyland for grown-ups, gambling capital of the world, vacation spot for one and Sin City for others. It became evident to me that this city offers more than just pleasure, it teaches us how to attract, entertain and keep us happy despite the fact that we are loosing our money, which means they must be doing something right. Here are my 10 Webpage Design Lessons learned from a trip to Las Vegas… seriously:

1.) Don’t Listen to Users

“What happens in Vegas, stays in Vegas”, the motto of Las Vegas is a true #1 (who ever came up with that slogan is a genius in my eyes)! When asking your fiance/fiancee about his/her bachelor party … pardon … when designing an easy-to-use interface, pay attention to what users do, not what they say. Jacob Nielsen states that self-reported data is typically three steps removed from the truth:

• People bend the truth to be closer to what they think you want to hear or what’s socially acceptable.
• In telling you what they do, people are really telling you what they remember doing.
• In reporting what they do remember, people rationalize their behavior.

Lesson: Perform user tests as early as possible (e.g. design phase).

2.) Optimize your Top Task

Marriage is wonderful and so is the wedding day, at least mine was. Of course I blacked out the six months of preparation and swet that lead to that event. Now, Vegas wasn’t Vegas without finding a way to optimize the wedding experience: A 24-hour drive-thru wedding chapel called A Little White Chapel Tunnel of Love. “Ahem, yes, Combo 2 with two wedding rings, a bouquet and the Elvis… can you make it ‘Love me tender’ please?” – “120 Dollars at the first window please.”

Lesson: Identify and optimize your top task.

3.) Direct your Users

Once inside a Casino it is incredibly difficult to find your way out – I’m not certain but I would take any bet that exactly this is the purpose of a Casino designer. More than once I found myself in a maze of slot machines surrounded by their ringing noise and flashing lights. Whatever I was looking for (except ATM’s) seemed always to be at the other end of the Casino.
Design your page in a way that helps users find their way around but at the same time support your business model, e.g. Amazon has perfected the process of returning articles and submitting online or email support request but made it really difficult to find a phone support number which would seriously compromise their business income.

Lesson: Create a logical Information Architecture; add links to related items; cross-reference articles.

4.) Make it Easy to Learn

Casino games are mostly very easy to learn, don’t you agree? It can’t get any easier than inserting your bills, hitting the main button on the front panel or operating the lever to the side, wait until the reels have stopped spinning, compare the pattern of symbols on the reels with the possible winning combinations stated to the top of the machine and cash in the jackpot.
The actual difficult part is to get the people to play or use the machines. That’s when the Casino offers free lessons and sections with machines that pay well, everything to get you started.

Lesson: Help novice users to learn and avoid frustration by offering easy entry tasks.

5.) Provide relevant and attractive Content

Vegas has realized very early that sex-appeal and show makes a great combination, but it was limited to mostly the male population and that’s when the city started to transform itself into a family-friendly, theme-park like vacation destination with Castles, Musicals, Rollercoasters in and around the Casinos, 3D rides and more. Free drinks, cheap buffets, Day-Spa’s and a variety of other promotions added to the perfect experience. Attractive entertainment options could still be found at any corner in the form of bars, clubs and shows but lately I recognize a shift back to more go-go style entertainment in newly created bars in between the slot machines and tables. I guess the family-style hasn’t really worked out.

Lesson: Create attractive content that is relevant to your target audience; test and adjust if necessary.

6.) Make it Easy to Enter

Casinos do everything to get you into their building. Almost free (two dollar tip is ok) valet parking allows you to drop off your car quickly and one-directional moving walkways (obviously you need to walk back) shovel you inside, that’s where the music plays… Get the people where they want to be as quickly and easy as possible, show me the money!

Lesson: Avoid splash screens and flash intros; keep page sizes small.

7.) Avoid Windows and Clocks

There are two things you will never find in a Casino: windows and clocks. Right, nothing should distract your focus on the slot machines to the other wonderful Casinos outside and nobody wants to encourage you to make time-sensitive decisions (leaving the Casino early) by realizing how much time (and money) you have already spent during your visit.

Lesson: Avoid popup windows and time-sensitive triggers or forwarders.

8.) Make Sign-up Easy

Even though 100% of players think they can win only 1% will win. The only safe way to win in Las Vegas is to sign up for a Players Club. Handing over your name and address to the Casino will in many cases give you an immediate bonus of 5 or 10 bucks in free slot play, discount coupons for drinks and shows as well as little Thank you presents (wink-wink, Tropicana gives you a free T-Shirt and a deck of playing cards). Gambling itself is then rewarded through comps like more gifts, free buffets, free hotel rooms, free show tickets and more. I’m 11 cards richer now
Well, the sign-up process was easy enough, the only interaction with the clerk was handing over my drivers license and entering a PIN twice. Guess what, sure enough I always hit the Enter key after entering the PIN which wasn’t very well received by the system and the clerk. I don’t even know why I ended up apologizing. Why in the world can’t the system take care of that? Another day, another Casino, another Keypad, yes, another keypad, it was an actual computer keypad which is reverse to an ATM keypad and thus reverse to ALL the other keypads. Try your ATM PIN on your keyboard right now … exactly!

Lesson: Anticipate input errors and handle them gracefully; use common and widely accepted interfaces.

9.) Monitor User Behavior

There is no way one could walk into a Casino and cheat undetected. The famous ‘Eye in the Sky‘ is omni-present. 24/7 ‘Surround’-Surveillance captures every movement, every face and every deal. That doesn’t really worry me as long as they keep on bringing the free beer. It is clear that this kind of monitoring helps the Casinos to optimize their winnings not only by preventing cheats but also by detecting patterns in playing behavior and machine pay-out/malfunctions. I don’t see a threat in it as long as my face isn’t connected with the data collected.

Lesson: Use Server Traffic Log Analysis and Search Log Analysis to optimize your website.

10.) Make it Sexy

Sexy is probably the attribute I hear most often lately, it’s not ’slick’ or ‘beautiful’ anymore, it’s ’sexy’ now. That’s fine with me if only I knew what that means. Any ideas? Send them to me…
Anyway, what would be a blog about Vegas without mentioning sexy at least twice, huh?

Cheers and good luck!

This is the first in a series of blogs describing User-centered Design Methods. My goal is to summarize my experience, insights and findings across multiple literature and compile them into easy and quick to digest pieces for you to consume. I want to encourage you to comment your own experiences and give me feedback on why your company applies certain methods differently or not at all or something else altogether.

I personally don’t like the term Usability too much, it’s an empty buzz word. It means SOMETHING to everybody but isn’t scientific enough to be taken serious. It’s often interpreted wrongly and purely misunderstood by most. It’s kinda like Psychology, we know it is important to understand fundamental human behavior, their problems and remedies, but I wouldn’t pay a dime to go to a Psychologist. But who knows, just as Psychology got its scientific relevance and acknowledgment – partly maybe through the ‘invention’ of the IQ – hopefully Usability rises up to similar levels (Jeff Sauro offers interesting metrics via SUM (Single Usability Metric).

That’s why I like the term User-centered Design. It works wonders with Project Managers and the-like, probably because Design is such an important term in their daily work. And when asked about Usability testing I can conveniently point out that this is only one tool of many in my UCD toolbox. But the really important sales trick is to know which UCD method is best used at what time in the project management cycle.

The following chart compares the most common user-centered design methods, outlines their cost and shows when to use them:

Overview of user-centered design methods

Comparison of User-centerd Design (UCD) Methods

Method	Cost	Output	Sample Size	When to Use
Competitive Studies	Medium	Stat. & Non-Stat.	5	Requirements
Focus Groups	High	Non-Statistical	6-9	Requirements
Field Studies	High	Non-Statistical	2-3	Requirements
Heuristic Evaluation	Low	Statistical	2-3	Design
Paper Prototyping	Medium	Stat. & Non-Stat.	5	Design
Card Sorting	High	Statistical	15-20	Design
Participatory Design	Low	Non-Statistical	n/a	Design
User Testing	Medium	Stat. & Non-Stat.	5	Design & Evaluation
Surveys	Low	Statistical	20+	Requirements & Evaluation
Interviews	High	Non-Statistical	3-5	Requirements & Evaluation
Server Traffic Log Analysis	Low	Statistical	n/a	Evaluation
Search Log Analysis	Low	Statistical	n/a	Evaluation

Not long ago, after having completed a full project management cycle (requirements, design, implementation and evaluation) the PM proudly announced to perform a Focus Group with his stakeholders. Showing the ready application, he thought, would surely impress them and lead to valuable feedback for the next milestone. This impulse isn’t uncommon but has to be fought before it becomes reality. Does he really want to produce MORE and EXPENSIVE requirements? Because that’s the output of Focus Groups. Wouldn’t he be better off running 2 iterations of User Testing to reveal usability issues or a Survey to receive input from outside the development environment?

Recommendations

• Requirements:
  • Competitive Studies
  • Interviews
  • Field Studies
• Design:
  • Heuristic Evaluation
  • Paper Prototyping
  • User Testing
• Evaluation:
  • Surveys
  • Server Traffic Log Analysis
  • Search Log Analysis
  • User Testing
• The Usability effort is NOT proportional to the size of the project. Bigger projects spend less percentage on UCD with same effort. Regardless, as a rule of thumb assign 10% of the projects budget for UCD.
• Faster iterations of prototype design require less testers

References

• Fidgeon, T.; User-centered design (UCD) – 6 methods; Nov. 2005; http://www.webcredible.co.uk/user-friendly-resources/web-usability/user-centered-design.shtml
• IBM; User-Centered Design Principles; https://www-01.ibm.com/software/ucd/
• Nielsen, J.; Field Studies Done Right: Fast and Observational; 01/20/2002; http://www.useit.com/alertbox/20020120.html
• Nielsen, J.; How Big is the Difference Between Websites; 01/19/2004; http://www.useit.com/alertbox/20040119.html
• Usability in Practice: Three-Day Intensive Camp; Nielsen, J. et. al.; April 2006; Proceeding, Usability Week 2006

I just came back from a webcast held by Human Factors International titled “Who Are We Designing For? The Generation Dilemma”. It reminded me that even though most designers – me included – belong to the Generation X (or maybe especially because of that) we need to understand and recognize behavioral differences between generations when designing web sites.

Sidenote: This generalization must not prevent us from continuing to identify and define our target audience through personas or applying all the other UCD principles based on representative users. It is solely meant to raise awareness that we as designers need to be aware of these differences.

So, what are these generations?

“Baby Boomers”

• 78 Mio (US) / 1.11 Billion (worldwide)
• born between 1943-1960 (age 65-48)
• think of technology as a tool
• computer at work or at home (often not the latest model)
• use computer mainly for email or work-related activities
• use sites that help save time or serve relevant information

“Generation X”

• 55 Mio (US) / 1 Billion (worldwide)
• born between 1961-1981 (age 47-27)
• are technology savvy and career-focused
• keep their computer (desktop) in a separate room or office
• start their day with practical activities like reading news or checking stocks
• utilize computer for work but still keep balance of life and work
• use sites for practical tasks like online banking, news, travel preparation

“Net Gen”

• 80 Mio (US) / 2 Billion (worldwide)
• born between 1982-2000 (age 26-8)
• technology is inherent and part of life
• have their computer (laptop) by the bed
• start their day checking social activity online
• look for and do things that make them laugh, might be silly
• attention span is short, impatient
• use social networking sites like Facebook

How does the knowledge about these generational differences affect our designs?

The same guidelines for accessibility and usability like consistency or efficiency hold true but it is to be emphasized that certain guidelines must be enforced stronger for some generations while others can be loosened up. Here is a rough overview:

Baby Boomers:

• Simple look and feel
• Safe to use, more error-prone than usual
• Navigation in predictable places
• Hierarchies of information
• Step by step instructions
• Provide options to enlarge font sizes
• Things that don’t move, flicker, or play automatically

Generation X:

• Focus on quality content
• Provide ’do-it-yourself’ tasks
• Give control and allow customization

Net Gen:

• Content has to be attractive, innovative, can be quirky
• Design can be highly interactive
• Audio and video is not only accepted, it’s expected
• Entertainment is important
• Avoid pictures of elderly people (yes!)

How can a design satisfy all generations?

The answer is (as always): it cannot. Designs have to be focused on and implemented towards your key audience. A university web site needs to satisfy its customers, the students. The press, teachers and parents are without doubt important as well, but without satisfied students the university doesn’t even have to think about getting the press to visit the site.

There are ways to generalize your site’s content though:

• Identify the user (login) and present a customized UI
• Identify the content (landing page) and predict its likely customer
• Identify user preferences by explicitely asking

When writing content for the web it is essential to speak the language of your users. Become a word detective, use google trends. Words are the basic elements of links, get them precisely right to provide strong information scent. Identify trends, don’t invent them. Look at the evolution of language.

Get to the essence of the message! Stop ‘waving’ on your webpage (‘Welcome to the webpage of our company. We are proud to blah-blah…’).

Always remember that the user is in charge, the user is impatient, nasty, demanding, in a hurry and in control to spend its time somewhere else (according to Jakob Nielsen: ‘Users spend most of their time on other sites’). Online marketing is about giving attention (versus offline marketing is about getting attention).

Design Guidelines for Content

1. Make information easy to find with clear headings and meaningful sub-headings (not ‘clever’ ones).
2. Break up the information into manageable pieces.
3. Put the pieces in a logical order for your readers.
4. Keep your sentences short and employ one idea per paragraph.
5. Use the ‘inverted pyramid’ style: conclusion (context) first, results later.
6. Talk to your readers. Use “you”.
7. Write in the active voice (most of the time).
8. Put the action in the verb, not in the nouns.
9. Use your readers’ words.
10. Use half the word count (or less) than conventional writing.
11. Use bulleted lists where appropriate – for a list of items and for parallel “if, then” sentences.
12. Employ scannable text like highlighted keywords.

Best Practices

See my blog entry for Best Practices for accessible Content

References:

• Nielsen, J. (1997, 10 01). How Users Read on the Web. Alertbox: http://www.useit.com/alertbox/9710a.html
• Quesenbery, W. (2008, 05). Usability doesn’t stop when you write the content. http://www.apogeehk.com/articles/Usability_doesnt_stop_when_you_write_the_content.html

Suggested reading:

Don’t Make Me Think

Steve Krug. New Riders Press 2005, Paperback, 216 pages, $21.99

“If links were married they’d get divorced all the time! That’s because they can’t keep their promise.” (Gerry McGovern)

What Gerry means is that what links say they will do and what they actually do are total opposites. How many times have I believed, clicked and followed a link that promised me to ‘Download this or that’ just to find another page describing this piece of software. There I had to muddle through even more links just to find another ‘Download version’ link that yet again takes me to another page acknowledging the terms and conditions. The story could go on and on.

Remember: Good links are like magnets – they drive users to them.

With that in mind, here are the

Design Guidelines for Links

1. Color and underline link text (exceptions include lists of links like a navigation menu)
2. Reserve underlining for links (do not underline text that is not a link)
3. Use different colors for visited and unvisited links (e.g. shades of blue)
4. Avoid using color for text unless it is a link and never use blue for non-text links (even if your links are not blue)
5. Avoid changing the font style on mouse over
6. Avoid tiny text for links
7. Use appropriate spacing between links or use a clear separator
8. Use links primarily for navigation between pages
9. Link text must be describe the target as short and precise (clear call to action) as possible AND hold this promise!

Best Practices

See my blog entry for Best Practices for accessible Content

References:

• Nielsen, J. (2007, 05 14). Command Links. Alertbox: http://www.useit.com/alertbox/command-links.html
• Nielsen, J. (2004, 05 10). Guidelines for Visualizing Links. http://www.useit.com/alertbox/20040510.html

 

Suggested reading:

Killer Web Content

Gerry McGovern. A&C Black 2007, Paperback, 224 pages, $15.84