How to Make Links
by Dave Tufts - February 29, 2008 / 12:08pm
I live by 3 rules:
- Blue text should only be used for links.
- All text links should be blue.
- Headers should not be links.
There are, of course, appropriate times to break these rules.
Exceptions to the rules, must follow their own set of rules.
- There is no exception to rule #1.
- If text links are not blue, they should be underlined.
- If headers are links, they should be the same color and style as non-linked headers. Also, the content that linked headers headline should have an inline link that duplicates the header link. An example of this is our homepage. The 3 blog headlines are links, yet they look just like non-linked headlines. In the content below, there is a blue "Read More" link that mirrors the headline link.
Add A Comment
Statements and opinions expressed in this blog and any comments
made are the private opinions of the respective poster, and, as
such, iMarc LLC is neither responsible nor liable for such
content.
RSS
3 Comments
We've been using yellow lines in the center of the road for many decades. That doesn't mean it's time to switch to purple for a change of pace.
Web page elements, like road markings, must be instructive for them to be of any use. The internet is a superhighway with markings that change every couple miles. It's unreasonable to inflict this upon users, and yet, that's what many designers do because they're frustrated by the standards. If civil engineers acted this way, people would get killed.
You can't easily get killed by bad web design, but you can have your time wasted. And time is the only thing we have that is truly limited...
That's the only rule without exception. If you have blue text, it better be for a link.
The default color for links should be blue, HOWEVER, I permit exceptions to that rule as long as you underline the non-blue link.
Check out the top 10 (most trafficked) website in the US:
http://alexa.com/site/ds/top_sites?cc=US&ts_mode=country&lan...
All 10 use blue as the link color. Windows Live (#6) makes extensive use of black links, but guess what? They're underlined!