An interest group that advocates for inclusive Web design A working group of the UW Web Council You do not work for us You can add yourself to the email list https://mailman2.u.washington.edu/mailman /listinfo/accessibleweb https://mailman2.u.washington.edu/mailman /listinfo/accessibleweb Blog is at http://accesswebu.blogspot.com/http://accesswebu.blogspot.com/
Be usable and intelligible to as many people as possible, including… People not able to use a mouse People not navigating by touch Be interpretable by assistive technologies Structured Semantic Standard
Are header elements being used semantically and are they organized hierarchically Pseudo headers created with bolding and sizing will not be recognized as headers Are tables being used for page layout? Tables layout makes navigation much more complex Can content be interpreted intelligibly without layout?
Text should be: Be accurate and equivalent Be succinct Not be redundant Not use phrases like “image of…” Example from http://webaim.org/techniques/alttext/
Semantic: New Technology Non-Semantic: New Technology
Tables layout Essential information in graphics without alt text Content buried in scripts Not using progressive enhancement methods Content added after page load (Ajax) ARIA roles needed to signal assistive technology which areas might receive updates
Personal Community Added value to our institution Legal guidelines and requirements Public relations The baby-boomers are coming (and they have money)
Are UW Web sites a “public accomodation” under the Americans with Disabilities Act? Do Washington state guidelines apply? http://ofm.wa.gov/ocio/policies/documents/1 000g.pdf http://ofm.wa.gov/ocio/policies/documents/1 000g.pdf Do you have a contractual agreement with students? Do you have obligations to your funding sources?
Welcome to the Basics 201 class! 1. Login with your UW NetID 2. View a course page 3. Download a PDF article 4. Submit a question 5. Use an online Web tool 6. Watch a video
UW NetID Basics 201 Course Web Site Ideas.pdf Download PDF Ask a Professor Online Form Ask a Question Basics Online Forum Use Online Tool Great Basics of World History Watch a Video
Goals – Why are we doing this? Principles – How are we going to reach the goals? Patterns - What we are going to do to solve specific problems that come up as we implement the principles? From Luke Wrobelski “Design Principles”, (http://www.lukew.com/ff/entry.asp?1292), which he derived from Service Oriented Architecture literaturehttp://www.lukew.com/ff/entry.asp?1292
We will design our Web services so they are… Perceivable Operable Understandable Robust
Adhere to standards Use semantic elements WCAG 2.0 Accessible Rich Internet Applications (ARIA) ECMA Standard Scripting Progressive enhancement methods in scripting
Most CMSs come out-of-the-box with good accessibility; don’t ruin it Drupal Accessibility Group http://groups.drupal.org/accessibility http://groups.drupal.org/accessibility Plone Accessibility http://plone.org/accessibility-info http://plone.org/accessibility-info WordPress Accessibility http://codex.wordpress.org/Accessibilityhttp://codex.wordpress.org/Accessibility Joomla Accessibility http://www.joomla.org/accessibility-statement.htmlhttp://www.joomla.org/accessibility-statement.html
Apple Accessibility http://www.apple.com/accessibility/ http://www.apple.com/accessibility/ VoiceOver http://www.apple.com/accessibility/voiceover/http://www.apple.com/accessibility/voiceover/ Microsoft Accessibility http://www.microsoft.com/enable/ http://www.microsoft.com/enable/ Adobe Accessibility http://www.adobe.com/accessibility/ http://www.adobe.com/accessibility/
Rapid change Mobile devices – smartphones to tablets – do it now, here, get immediate results Web sites and apps need to work with wide range of sizes – smartphone, tablet, laptop, desktop Pressure for simplification – Keep It Seriously Succinct
Start with designing for the mobile device, then supplement the design for laptops and desktops Priority of mobile is rising Mobile forces you to focus Mobile offers new capabilities (knows location, direction) Mobile First – Luke Wroblewski http://www.lukew.com/ff/entry.asp?933 http://www.lukew.com/ff/entry.asp?933
Web pages that themselves adapt to the capabilities of the device viewing them Responsive Web Design – Ethan Marcotte http://www.alistapart.com/articles/responsive-web- design/http://www.alistapart.com/articles/responsive-web- design/ Examples Sample Page – Robot or Not? http://responsivewebdesign.com/robot/http://responsivewebdesign.com/robot/ Responsive & Responsible – Scott Jehl http://filamentgroup.com/examples/bdconf- 2011/sjehl-bdconf-2011.pdfhttp://filamentgroup.com/examples/bdconf- 2011/sjehl-bdconf-2011.pdf
Blogs WebAxe – http://webaxe.blogspot.comhttp://webaxe.blogspot.com Presentations Top Mistakes in Web Accessibility – Wojtek Zajac http://www.slideshare.net/wojciechzajac/top-mistakes-in- web-accessibility http://www.slideshare.net/wojciechzajac/top-mistakes-in- web-accessibility Facebook Mike Paciello - http://www.facebook.com/mike.paciellohttp://www.facebook.com/mike.paciello Reports Digital Inclusion of People With Disabilities http://www.disabled- world.com/editorials/technology/digital-inclusion.php http://www.disabled- world.com/editorials/technology/digital-inclusion.php
Sites UW Information Technology Accessibility http://uw.edu/accessibility http://uw.edu/accessibility Web Accessibility in Mind (WebAIM) http://webaim.org/http://webaim.org/ Accessible Technology Coalition http://atcoalition.org/http://atcoalition.org/ W3C Web Accessibility Initiative ▪ Web Accessibility Presentations and Tutorials http://www.w3.org/WAI/train.htmlhttp://www.w3.org/WAI/train.html ▪ WAI Guidelines and Techniques http://www.w3.org/WAI/guid-tech.htmlhttp://www.w3.org/WAI/guid-tech.html
Your consent to our cookies if you continue to use this website.