Web Design: Should Hyperlinks Have Underline?
Today, i decided to change the CSS on my site so that links are not underlined.
I'm in the old school of thought that interface should be simple, and not change much. The default rendering of hyperlink with underline is established tradition since the first web browser in the early 1990s. It gives user a consistent recognition of links, everywhere.
Though, the underline rendering got problems. When many words are hyperlinks in a sentence, underline makes them less readable and obtrusive. As i write more and more and create more and more links, i become more aware of this problem.
After surveying 20 other popular websites, i find that they all do not use underline. Examples are:
Magazines:
In fact, it would be hard to find a site that still use underline for links. (there are few exceptions. Typically, pages with simple layout or format still use underline. For example, Google search, and some amazon.com pages.)
In browsing websites in the past years, i don't remember ever got confused about where or which are links. I think no underline has been the accepted practice since perhaps 2005.
When the web started in about 1994, underline might be a good decision because there are not that much text, and no graphics, no CSS, no sites for news, shopping, stocks quotes, gaming, forums, social networks, youtube, etc. The only content is just about plain academic text and embedded simple images. But with today's web since about early 2000s, rendering underline to hyperlinks is not appropriate, since there are too much text in diverse and complex layouts (e.g. newspaper multi-column; menus; tabs, login boxes, drop down menus, pop up snapshots …). Underline all active links make it unreadable.
Here is the CSS code to turn underline off. Underline will show only with mouse hover.
a:visited, a:link {text-decoration:none} a:link:hover, a:visited:hover {text-decoration:underline}