Repairing common WebCMS 7 accessibility problems
Since web sites created with SJSU's WebCMS 7 Content Management System use an accessible template, only the unique content on a page is likely to have accessibility problems. This page explains how to fix the most common problems (see Evaluating SJSU Template sites for how to find these problems). These instructions assume you are using the XStandard editor.
Alt text for images is not meaningful
- Right-click on the image.
- Select Image -> Properties from the menu.
- Change the text in the Alternate text (Required) box.
- Click OK.
PDF, Word, and other non-html documents are not identified
- Click on the text that links to a PDF, Word, or other non-html document.
- Use the arrow keys to move the cursor to the end of the link.
- Add (PDF), (doc), etc. to the end of the link.
- The link should now look something like this: Coded Memorandum AA-2006-41 (PDF)
Tables are not used appropriately
- To add column headers:
- Right-click in the top row.
- Select Table -> Row of headers from the menu.
- To add row headers
- Right-click in the left column.
- Select Table -> Column of headers from the menu.
Headings are not used appropriately
- Select the text to be used as a heading.
- Choose the appropriate heading level from the drop-down menu at the left of the toolbar.
Link text is not meaningful
- Select the link text to be changed.
- Type new text that clearly describes the target of the link.
Lists are not used appropriately
- Creating a simple list:
- Select the items you want to be in the list.
- Click the appropriate list button in the toolbar.
- Creating a multi-level list:
- Right-click the first item that should be in a sub-list.
- Choose Bulleted list (or Numbered list) -> Create sublist.
- Add the rest of the items that are in the sublist.
- Changing a list to roman numerals (I, II, III, IV...)
- Right-click on one of the list items.
- Select Numbered list -> List properties from the menu
- Click the Custom tab
- Enter the Attribute "style" and the Value: "list-style-type:upper-roman" (don't type the quotation marks).
- Click OK
- Change to the source code editor by clicking the <> button.
- Every form label should be surrounded by <label> ... </label>.
- Every form input should have a unique id.
- The "for" attribute in the label tag must match the "id" attribute in the input tag.
- For example:
<label for="local_search">Search the Accessibility site:</label><br />
<input type="text" id="local_search" name="qt" size="15" value="" />
Every id must be unique within that page.
Click the Validate button in the toolbar to make sure the code is still valid. Fix any validation errors before exiting source code editor.