Page Content

For software documentation, it is often desirable to incorporate screen captures of particular windows or menus, and images could include lots of interface elements.

The key to accessibility is to ensure that the relevant information in the screencapture is included in the text instructions. Note that text plus images can provide an accessible alternative to a video screencast.

See examples below

Avoid Incomplete Information

Below is an example of what to avoid.

Create Accessible Data Table in Dreamweaver

Use the settings below to create an accessible table.

Dreamweaver Tables Properties Window. See next section for more details

ALT Tag

ALT = "Dreamweaver Tables Properties window"

 

Include Relevant Information in Text

Here is the Dreamweaver information with more details in the text which provide a detailed explanation for all developers.

Create Accessible Data Table in Dreamweaver

  1. In Dreamweaver, go to the Insert menu then Table. A pop-up window opens.
  2. Fill in desired settings for rows, columns, width, border thickness, cell padding and cell spacing.
  3. For the Header options, select from Left, Top, Both
    Note: Top or Both is the most widely supported in screenreaders.
  4. Enter in text for Caption and Summary as needed.
    Note: Caption is visible by default to all users, while Summary is used to provide extra information for those on screenreaders.
  5. Click OK to create the table

    Dreamweaver Tables Properties Window

ALT Tag

ALT = "Dreamweaver Tables Properties window. See information above"

Note that it is short because the additional information is included in the instructions above the image.

Top of Page