1 / 24

Accessibility & WebCT

Accessibility & WebCT. Joe Wheaton, Ph.D. Overall Recommendations. Screen readers pause for punctuation. Use it for emphasis. Use both the link and the graphic in content windows to provide a bigger target. Use text boxes to give additional information.

debra-cotton
Download Presentation

Accessibility & WebCT

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Accessibility & WebCT Joe Wheaton, Ph.D.

  2. Overall Recommendations • Screen readers pause for punctuation. • Use it for emphasis. • Use both the link and the graphic in content windows to provide a bigger target. • Use text boxes to give additional information. • Students should hide the Course Menu – it’s redundant and takes up space

  3. General WebCT Issues • No DOCTYPE • Browsers use DOCTYPE to validate the code. • Assistive tech needs good code to work right. • No language declaration <html lang=“en”> • Still using deprecated tags <font> <b> etc. • Must use javascript & frames • BUT -- Using style sheets for markup • And all WebCT images alt-tagged.

  4. <label for="webct1">Username:</label> <input size="15" required name="WebCT_ID" id="webct1"tabindex="1"> <label for="webct2">Password:</label> <input type="password" size="15" required name="Password" id="webct2" tabindex="2"> I <input type="submit" name="submit" value="Login" tabindex="3"> Login Screen • Cursor defaults to Username box. • Form fields identified correctly (WAI 10.2) • Form fields marked up correctly using explicit tags: <label for> and <id>

  5. The WebCT logo could be linked to Courses My WebCT • Table is used for layout, which is OK, but JAWS reads the whole page, starting with the logo. • Adding a link to skip to main content (WAI 13.6) would speed reading.

  6. Button_parent Logo Tool_nav ??? – Unclear The Course Homepage • Four frames but names aren’t descriptive (WAI 12.1)

  7. Hide Navigation • Navigation creates another frame, the links are often redundant, and it takes up space. • Hide it.

  8. Number the files to help clarify the lessons Content Modules • Content Modules are one method of providing content (e.g., lessons) • Hint: Number files to clarify.

  9. Disadvantage of Content Modules • They open in a new browser window (OK, if you tell people) but they also add another frame (for the “Action Menu”). There are now 7 frames.

  10. Organizer Page • Another way to organize lessons, etc. • Designer can set it so files open in new window, (tell students this is happening) • It facilitates printing (it’s not in a frame) • Don’t add icon to links to simplify page • Much simpler for students

  11. Chat and Whiteboard X • Chat doesn’t default to text entry box. • Don’t know when new messages arrive. They don’t read automatically. • Whiteboard is a visual medium. • Forget ‘em

  12. Quizzes & Surveys Page • Opens in new frame (now there are 5 frames). • Viewing grade and class scores is in frame 4. • Listing of quizzes is in frame 5. • List of quiz links is in a table . • Allow only active quizzes to show on list to avoid confusion. • Must allow pop-ups to view quizzes. Statistics & scores in one frame Now there are 5 frames. A list of the quizzes are in the another.Hint: Show only active quizzes

  13. Quizzes & Surveys • Questions and answers in different frames and the answers (radio buttons) are not associated with the question through a <fieldset>. • The question should also be the <legend> so it will be repeated with each answer. Thus, these multiple choice answers cannot be associated with the question. These radio buttons have explicit labels, but are not part of a <fieldset> and the question is not the <legend> so it is not associated with the buttons

  14. Quiz Summary:They are VERY Confusing • The quiz opens in a new browser. • Students can’t begin quiz till it fully loads. • Page reloads again when answers submitted. • Students need extra time or untimed quizzes to make up for the screen reader slowness. • Answers not associated with questions. • Hint: Try delivering the questions one at a time with option to revisit to reduce loading time.

  15. Contains a blank.gif & “skip navigation” link or you’d hear all the months & years Data table marked up correctly <TH scope='col'>Saturday</TH> Clicking on a date takes you to “Date information” (a form) Calendar • Contains a blank.gif & skip navigation link or you’d hear all the months and years. • It’s a data table marked up correctly with header cells at the top of the columns and a “scope=col” attribute. • Click on a date take you to the information for that date.

  16. Date information • The date information is shown in a table but clicking on “Add entry” takes you to a form

  17. Calendar Data Entry Form • No “skip navigation” link this time, but form marked up correctly

  18. Contains a blank.gif & “skip navigation” link Compose creates a new message Tables correctly marked up using <TH scope=“col”> The Main Mail Page • The mail image has a good alt-tag. • Compose mail message button goes to mail input. • Current mailboxes and the number of messages in each is in a table. • The columns are correctly marked up using the <TH> element. • Links go to mailboxes with mail itself

  19. But you need to be in forms mode to enter names, and this was confusing. Starting a new message puts you in “Send To:” (Note: Discussions are the same as mail except they go to the whole class so there is not “Send to” box.) Mail and Discussions • Starting new message opens new window with a table. User needs to get into forms mode to find the “Send to” box,” which provides the names of the members of the class. • Must then click on individual names using Ctrl-Enter. Must have pop-ups allowed. • Discussions are the same as mail, except they go to the whole class so there is no “Send to.” Form cells marked up correctly

  20. Contains a blank.gif & “skip navigation” link A Typical Mailbox • There is a skip navigation link.

  21. Contains a blank.gif & “skip navigation” link Reading a Message • Contains a skip navigation link and reads pretty well.

  22. Give Students More Information • Provide information (e.g., text boxes, site map) • Use highly descriptive titles or explanations • Open pages in new browser window, when possible, but tell people it will happen • CREATE ACCESSIBLE CONTENT! Use

  23. Summary: A long way to go • Some featuresunusable (Chat and probably quizzes) • Others getting better (alt-tags, skip nav links)

  24. Some Resources • Section 508: • http://www.section508.gov/ • WAI: • http://www.w3.org/TR/WAI-WEBCONTENT/ • Ohio State University Web Accessibility Center: • http://www.wac.ohio-state.edu/

More Related