Sunday, September 26, 2010

CSS Tutorial : Link states

By default, links are displayed underlined and in blue when viewed in a web browser.
However, links have five states, and their visual appearance varies depending on the current
state of the link. The states are as follows:
link: The link’s standard state, before any action has taken place
visited: The link’s state after having been clicked
hover: The link’s state while the mouse cursor is over it
focus: The link’s state while focused
active: The link’s state while being clicked
The visited and active states also have a default appearance. The former is displayed in
purple and the latter in red. Both are underlined.
If every site adhered to this default scheme, it would be easier to find where you’ve been
and where you haven’t on the Web. However, most designers prefer to dictate their own
color schemes rather than having blue and purple links peppering their designs. In my
view, this is fine. Despite what some usability gurus claim, most web users these days probably
don’t even know what the default link colors are, and so hardly miss them.
In HTML, you may have seen custom link colors being set for the link, active, and
visited states via the link, alink, and vlink attributes of the body element. These attributes
are deprecated, though, and should be avoided. This is a good thing, because you
need to define them in the body element of every page of your site, which is a tiresome
process—even more so if they later need changing; as you might have guessed, it’s easier
to define link states in CSS.

No comments:

Post a Comment