Design Guidelines: Links
"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
- Color and underline link text (exceptions include lists of links like a navigation menu)
- Reserve underlining for links (do not underline text that is not a link)
- Use different colors for visited and unvisited links (e.g. shades of blue)
- 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)
- Avoid changing the font style on mouse over
- Avoid tiny text for links
- Use appropriate spacing between links or use a clear separator
- Use links primarily for navigation between pages
- 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
Similar Posts:
Enjoy this article?
About Michael Gaigg
Michael Gaigg is a User Interface Expert at ESRI. His expertise includes User-centered Design (UCD), Usability, Accessibility and Section 508, Web Development and Web Design.
Recent Posts
- 500+ Free Stunning PC Icons August 31, 2010
- Highlights of Week 32/2010 August 16, 2010
- How to use the Google Font API August 10, 2010
- Secret of Pixar’s Success [Link] August 6, 2010
- Esri listens to their Users and changes Pronunciation of its Name August 3, 2010
- Highlights of Week 30/2010 August 2, 2010
Categories
Accessibility (13)
Code Samples & Tips (4)
Design Guidelines (11)
- Design Guidelines: Print Stylesheet
- Design Guidelines: Transactional Email
- Design Guidelines: Error Messages
- Design Guidelines: 404 Error Pages
- Design Guidelines: Radio Buttons versus Checkboxes
- Design Guidelines: Breadcrumbs
- Design Guidelines: 'About Us' Page
- Design Guidelines: Pagination
- Design Guidelines: Content
- Design Guidelines: Links
- Visual Web Design
Go figure (7)
Good News (11)
Here and there (11)
This Week’s Highlights (23)
Usability & UCD (14)
Web Design (13)
Popular Posts
- Make it easy for your customers to throw money at you!
- Web Content Accessiblity Guidelines (WCAG) 2.0: Overview and Structure
- Section 508: WCAG 1.0 or WCAG 2.0?
- Go figure: 10 Comic Strips that have Something in Common
- Powerpoint Wireframe Stencils as Free Download
People that inspire me
- Björn Seibert
- Boxes and Arrows
- Bruce Temkin
- Christian Heilmann
- David Leggett
- Gez Lemon
- Hannes Schmiderer
- Harry Brignull
- Henny Swan
- Jared Smith
- Jared Spool
- John Rhodes
- Joshua Porter
- Kel Smith
- Scott Berkun
- The Access Pond
Tags
What I'm Doing...
- Top 20 Wireframe Tools http://t.co/zRBd0W0 via @garmahis 1 week ago
- RT @wpzoom 500 Free Icons: WPZOOM Social Networking Icon Set http://bit.ly/aEGdUJ 2 weeks ago
- RT @esriuc GIS: Designing Our Future. The concept of GeoDesign is really taking off, keep an eye out. http://bit.ly/9TioWQ 3 weeks ago
- 1400 super cool web icons by FatCow: http://bit.ly/ctskcU 3 weeks ago
- [JOB OPENING] User Interface Engineer, http://bit.ly/ui-engineer-position 2010-07-30
- More updates...
Posting tweet...