1 / 0

Accessibility and ANGEL

Accessibility and ANGEL. Elizabeth Pyatt, D. Tusler ITS/TLT, accessibilityweb@psu.edu. Outline. Policy & Audiences Communication Tools Display Options HTML Editor Quizzing Other Accessibility Resources. Audiences & Policy. Accessibility Audiences. Blind (Severe Visual Impairment)

nantai
Télécharger la présentation

Accessibility and ANGEL

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 and ANGEL

    Elizabeth Pyatt, D. Tusler ITS/TLT, accessibilityweb@psu.edu
  2. Outline Policy & Audiences Communication Tools Display Options HTML Editor Quizzing Other Accessibility Resources

  3. Audiences & Policy

  4. Accessibility Audiences Blind (Severe Visual Impairment) Must use screen reader or Braille Low Vision (Some Vision) Must zoom in and rely on good contrast Color Blind (Color Deficient) Can’t rely on color coding alone Deaf/Hard of Hearing Captions & Transcripts Captions also benefit other students http://accessibility.psu.edu/captionworkflow
  5. More Audiences Cognitive/Learning May require extended time on quizzes/assignments Usability & legibility critical Neurological (e.g. Epilepsy) Please don’t flicker quickly Motion Impaired Can’t use hands (easily) Keyboard access easiest Avoid Mouse Only
  6. Syllabus Statement Syllabus statement pointing students to Office of Disability Services is required in all syllabi http://accessibility.psu.edu/syllabus
  7. Accommodations Policy Required When instructor receives accommodation letter from Office of Disability Services Recommended Easy fixes recommended for all courses Saves time if accommodation required Improves experience for other students Online/Hybrid Can you talk to a local instructional designer?
  8. Critical Issues Usable ANGEL components Images/Image Maps/Animations Add ALT Text Add Headings/Subheadings H1/H2/H3 or Heading 1/Heading 2 style Clear Link Text Data Tables Legibility Video Captions & Audio Transcripts
  9. Alternate Viewing Options Section 508 Frame free view Screen reader friendly
  10. Section 508 View
  11. Custom 508 View
  12. Display Options For Students 508/PDA Removes frames http://kb.its.psu.edu/cms/article/470 Accessibility Profile Customizes fonts, colors, screen reader settings http://kb.its.psu.edu/cms/article/10 http://accessibility.psu.edu/angel#display
  13. ANGEL Communication Tools e-Mail Forward ANGEL mail to “Internet” account Discussion Board Consider Blogs (w/commenting) Chat Consider alternate chat client (e.g. IM tools or Skype)

  14. ANGEL HTML Editor

  15. ANGEL HTML Editor Available in multiple tools E-mail, page, quiz (“assessment”), dropbox, syllabus editor Benefits Good editing tools HTML easiest for screen readers, other tool to process
  16. ALT Tag/Text/Attribute Image from Wikipedia Text which replaces image if it can’t be processed ALT=“Washington at Valley Forge in winter snow” Appears when image fails to load
  17. Adding ALT Text Add “Short Description” or “Alternative Text” when inserting image.
  18. Usefulness of ALT Text Page with images not loaded and missing ALT text Images from BBC
  19. Pick the Best Two ALT Tags Context: 6 Nationalities of Texas Wow, Six flags over Texas! Image taken from Wikipedia. Photo by Ann W. 220px_Six_flags_over_Texas.jpg Photo shows flags of Spain, US, Mexico, France, Republic of Texas and Confederate flag Photo of six flags read information below Photo shows 6 flags of different colors waving in the breeze on a sunny day. Three are red, white and blue….
  20. Full Image of Six Flags
  21. Complex Images Too complex for an ALT tag Describe in main text and use short ALT text Colonial New Netherland stretched from New York City (New Amsterdam) up Hudson River Valley to north of Ft. Orange (modern Albany) Colonial New Sweden was centered on the Delaware river and stretched from the head of the bay to a little south of Trenton. (Text includes details not in image) Image from Wikipedia
  22. ALT Tag Exercises Twinned Pyrite Crystal(Wikipedia) Athens Greece (Wikipedia)
  23. Unclear Link Text Avoid For more information about accessibility, click here Or learn morehere, hereandhere “Learn about additional international resources that might be useful in class or in research” Blocker because Screen readers search for/scroll through links “Here” is small (hard to find) and ambiguous Try This You can get more information from Accessibility at Penn State Learn more from “International Music Links” This strategy works across all tools!
  24. Scanning Links on a Screen Reader
  25. Headings on a Page Wikipedia article using subheadings to mark topic changes
  26. Headings on Screenreaders Screenreader users can call up lists of headers and links in their screenreader and jump to that point in the screen
  27. Headings in HTML Editor Access in Format menu
  28. Marking Large Text as Headings HTML Editors Look for Heading 1…Heading 6 menu option =H1,H2…H6 tags Word Heading 1…Heading 6 styles PowerPoint Slide titles Bullet levels
  29. Tables: Simple vs Complex Simple Tables Have no merged cells or empty cells Rows represent one type of data Columns represent another type of data Are easier to accessify Are easier for screen readers to process Complex Tables Are popular, but not always user friendly Tricky to maintain Often based on layout from print sources We have different options on the Web!
  30. Well Marked Data Table CAPTION “Windows ALT Code for Currency Symbols” TH = Table Header 1st row 1st column Headers allow screen readers to match cell with row, column
  31. ANGEL Table Tools Allows you to add caption, headers, summary (invisible, but read on screen reader)
  32. TABLE Troubleshooting 1
  33. Add Styled Captions, Headers
  34. Very Very Complex Table
  35. Maybe it’s a List Proto Germanic (750 BC - 1 AD) East Germanic (1 AD - 300 AD) Gothic† (mostly extinct by 9th century AD) Vandalic† (extinct by 6th century AD) Burgundian (extinct by 6th century AD) Crimean Gothic† West Germanic (1 AD - 300 AD) Irminonic (High German) to Old High German to German Istaevonic/Franconian to Old Frankish to Middle Dutch Dutch Afrikaans Ingvaeonic Old Saxon to Low German/Saxon Anglo-Frisian Old Frisian to Modern Frisan Old English Scots English
  36. Accessifying Tables http://accessibility.psu.edu/ http://accessibility.psu.edu/tables Choose technology option Website includes Event Calendar What To Fix Fixes for Common Tools (covers many teaching tools) Multimedia (Video/Animation) Web Developer Reference
  37. Color Contrast (Luminosity) Affects low vision, color deficient Not toovivid or toobright But not too subtle or too light either Like medium red, dark gray, dark teal on white Avoid orange/yellow and white Use with black instead Read More http://accessibility.psu.edu/contrast
  38. Supplement Color Coding Use color coding, but make sure it’s OK in black and white Green check & red X Labels in or near colored areas Red-blue safer than red-green Read More http://accessibility.psu.edu/color

  39. Assessments:Quizzes and Questions

  40. Override Settings by Team If a user requires a personal accommodation Extra time on quiz or dropbox Special quiz setting One page at a time for screen readers Deadline extension (for anyone) Create “team” of 1, and override settings Teams tool in Manage tab http://kb.its.psu.edu/cms/article/106 http://kb.its.psu.edu/cms/article/27
  41. Access Settings and Team List
  42. Override Settings, Advanced
  43. ANGEL Select Question page
  44. Radio Button: Accessible and Usable Found in Multiple Choice, True/False Highly accessible The radio button is easy to select gives the user the option to select before and after the question. http://accessibility.psu.edu/angel#quiz
  45. Multiple Select Questions: Accessible and Usable Check boxes are provided that have the same beneficial functions the Radio Button; before and after selection! Specify “Check all that apply”
  46. Combo box Popup: Accessible BUT NOT Usable Combo box popup The selection boxes do NOT repeat after the question. Multiple selecting required. One to select the pop up. Second to select a choice. The alphabetical bulleting is automatically formatted even though the combo box popup is numerical selections for ordering questions. Choices can be selected more than once.
  47. Matching: Accessible, NOT Usable Requires a tabular list of information above. Long list of choices maybe cognitively challenging on short-term memory.
  48. Ordering; Accessible, NOT Usable Ordering Issues Combo box popups in ordering questions use numerical selection and is associated with an alphabetical order in ANGEL. The task is NOT explained in context of the selection tool. The same number can be selected twice. Difficult to navigate back to change an answer.
  49. Re-worded Ordering Questions Explain the task Limit the number of items to be ordered. Combo popup boxes still NOT user friendly. Use Multiple Choice version of question. Still difficult to navigate to change answers Multiple selecting process
  50. Multiple Choice Alternate for Ordering Worst version More usable multiple choice
  51. Fill-in-the-Blank: Accessible and can be Usable Potential Gotchas The task maybe unclear. The blank space requires filling-in before the context of the sentence is understood. Navigating back to the blank space is difficult.
  52. The Usable and AccessibleFill-in-the-Blank Provides the user to hear the entire sentence first before inputting the answer. Allows the user to hear the entire paragraph before entering the answer. Using a word bank? Identify them and place them before the paragraph.
  53. How to write a Fill-in-the-Blank/Cloze Use _1_ to control position first blank Then _2_, _3_...
  54. NOT AccessibleGames/Flash Games = Crossword Puzzle, Quiz Show

  55. Wrapup

  56. Files/Links All should be accessible as possible Decent options Many HTML Editors Microsoft Word & PowerPoint http://accessibility.psu.edu/tools Very Difficult to Accessify PDF, Flash
  57. Microsoft Office Accessibility See other ITS Training Sessions Microsoft Office Accessibility Add ALT Tags Use Headings (and Slide titles) Use legible fonts Color contrast in slides Headers, titles for tables http://accessibility.psu.edu/microsoftoffice
More Related