Skip to main content

Fujitsu

United States

Archived content

NOTE: this is an archived page and the content is likely to be out of date.

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

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

Top of Page

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

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

Top of 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

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

Top of Page


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

GND_ac_badBad example: narrow space between lines

spaced links

GND_ac_goodGood example: displaying differences in segments using pointers with color

links too close to each other

GND_ac_badBad example: nothing but a space in between links

separator between links

GND_ac_goodGood example: displaying differences in segments using pointers with color

Top of Page


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

GND_ac_badBad 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

GND_ac_goodGood example: when the text is also linked

Top of Page


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

GND_ac_badBad example: link without an underline

underlined text links

GND_ac_goodGood example: link with an underline

only small images

GND_ac_badBad example: Images not in button form

images on clear button images

GND_ac_goodGood 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

GND_ac_badBad 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
GND_ac_29_wrong2

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

Top of Page


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.