THE POSSIBILITIES ARE INFINITE

  1. Home >
  2. Accessibility >
  3. 2nd Priority >
  4. Linking

22. Linked words should give an understanding of the content of the link target (do not merely use "here", "click here" or demonstrative pronouns to refer to link targets).

Some Web browsers provide a function which only reads aloud text which is linked. If linked words are shown as "here" or "click here" there is no indication of the difference between links nor the content of the link target.

Example and Implementation

  • Words which are linked should allow the user to make inferences about the content of the link target.
Linking words here and click here make little sense

Bad example: Distinctions between link targets cannot be made because if "here" or "click here" is used, only those words are read aloud

23. Make the basic tools for operating your site (such as "back") as well as the expressions for basic elements (wording, color scheme, positioning and button shapes) consistent throughout the site.

If the basic tools for performing actions within your site (such as "back") and the expressions for basic elements (wording, color scheme, positioning, button shapes, etc.) differ from page to page, persons who have visual and upper limb disabilities have trouble manipulating and grasping the content.

Example and Implementation

  • Make expressions for basic elements and basic actions, through positioning, shape labeling and color, consistent throughout the site.
  • Provide a common navigation bar throughout the site.
identical titles help viewers

Good example: use of the same navigation bar on every page

24. Provide internal links to the main body of content so that the common navigation bar or menu can be skipped.

If there are long navigation bars at the beginning of every page in your site, audio browsers read aloud the navigation bar when displaying the page. There is a time delay before the browser gets to reading the main body of the page.

Example and Implementation

  • Place a link to the main body of page content right before the navigation bar. By making this a one pixel transparent image, the visual display is not effected.
hidden jump link for audio browser users should be embedded

Good example: Provide an internal link with a transparent image. Audio browsers can reference these links.

25. Ensure there is adequate space between adjoining screen elements (words, images, etc.) which have differing functions (links, etc.).

When linked screen elements (words, images, etc.) are alongside each other, it can be difficult to distinguish where one link ends and the other starts. Persons with upper limb disabilities and the elderly can also have trouble selecting the link they want with the mouse.

Example and Implementation

  • Provide adequate space around screen elements which are linked.
  • When listing links horizontally, insert vertical lines or slashes between each text link to break them.
  • When listing text links vertically, use style sheets to widen the space between the lines.
  • Place a space between adjoining letters for single-character text links.
links too close to each other

Bad example: narrow space between lines

spaced links

Good example: displaying differences in segments using pointers with color

links too close to each other

Bad example: nothing but a space in between links

separator between links

Good example: displaying differences in segments using pointers with color

26. Provide an adequate link area for key elements (words, images) to be certain they can be manipulated.

When the linked area of key elements is small, persons with upper limb disabilities and the elderly can have difficulty selecting the link they want.

Example and Implementation

  • Link the entire text segment, use large images or text so that the link range can be deciphered.
not easy to click  on with the mouse because only a small image has the link

Bad example: only the tiny arrow image is linked

easy to select with the mouse because the text as well as the image have the link

Good example: when the text is also linked

27. Make it obvious that a key element (words, images) is linked just by looking at it.

Beginners and the elderly can overlook the existence of links if text is not underlined or photographs are used.

Example and Implementation

  • Do not eliminate underlines from linked text.
  • Make linked images look like buttons. (Surround with a frame, attach a drop shadow, etc. Style should be consistent throughout the site.)
no underline for text link

Bad example: link without an underline

underlined text links

Good example: link with an underline

only small images

Bad example: Images not in button form

images on clear button images

Good example: images expressed with buttons

28. Do not link directly to graphics files, instead make an HTML file to display the image and link to the HTML file.

When the target link is a graphics file, audio browsers cannot read aloud the content of the graphic. Please avoid direct display of graphics files, whether in windows or frames.

Example and Implementation

  • Create an HTML file to locate the image, and make it the link target.
image file is displayed by selecting thumbnail image

Bad example: Link to a graphics file. Voiceover by an audio browser is impossible.

29. Display the target link in the same window, and reserve use of opening a new window for when it is absolutely necessary.

People with visual disabilities and the elderly either do not notice that a new window has been opened, or can be disoriented by the change. This means that the action of displaying the previous page can be difficult. Furthermore, unnecessary windows need to be closed when a number of new windows are opened, and persons with upper limb disabilities may have trouble with this action.

Example and Implementation

  • Restrict the use of display in new windows to information that you want to have referred to simultaneously, such as help.
New browsers filling viewers screen

Bad example: No back button for when you want to display the previous page, while too many windows can be opened.

30. Not automatically displaying another page (redirecting to another page) or automatically updating the page you have on display.

People with visual disabilities and the elderly either do not notice the automatic change of page, or can be disoriented by the change.

Example and Implementation

  • It is acceptable to automate such things as a page redirection when a site’s URL has changed, but please describe this automatic shift using text.
  • It is acceptable to automatically change the page when the user is able to adjust the time between the updates and has the choice of whether to update or not.