1 / 30

Why is HTML5 Accessibility important Because this child may never know HTML 4.

HTML 5

omer
Download Presentation

Why is HTML5 Accessibility important Because this child may never know HTML 4.

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. Why is HTML5 Accessibility important? Because this child may never know HTML 4.

    3. HTML 5 - the Future It’s the next version of HTML Many new features are not yet implemented or decided upon. Many new features that will make it easier for developers to provide accessible and inaccessible content Its huge! 808 pages

    4. WAI-ARIA NOW Allows the adding of name, role, state and property information to any element using attributes <div role=“slider”> <input aria-required=“true”> <img role=“presentation”> <input type=“text” aria-haspopup=“true”> Its still in development, but many features are stable and implemented in browsers and AT It can be used with HTML, XHTML, SVG, XUL and others.

    5. Future Potential Semantic elements <nav> <article> <footer> etc. Will provide semantic structure Not implemented in browsers Not supported by AT

    6. Future Potential Old Way HTML 4

    7. Future NOW Landmark roles Banner, mainNavigation etc. Chunk pages into large perceivable regions Navigation of page in a few keystrokes Implemented in browsers Supported by AT (JAWS, NVDA, ORCA) Compatible with HTML 4,5 & XHTML Do not serve the same function as the new HTML5 semantic elements Landmarks demo

    8. ARIA NOW HTML 4 + ARIA

    9. datalist Implemented in Opera 9.5+ Keyboard accessibility ? Not exposed to AT X Form control demo

    10. Input type="number" Implemented in Opera 9.5+ Keyboard accessibility ? Not exposed to AT X Potential - HTML5 Form controls

    11. Potential - HTML5 Form controls Input type="date" Implemented in Opera 9.5+ Keyboard accessibility X Not exposed to AT X

    12. Input type="range" Implemented in Opera 9.5+ & Safari 4+ Keyboard accessibility ? partial Not exposed to AT X Potential - HTML5 Form controls

    13. Slider demo Combobox demo Date picker demo Spin box demo Keyboard accessibility ? name, role, properties and states exposed to AT ? ARIA enabled Form controls

    14. required <input type="text" required> Implemented in Opera 9.5+ & Safari 4+ Not exposed to AT X aria-required <input type="text" aria-required=“true”> Implemented in Firefox 3+ and IE 8 Exposed to AT ? Potential - HTML5 Form controls ARIA - NOW

    15. HTML 5 Audio & Video Native accessible controls Implemented in Firefox 3.5 Captioning and annotations Fallback “It has been decided that the first version of HTML5 <video> (and <audio>) will not have an in-built solution for captions, audio annotations and the like, because it is possible to do such with javascript and external files.“ Silvia Pfeiffer Video Demo

    16. HTML 5 Audio & Video <video src="movie.ogg"> Your browser is not video-enabled; <a href="movie.ogg">download the video</a> and <a href="movie.txt">transcript</a>. </video> <audio src="horse.wav"> Your browser does not support the audio element. <a href=“horse.txt">transcript</a> </audio>

    17. Potential shit fight Canvas Is being used to produce UI’s e.g. Bespin Only way to make accessible is to create a duplicate of what’s created using canvas i.e. big dirty bolt on accessibility

    18. HTML5 Canvas element

    19. HTML5 Canvas element

    20. HTML5 Canvas element

    21. HTML5 Canvas element

    22. HTML5 Canvas element

    23. Potential Drag & Drop native keyboard support - not mentioned in HTML 5 Pretty much maps on to ARIA drag & drop except for providing state info about item being dragged. Limited support for ARIA drag and drop in JAWS and NVDA

    24. ARIA & HTML 5 Potential Integration of ARIA started Integration is about defining what bits of ARIA can be used with what bits of HTML ARIA is a separate spec – not dependent Does not really matter Validation checking is available Support in AT and Browsers is good

    25. ARIA & HTML 5 ARIA validates in HTML5 Validator.nu & W3C validator have HTML5+ARIA checking

    26. ARIA NOW

    27. ARIA NOW

    28. ARIA NOW

    29. References HTML5 HTML 5 Specification HTML 5: The Markup Language Form controls HTML 5 Specification: 4.10 Forms HTML5 Forms Demo Bruce Lawson Video First experiments with itext Silvia Pfeiffer The most pressing Accessibility issue in HTML5 today? <video> John Foliot Accessibility of HTML 5 video bruce lawson Keyboard control of html5 video elements David Bolter Canvas HTML 5 Specification:4.8.11 The canvas element Canvas, accessibility and SVG Bruce Lawson

    30. References WAI ARIA Accessible Rich Internet Applications (WAI-ARIA) (internal editor's draft) WAI-ARIA Best Practices (internal editor's draft) WAI-ARIA Primer (internal editor's draft) Accessible drag and drop using WAI-ARIA Gez lemon WAI-ARIA Implementation in JavaScript UI Libraries Using WAI ARIA Landmark Roles

More Related