Accessible Links

Some guide­lines for acces­si­ble hyper­links that I emailed to some­one awhile ago…

  1. Most impor­tant, make sure the actual link is descrip­tive (not just the sur­round­ing text). Users of screen read­ers can tab through links and the screen reader reads only the linked con­tent. If the link reads “Click Here” or “Down­load Now.”
  2. If a graphic is really nec­es­sary and used for a linked item, be sure that is has an appro­pri­ate alt tags
  3. Con­sider use of the title attribute if needed for doc­u­ments with long titles or doc­u­ments offered in mul­ti­ple formats
  4. When pos­si­ble, avoid the use of pop-up win­dows. If nec­es­sary, be sure to inform the user that by click­ing on the link they will be leav­ing the site
  5. Add a ‘Skip Nav­i­ga­tion’ link at the top of a page to allow users to skip to the con­tent of the page (alter­nately, con­sider a ‘Skip Con­tent’ link if needed to access nav­i­ga­tion easily)
  6. If nec­es­sary, add the tabindex func­tion to hyper­links to spec­ify the order that they tabbed to
  7. If links are on the same line, be sure to use a separator

Oth­ers?

  1. Sergi says:
    November 18, 2004 at 3:32 am

    I’d say most impor­tant is hav­ing a proper href point­ing to a url. No javascript: pseudo-protocol, please.

    If you ever feel like adding a popup, just use smth like onclick=“window.open(this.href, options…);return false;”

    Most of the browsers will under­stand the onclick and open it, but those that dont, will at least fol­low the href. :)

  2. David Spinar says:
    November 18, 2004 at 9:29 am

    I agree with Sergi. When using pop-ups, inform­ing a user is not suf­fi­cient. You should use a proper con­tent of href attribute.

    And I would add 2 more rules:

    1) Dis­tin­guish links from other text con­tent with more than just color, so that users that can­not “see” the color (because of their visual impair­ment or hard­ware device) can rec­og­nize it. Under­lin­ing is of course the best way.

    2) Do not use the same link text for var­i­ous link tar­gets. Use for each tar­get unique and well destrip­tive link text and do not rely on con­text. When it is impos­si­ble to dis­tin­guish it in link text, dis­tin­guish it in title attribute.

    (sorry for my poor eng­lish — I am not a native speaker)

Reply

or

Archives and Categories

Subscribe subscribe

About

Twitter