Wednesday 8:15am in Moody 203 Catching Up with Accessibility: Beginners' Basics Shawn Henry ▪ AccessU 2019 Putting Accessibility into Perspective People perspective: Glenda Watson Hyatt, Carl Activity: Keyboard only, no mouse . Put away mouse; cover touchpad . Tab through website navigation It's not about your ability or disability, it's about the design! Video: A world made for disabilities think about accessibility differently accessibility is not about a checklist, accessibility is about people People perspective: John Slatin: screen readers; John B: dynamic Braille devices; me: increased leading/line-height, text size, font; screen magnification; low vision; Tim C: Deaf, hard-of-hearing; Sarah; cognitive… Activity: low vision… straw… tunnel vision. Disabilities: Auditory, Cognitive, Neurological, Physical, Speech, Visual: Blind, Low vision Causes: Congenital condition (born with it), Disease, Illness, Accident, Aging – all of us. Introduction to Web Accessibility – links to video www.w3.org/WAI/intro/accessibility Web Accessibility Perspectives: Explore the Impact and Benefits for Everyone videos www.w3.org/WAI/perspective-videos/ How People with Disabilities Use the Web www.w3.org/WAI/people-use-web/ Web Accessibility and Older People: Meeting the Needs of Ageing Web Users www.w3.org/WAI/older-users/ Accessibility Guidelines Essential Components of Web Accessibility www.w3.org/WAI/intro/components Web Content Accessibility Guidelines (WCAG) Overview www.w3.org/WAI/intro/wcag What’s New in WCAG 2.1 www.w3.org/WAI/standards-guidelines/wcag/new-in-21/ Authoring Tool Accessibility Guidelines (ATAG) Overview www.w3.org/WAI/intro/atag User Agent Accessibility Guidelines (UAAG) Overview www.w3.org/WAI/intro/uaag Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 2 Accessibility Principles ("POUR" acronym) . Perceivable information and user interface . Text alternatives for non-text content . Captions and other alternatives for multimedia . Content can be presented in different ways . Content is easier to see and hear . Operable user interface and navigation . Functionality is available from a keyboard . Users have enough time to read and use the content . Content does not cause seizures or physical reactions . Users can easily navigate, find content, and determine where they are . Make it easier to use inputs other than keyboard . Understandable information and user interface . Text is readable and understandable . Content appears and operates in predictable ways . Users are helped to avoid and correct mistakes . Robust content and reliable interpretation . Content is compatible with current and future user tools WCAG 2.1 at a Glance www.w3.org/WAI/standards-guidelines/wcag/glance/ Accessibility Principles www.w3.org/WAI/fundamentals/accessibility-principles/ Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 3 Page Titles Page Title in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#title Image Alternatives ("alt text") Activity: Images in context Images Tutorial www.w3.org/WAI/tutorials/images/ Image text alternatives ("alt text") in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#images Link Text Understanding 2.4.4 Link Purpose (In Context) www.w3.org/WAI/WCAG21/Understanding/link-purpose-in-context Understanding SC 2.4.9 Link Purpose (Link Only) www.w3.org/WAI/WCAG21/Understanding/link-purpose-link-only Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 4 Page Structure Activity: Structure mark-up http://www.uwhealth.org/uw-carbone-cancer-center/patient-and-support-services/10308 Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 5 Page Structure Page Structure Tutorial www.w3.org/WAI/tutorials/page-structure/ Headings in Easy Checks - A First Review of Web Accessibility http://www.w3.org/WAI/eval/preliminary#headings Keyboard Access Keyboard access and visual focus in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#interaction Understanding Guideline 2.1 Make all functionality available from a keyboard. www.w3.org/WAI/WCAG21/Understanding/keyboard-accessible Understanding SC 2.4.3 Focus Order www.w3.org/WAI/WCAG21/Understanding/focus-order Focus Style Keyboard access and visual focus in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#interaction Text Format Understanding SC 1.4.8 Visual Presentation www.w3.org/WAI/WCAG21/Understanding/visual-presentation Understanding Success Criterion 1.4.12 Text Spacing www.w3.org/WAI/WCAG21/Understanding/text-spacing.html Text Customization for Readability www.tader.info/ Enable Text Resizing Resize text in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#resize Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 6 Table Markup Tables Tutorial www.w3.org/WAI/tutorials/tables/ Forms Markup Forms Tutorial www.w3.org/WAI/tutorials/forms/ Forms, labels, and errors in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#forms "Color"/Luminosity Contrast Ratio Contrast ratio ("color contrast") in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#contrast Color Coding Activity: Color coding and contrast Understanding SC 1.4.1 Use of Color www.w3.org/WAI/WCAG21/Understanding/use-of-color Movement Understanding SC 2.2.2 Pause, Stop, Hide www.w3.org/WAI/WCAG21/Understanding/pause-stop-hide Understanding SC 2.3.1 Three Flashes or Below Threshold www.w3.org/WAI/WCAG21/Understanding/three-flashes-or-below-threshold Understanding SC 2.3.2 Three Flashes www.w3.org/WAI/WCAG21/Understanding/three-flashes Understanding Success Criterion 2.3.3 Animation from Interactions www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions.html Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 7 Multimedia Multimedia (video, audio) alternatives in Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary#media W3C Multimedia Accessibility FAQ www.w3.org/2008/06/video-notes Transcripts on the Web: Getting people to your podcasts and videos www.uiaccess.com/transcripts/transcripts_on_the_web.html Transcription services www.uiaccess.com/transcripts/transcript_services.html In-progress: How to Make Audio & Video Accessible Using WCAG Web Content Accessibility Guidelines (WCAG) Overview www.w3.org/WAI/intro/wcag The WCAG 2 Documents www.w3.org/WAI/intro/wcag20 Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 8 Evaluation Evaluating Web Accessibility Overview www.w3.org/WAI/eval/ Easy Checks - A First Review of Web Accessibility www.w3.org/WAI/eval/preliminary.html Integrating Throughout Your Project and Organization Involving Users in Web Projects for Better, Easier Accessibility www.w3.org/WAI/planning/involving-users/ Web Accessibility First Aid: Approaches for Interim Repairs www.w3.org/WAI/planning/interim-repairs/ Planning and Managing Web Accessibility www.w3.org/WAI/planning-and-managing/ Lots More! For example: Tips for Getting Started with Web Accessibility These tips introduce some basic considerations for making your website more accessible to people with disabilities, and provide links to additional guidance. www.w3.org/WAI/gettingstarted/tips/ Designing for Web Accessibility: Tips for user interface and visual design Writing for Web Accessibility: Tips for writing and presenting content Developing for Web Accessibility: Tips for markup and coding W3C Web Accessibility Initiative (WAI) home page www.w3.org/WAI/ Catching Up with Accessibility: Beginners' Basics ▪ Shawn Henry ▪ AccessU 2019 ▪ Page 9 .