Owen accessibility-2015.pptx
Download as PPTX, PDF1 like288 views
The document outlines the requirements for Australian government websites to comply with WCAG 2.0 levels A and AA by set deadlines, including guidelines for making websites accessible to individuals with various disabilities. It includes best practices for content structure, including page titles, headings, writing style, images, links, tables, video, audio, and forms, emphasizing the importance of clear, concise, and functional online communication. Reference tools and resources for validating accessibility standards are also included, along with recommendations for improving website usability.
Owen accessibility-2015.pptx
- 2. WCAG 2.0 and Government websites • Developed by the World Wide Web Consortium – http://www.w3.org/ • Australian Government mandate: all Government websites to comply with WCAG 2.0 Level A 31/12/2012 and Level AA 31/12/2014 – http://webguide.gov.au/accessibility- usability/accessibility/ • Australian Human Rights Commission - WWW Access: Disability Discrimination Act Advisory Notes ver 4.0 (2010) – http://www.humanrights.gov.au/world-wide-web-access- disability-discrimination-act-advisory-notes-ver-40-2010
- 3. Disabilities • Visual • Hearing • Physical • Cognitive
- 4. Tools • Web Accessibility Toolbar – a free download from Vision Australia that runs inside Internet Explorer
- 5. Tools • Colour Contrast Analyser – another free tool that runs within the Web
- 6. Tools • Complex Table Toolbar
- 7. Assistive technologies • Screen readers - vision impaired, reading difficulties such as dyslexia (JAWS 10+)
- 8. Assistive technologies • Screen magnifiers - used when increasing text not sufficient. Custom colour schemes, contrast.
- 9. Assistive technologies • Keyboard users - blind, vision impaired, temporary and long term mobility impairments.
- 10. Web Best Practice • Usability/Search Engine Optimisation/Writing for the Web/HTML technologies • Many best practice techniques overlap between these areas and are of mutual benefit.
- 11. Content, Structure and Formatting Page Titles • Clearly identify the content and/or purpose of the page. • Use familiar keywords. • Frontload keywords. • Keep it concise (up to 60 characters including spaces and punctuation). • Unique titles for each page.
- 12. Content, Structure and Formatting Page Titles • Add titles to non html documents such as PDF, Word, Excel and PowerPoint in document properties. • Include the organisation name – E.g. "School of Arts & Social Sciences - Studio One29" – ideally we would have "Studio One29 - School of Arts & Social Sciences - SCU" • When scanning search results it is useful if the keywords are positioned the left most information in a title. (example) • Do not use abbreviations.
- 13. Content, Structure and Formatting Headings h1-h6 etc • Like page titles, headings should be: – Concise – Unique – Front-loaded with key terms • h1 is reserved for top of page heading as set in Websys and a page cannot have more than one h1 heading (example). • Do not use headings for non heading content. • Do not skip heading levels when going to lower levels – h2 can be followed by h2 or h3
- 14. Content, Structure and Formatting Writing Content • Reading online should be: – Functional, focused and scannable • Key behaviour – Move quickly, F-shaped reading pattern, attention on left side of screen. • Headings - Front-load with keywords – Front loading best practice – "more information about text" change to "text - more information" – Avoid upper case for complete words or sentences.
- 15. Content, Structure and Formatting Writing Content • Plain English - Tools Flesch-Kincaid Grade, Word - 9 or lower – Readability http://www.read-able.com/ – "show readability statistics" in Spelling and Grammar (Word) • Contrast - Ensure copy contrasts with the background colour at all times. Use the Vision Australia Colour Contrast Analyser. • Abbreviations - expand all abbreviations "Regional Universities Network (RUN)".
- 16. Content, Structure and Formatting Lists • Choose the most appropriate HTML list element for lists: – ol for ordered lists – ul for unordered lists – dl for definition lists • Example list: • <ul> • <li>item one</li> • <li>item two</li> • <li>item three</li> • </ul>
- 17. Content, Structure and Formatting Quotations • Use <blockquote> Emphasis and Strong • Use <em></em> instead of <i></i> • Use <strong></strong> instead of <b></b>
- 18. Content, Structure and Formatting Links • The purpose of each link must be determined from the link text alone or together with its programatically determined link context. • E.g must be in the same paragraph, list, table cell, sentence. • "Outstanding staff recognised at annual Vice Chancellor’s Awards for Excellence… continue reading" • Avoid "click here" and "more" links.
- 19. Content, Structure and Formatting Links • Avoid using URLs, although may be included in addition. • Indicate when a new window is opened "Visit the Regional Universities Network (new window)" • Linked text should be contained on the destination page in: – Title – Main content heading H1
- 20. Content, Structure and Formatting Images • Avoid text in images, logo only acceptable exception. • alt txt - Short, long or blank (example) • alt must be equivalent and meaningful representation of image message.(example) • Images that convey the same information as nearby text are considered decorative (example). • Decorative - require alt="" or inclusion via CSS.
- 21. Content, Structure and Formatting Images • Images coded as a link must be given alt text • Images coded within a text link must have alt="" (examples) • Image maps must have textual descriptions for hotspots. • Complex images and diagrams need longer description, can be provided as yet content on same page or text linked to separate page. (example) • Charts should be described in detail or data provided as a data table.
- 22. Content, Structure and Formatting Tables • Screen readers browse through tables cell by cell. • Use 'th' and 'td' to distinguish header and data cells. • Use simple data tables where possible. • Use 'summary' to describe a data table. • Avoid layout tables, use <div> elements and CSS. • Vision Australia has a Complex Table Toolbar for help marking up complex tables
- 23. Content, Structure and Formatting Video • Audio description can be added post production in existing audio spaces. • Must provide closed captions for deaf visitors. • Must provide transcript copy on the page or clearly linked to additional transcript page. (example SHHS video) • http://www.visionaustralia.org/digital-access-youtube
- 24. Content, Structure and Formatting Video • Transcript must contain: – Sounds – The setting and background – Actions and expressions – Text or graphics – Any other useful information • HTML 5 Video not supported by all browsers (IE7/8) • SCU preferred video delivery system uses YouTube, contact Web Content Editor for enquiries.
- 25. Content, Structure and Formatting Audio • Must provide alternative to audio (text transcript) for deaf visitors. • Avoid using audio that plays automatically • HTML 5 Audio not supported by all browsers (IE7/8)
- 26. Content, Structure and Formatting Animation • Avoid Flash based content. • Flash can be made accessible however this is complex and prone to keyboard traps. • Do not use content that flashes (more than 3 times in any 1 second period) may cause visitors with epilepsy to fit. • Moving content can make pages inaccessible to users with reading disabilities or attention deficit disorders. • Include stop, pause or hide controls.
- 27. Content, Structure and Formatting iframes • Provide descriptive titles for iframes like YouTube video embeds or third party widgets (Check with Staffweb).
- 28. Content, Structure and Formatting Forms • Use 'label' element to associate form fields with labels or 'title' where there is no label. – <label for="name">Name</label> <input type="text" id="name"/> • Position labels before text areas and drop down menus. • Position labels after checkboxes and radio buttons. • Place labels close to their input controls. • Labels must: – Be specific and descriptive. – Indicate whether data is "required". – Describe required format.
- 29. Content, Structure and Formatting Captcha • Avoid image CAPTCHA solutions • use simple clear non-cultural specific logical question/answer text and text field submit form.
- 30. Validating Code • Valid HTML is very important for Accessibility. Check your code with the W3C Markup Validation Service • http://validator.w3.org/
- 31. Best Practice • Governance • Awareness • Implementation • Integration • Monitoring
- 32. Reference Tools • Web Accessibility Toolbar – A free download from Vision Australia that runs inside Internet Explorer • Colour Contrast Analyser – A free tool that runs within the Web Accessibility Toolbar once installed • W3C Markup Validation Service - This validator checks the markup validity of Web documents in HTML
- 33. Reference Information • World Wide Web Consortium (W3C) http://www.w3.org/ • Australian Government mandate: all Government websites to comply with WCAG 2.0 Level A 31/12/2012 and Level AA 31/12/2014 http://webguide.gov.au/accessibility- usability/accessibility/ • Australian Human Rights Commission - WWW Access: Disability Discrimination Act Advisory Notes ver 4.0 (2010) http://www.humanrights.gov.au/world-wide-web- access-disability-discrimination-act-advisory-notes-ver-40- 2010