Maintainers of WebLearn sites need to be aware of accessibility issues, for users with various types of impairment Why are accessibility issues important? Have you ever experienced problems such as Repetitive Strain Injury (RSI), sore eyes, headaches, back or shoulder aches from long term use of a computer? Are you perhaps colour blind, have a touch of , or need magnification of the computer screen? Are you sensitive to screen flashing due to photo-sensitive epilepsy? It is not only major sensory impairments such as vision or hearing which impede people in their use of technology. In many cases, assistive/adaptive/access technology (AT) can be used to enable or facilitate the use, navigation, creation or completion of electronic materials (such as web pages, online forms, Internet services and products) that would be inaccessible by conventional means. Assistive technologies include screen readers (such as JAWS, ReadPlease, BrowseAloud) or screen enlargers (magnifiers), voice recognition systems, alternative input devices such as eye or head operated pointing devices. The Opera browser now includes voice-enabled shopping and booking systems and spoken commands to browse the web. What types of impairments need to be considered? It helps to classify types of impairments in order be able to address differing needs (AbilityNet (www.abilitynet.org.uk) • Vision – including blindness, partial sightedness, colour blindness and tunnel vision • Hearing – deaf and partial hearing • Headings are an absolute Mobility problems – RSI, problems with using hands or arms asset – you can key through • Cognitive, mental problems – including dyslexia, learning problems them by ‘arrowing down’

A quotation from a blind person browsing internet sites with the help of a : (using the down arrow on the keyboard) Holistic approach to web design Build your Content first (in a simple, linear layout), add styling on top of that (e.g. stylesheet ()), build ‘behaviour’ on top of that (e.g. clicking and dragging a Google map). Following the principles of good web design means that a website will ‘degrade gracefully’ and have more chance of being keyboard accessible in a linear format. Legislation 1. SENDA (Special Needs Education Disabilities Act) 2001 is the Education application of the Discrimination Act (DDA) which has been law since 1999. Institutions need to demonstrate that ‘reasonable adjustments’ have been implemented in terms of accessibility. 2. Web Content Accessibility Guidelines (WCAG) – Oxford University currently uses version 1.0. Version 2.0 (http://www.w3.org/TR/WCAG20/) introduced some significant changes in 2008, including the four main principles: Web content should be Perceivable, Operable, Understandable, Robust (POUR). See WebAIM’s checklist according to WCAG 2.0 requirements: http://www.webaim.org/standards/wcag/checklist 3. The UK Equality Bill currently before the House of Lords will introduce a powerful new integrated duty of equality. Top 10 accessibility issues (WCAG 1.0) The WCAG guidelines can be summarised into several main areas that require attention: 1. Alternative text 2. Clear language 3. Accessible multimedia 4. Structuring content – headings, links 5. Appearance of content – colour, contrast and text size 6. Keyboard accessibility – making information accessible via the keyboard as well as via the mouse 7. Movement – flashing content, animations 8. Hypertext 9. JavaScript 10. Accessible PDFs (see next page)

DOC-78 This work is licensed with some rights reserved, see http://creativecommons.org/licenses/by-sa/3.0/ 12 December 2016 Hints and tips Here is a short list of some hints and tips to begin working towards accessible web content: • Avoid full justification – large gaps between words cause difficulty for dyslexic users • Use a sans-serif font, not a serif font – easier to read, particularly for dyslexic users • Use rather a beige or off-white background, rather than white (and without background images) • Use the alt tag “” (empty) to tag an image that is for decorative purposes and should be ignored by a screen reader • Alt text on a link should describe where the link will take you – the destination • Check that enlarged text wraps properly for magnification users – in your browser, use View > Text size > largest • For magnification users, the text scales up, but images can become ‘blocky’ – check their resolution • Keep buttons close to form elements, e.g. the Search button should be close to the Search input box • Don’t use tables to govern page layout – use style sheets instead • It’s ok to check your page with an accessibility toolbar, but double check with a screen reader as well • Label graphics effectively and clearly • Strive for clear and accurate headings and link descriptions • Videos – provide an alternative way to access the information, such as a transcript; provide captions • The use of the HTML tag – as opposed to (bold) – will cause a screen reader to read that part of text more loudly than the rest • Java Script is no longer to be avoided, but where used, it must be accessible – i.e. it must work with keyboard controls Making PDF documents accessible The vast majority of PDF files on the web are claimed to be 'for printing'. Read aloud software will not necessarily make the PDF file accessible. If the author of the PDF file did not make simple adjustments for the end user, then the reading order will not be what you would expect and could even end up being gibberish. Key principles of creating accessible PDFs: 1. Make your original document in Word/Open Office etc. accessible • use the built in heading styles • add alt tags to your images • images should be ‘in line with text’ and not floating 2. Convert to PDF 3. Check and fix remaining accessibility issues: in Adobe Reader 9.0 use Document –> Accessibility Quick Check 4. Then publish or distribute your PDF file Note: Often it is better to convert to another format such as HTML, which is far more accessible Useful websites • Oxford University Oxford University: Accessibility Statement • Jisc website: Search for Accessibility: https://www.jisc.ac.uk/guides • post on TechDis presentation at Oxford Univ (June 2012): http://blogs.oucs.ox.ac.uk/adamweblearn/2012/06/techdis-assistive-technology/ Useful software • Free screen-reader to experience how your website will be read out to a visually impaired person: NVDA can be downloaded from www.nvda-project.org • Marco’s blog: Guide to using NVDA including required keystrokes and how to check your webpage for different aspects of accessibility: http://www.marcozehe.de/articles/how-to-use-nvda-and-firefox-to-test-your-web-pages-for- accessibility/ • Free toolbar from Vision Australia that allows developers to manually evaluate web pages for accessibility. Its options include: analysing components of a web page (such as images, colours, headings, links), simulating user perspectives, and providing links to additional resources for evaluating web pages for accessibility: http://www.visionaustralia.org/digital-access-wat • Dragon Naturally Speaking – voice recognition software can be used to navigate web sites by giving spoken commands (costs around £150): http://www.nuance.co.uk • textHELP and Read&Write Gold – part of an accessibility suite of applications http://www.texthelp.com/ Browser accessibility features Check the Help features in your Browser, to see what accessibility features it offers: • Firefox: http://support.mozilla.com/en-US/kb/Accessibility?bl=n&s=accessibility&as=q • Internet Explorer: http://msdn.microsoft.com/en-us/windows/bb735024.aspx • Opera: http://www.opera.com/support/access/index.dml • Apple: http://www.apple.com/accessibility/macosx/vision.html

DOC-78 This work is licensed with some rights reserved, see http://creativecommons.org/licenses/by-sa/3.0/ 12 December 2016