Online Learning Resource Accessibility in a Lunchtime

Online Learning Resource Accessibility in a Lunchtime David Sloan @sloandr 8 June 2012 eLearning SymposiumPhoto credit: Flickr user @benshepherd University of Dundee

Accessibility and Online Learning• We know that technology can make learning environments more inclusive: – Digital text is flexible in appearance and format – Online learning resources enable use and aggregation of different formats (video, audio, animation) to support different learning styles – Online learning resources can reduce or overcome the impact of physical barriers on participation in educational experiences• But when we use online learning resources, we must avoid introducing new barriers David Sloan, 8 June 2012 2

But accessibility can seem daunting…• …so this talk will give you five lunchtime activities that you can apply to a specific web resource: – Check for a particular accessibility issue - and know why it’s an issue for some people – And understand what to do (or what to tell someone else to do) if you find the issue David Sloan, 8 June 2012 3

1. KEYBOARD ACCESSIBILITYPhoto credit: flickr user @bobjudge David Sloan, 8 June 2012 4

Keyboard accessibility: What to look for• Question 1: Can you operate the resource without having to use the mouse? – Can you navigate, access information, enter data, operate controls?• Question 2: Can you proceed logically and efficiently through a screen or application?• Question 3: Can you visually follow the tab focus?• Why? Supporting anyone who can’t use a mouse. David Sloan, 8 June 2012 5

Keyboard accessibility: How to check • Use your keyboard! • Use the tab key to navigate through the page • Use enter to select the link or form control that currently has focus Example: http://www.bbc.co.uk/news David Sloan, 8 June 2012 6

Keyboard accessibility: Actions• Fixing efficiency problems: – Add in-page navigation links – Reducing unnecessary links and form components – Optimising form design – Adjusting CSS to style a:onfocus and a:onactive• Sorting keyboard inaccessibility: – Likely to require modifying scripts that control dynamic behaviour – Provide alternative routes to accessing the same functionality? David Sloan, 8 June 2012 7

2. ALTERNATIVE TEXT FOR GRAPHICSPhoto credit: flickr user @saucesupreme David Sloan, 8 June 2012 8

Alternative text: What to look for• Alternative text that is: – Missing – Unhelpful – Redundant – Illogical• Why? Supporting people who can’t see images David Sloan, 8 June 2012 9

Alternative text: How to check• Automated tools (e.g. the WAVE: http://wave.webaim.org) – Can inform you of missing alternative text – And some dodgy alternative text• Human inspection – Look at appropriateness of text by viewing the page as text-only – Listen to the page using a screen reader – does the alternative text make sense when read out? David Sloan, 8 June 2012 10

The WAVE in action David Sloan, 8 June 2012 11

Alternative text: Actions• Change any alternative text that you find is problematic – Hand-edit the HTML (alt attribute of img element) – Or using a content management system/blogging software to select the image, and change its alternative text value David Sloan, 8 June 2012 12

3. USE OF COLOURPhoto credit: flickr user @daffydil David Sloan, 8 June 2012 13

Use of colour: What to look for• Question 1: Are there any instances of low-contrast text and background colours?• Question 2: Are there any instances of problematic colour combinations? (e.g. red/green, red/black, red/ blue)• Question 3: Are there any instances where colour perception is required to understand information?• Why? Accommodating people with colour deficit. David Sloan, 8 June 2012 14

Colour issues: How to check• Use your eyes! – Print off a page on a black and white printer – does information still make sense?• Colour contrast checking tools: – TPG’s Colour Contrast Analyser: http://goo.gl/Qfvbs – Snook.ca’s Online Colour contrast check: http://goo.gl/Zpq3• Use Vischeck’s simulator http://www.vischeck.com/vischeck/ to identify possible issues for people with colour deficit David Sloan, 8 June 2012 15

The Colour Contrast Analyser David Sloan, 8 June 2012 16

Colour issues: Actions• Low contrast colour schemes – Increase contrast wherever possible by adjusting colour values• Avoid use of problematic colour pairs• Provide redundancy so that information available via colour coding is also available without perceiving colour (e.g. asterisks, text)• If you can’t avoid colour problems, provide the same information in an additional format David Sloan, 8 June 2012 17

4. HEADINGS AND LISTSPhoto credit: flickr user @tonx David Sloan, 8 June 2012 18

Headings and lists: What to look for• Question 1: Are headings suitably identified in the page’s HTML?• Question 2: Are lists suitably identified in the page’s HTML?• Why? Important landmark information for screen reader users. Helpful ways to identify and break up text for everyone. David Sloan, 8 June 2012 19

Headings and lists: How to check• Check a page’s HTML code to see if what looks like a: – heading is actually identified as such (<h1>… <h6>) – List is actually identified as such (<ol> or <ul> + <li>; or <dl> + <dt> and <dd>)• Use a tool to highlight all headings and lists on a page: – e.g. the Web Developer Toolbar David Sloan, 8 June 2012 20

David Sloan, 8 June 2012 21

Headings and lists: Actions• Edit HTML to clearly identify headings• Edit HTML to clearly identify lists – Ordered, unordered, definition lists – Can use CSS to control appearance of the list and bullet points David Sloan, 8 June 2012 22

5. ACCESSIBILITY IN RESOURCE SELECTION POLICY ANDPhoto credit: flickr user@rubber_slippers_in_italy PROCESS David Sloan, 8 June 2012 23

Accessibility in resource selection policy and process• Question 1: Do you have a policy for selecting, commissioning, procuring, appropriating online resources for use in your teaching?• Question 2: If so, does it include accessibility?• Why should it? Accessibility should be part of a QA process – identify opportunities and threats early, rather than at the last minute David Sloan, 8 June 2012 24

Accessibility in resource selection policy and process• Consider the potential a resource offers to increase inclusion for specific groups• Consider the threat that the resource presents in terms of introducing new barriers…and how that threat can be dealt with: – Can the accessibility barrier be repaired? – Is there a workaround? – Accept the barrier cannot be removed and provide an alternative for affected groups? – Or reject the resource? David Sloan, 8 June 2012 25

Finding out more: accessibility at UoD• Checking the eAccessibility Blog: http://blog.dundee.ac.uk/accessibility/• Consulting with on-campus help and support: – Web Accessibility Support service – Alternative Formats service ( http://blog.dundee.ac.uk/altformats/)• Sharing best practice via the Inclusive Practice Showcase David Sloan, 8 June 2012 26

Summary• Those were some – not all! – things you can to to consider online learning accessibility• Lots of tools and techniques available to help you address accessibility and inclusion, bite by bite• Embedding accessibility into online learning resource selection and usage helps anticipate and deal with potential barriers David Sloan, 8 June 2012 27

THANKYOU!email: dsloan@computing.dundee.ac.uktwitter: @sloandrblogs: www.58sound.com --- blog.dundee.ac.uk/eaccessibilitywork: www.dmag.org.uk --- www.computing.dundee.ac.uk 28

http://blog.dundee.ac.uk	135
http://winahead.wordpress.com	13
https://twitter.com	5

Online Learning Resource Accessibility in a Lunchtime

by David Sloan

Accessibility

Categories

Upload Details

Usage Rights

3 Embeds 153

Statistics