WAHEP Website Check-up A Look at the Project Midway Website Evaluations.

Slides:



Advertisements
Similar presentations
Web Accessibility Testing for AIR
Advertisements

Copyright © 2007 Knowbility, Inc. Accessibility Testing 1 Code Validators – XHTML & CSS Accessibility Validators – Page by Page Listening to Your Pages.
AHEAD HTML Accessibility Topics: Keyboard Accessibility Content and Structure Links Headings and Lists Images in HTML Pages Tables Forms.
QUICK TESTING FOR WEB ACCESSIBILITY UCCSC 2013 Patrick Burke Lloyd Nicks Chris Patterson.
WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
Accessibility, Joomla! Markup languages and you
Deakin University CRICOS Provider Code: 00113B WEB ACCESSIBILITY Umesh Gupta Consultant – (HRIS)
ADA Compliant Websites & Documents What the heck am I supposed to do?
MMWCON 2013 WEB ACCESSIBILITY Patrick Burke Lloyd Nicks Chris Patterson.
Adapting Technology Changing Lives Web accessibility Web accessibility and Disability A Practical introduction Robin Christopherson and Curt Holst AbilityNet.
Web Accessibility: Mastering the Essentials for Compliance Annie Bélanger Liam Morland May 2013.
Sue Cullen Program Manager, CSUN Universal Design Center Accessibility Network Product Testing Coordinator for the CSU ATNetwork.
Dawn Pedersen Art Institute. What is Spry? Spry is Dreamweaver’s version of JavaScript libraries. Spry effects alter the look of a page element—or of.
ACCESSIBILITY OF DESIRE2LEARN LEARNING ENVIRONMENT.
WCAG 2.0 top ten checkpoints Ten popular area of focus for compliance and accessibility.
Website Accessibility Testing Todd M. Weissenberger Web Accessibility Coordinator University of Iowa
Microsoft PowerPoint 2013 An Overview.
Intermediate Level Course. Text Format The text styles, bold, italics, underlining, superscript and subscript, can be easily added to selected text. Text.
An Evaluation and Discussion of the Web Accessibility of Academic Library Web Sites.
Web Accessibility Web Services Office of Communications.
Browser Toolbars You Shouldn’t Do Without How the WAT and WDT Can Help You Design Accessible Websites.
Introduction to Web Accessibility. What is Web Accessibility Web accessibility means that people with disabilities can use the Web Disabilities including.
EASI Equal Access to Software and Information EASI is the premier provider of online training about accessible information technology.
Web Accessibility Tests Using the Firefox Browser ACCESS to Postsecondary Education through Universal Design for Learning.
Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.
Sue Cullen Program Manager, CSUN Universal Design Center Accessibility Network Product Testing Coordinator for the CSU ATNetwork Alen Davoudian Web Developer.
Review of last session The Weebly Dashboard The Weebly Dashboard Controls your account and your sites Controls your account and your sites From here you.
Designing for Disabled Users.  p?vid=35 p?vid=35.
WEBINAR SERIES: ACCESSIBLE INTERACTIVE DOCUMENTS Week 3: Accessible Web Forms Norman Coombs
INFO 6002 Assistive Technologies and Universal Design Accessibility and Usability Evaluation Chaohai Ding Msc of Web Technology
Alternative Views of the Web Jon Gunderson, Ph.D. Division of Rehabilitation-Education Services University of Illinois at Urbana/Champaign.
© Cheltenham Computer Training 2001 Macromedia Dreamweaver 4 - Slide No 1 Macromedia Dreamweaver 4 Advanced Level Course.
The Internet Writer’s Handbook 2/e Web Accessibility Writing for the Web.
Chapter 2 Developing a Web Page. Chapter 2 Lessons Introduction 1.Create head content and set page properties 2.Create, import, and format text 3.Add.
How to evaluate technology for accessibility Terrill Thompson Technology Accessibility Specialist University of
How People with Disabilities Access the Web Web Design – Sec 2-5 Part or all of this lesson was adapted from the University of Washington’s “Web Design.
Functional Accessibility Evaluation of Web 2.0 Applications Testing Jon Gunderson, Ph.D University of Illinois.
WEB ACCESSIBILITY. WHAT IS IT? Web accessibility means that people with disabilities can use the Web. Web accessibility encompasses all disabilities that.
+ A11y assessment Lisa Liskovoi. + WCAG POUR some accessibility sugar on me Perceivable – Can I see it? Hear it? Feel it? Operable – Can I scroll it?
Technical Communication A Practical Approach Chapter 14: Web Pages and Writing for the Web William Sanborn Pfeiffer Kaye Adkins.
Creating Accessible Web Forms Sandy Clark Constella Group
A centre of expertise in digital information managementwww.ukoln.ac.uk Accessibility and Usability For Web Sites: An Introduction to Web Accessibility.
Building a Website: Layout Fall Overall Structure: Home Page Title Section Title Frame Picture UNCP Math Menu Content Footer Contact Information.
 Accessibility & Information Architecture Presented by Liz Molleur INF385E April 5 th, 2009.
Web Accessibility June 2, 2016 Evaluation and Workflow.
Accessibility is not boring or difficult. It’s the right thing to do. Benjy Stanton.
County Website Content Management System
Testing for Accessibility with Common Screen Readers
Web-based structures, links and testing
Techniques, Tools and Resources for Making WordPress Website WCAG 2
Is Your State, District, or School Website Accessible?
Introduction to Web Accessibility
WCAG 2.0 training & orientation
Accessibility, Integrated
Basics of Accessibility in Adobe PDF
Web Accessibility Allison Kidd, Accessibility Specialist
Welcome to today’s AEM Center Webinar
Colorado State University Web Accessibility
Web Content Accessibility Beata M. Ofianewska (DG COMM) 7 December 2006 December 2006 COMM C2.
Lakeshore Public Schools
ADA Compliant Website & Documents
Building your class website
Introduction to Web Accessibility
Web Standards and Accessible Design.
Tools to improve accessibility
Demystifying Web Content Accessibility Guidelines
Accessible Design Top 10 List
Accessibility Evaluation
WebAIM Screen Reader Survey Results
Web Accessibility plus WordPress
Presentation transcript:

WAHEP Website Check-up A Look at the Project Midway Website Evaluations

Web Accessibility in Higher Education Project (WAHEP)

Timeline Project kickoff, 2012 Initial website evaluations by WebAIM Looked at: Homepage Department or course page Library page Disability Services page Human Relations page

Midway Evaluations Performed fall, 2014 Reports sent on or after October 15 Looked at: Homepage Department or course page Library page Disability Services page Human Relations page

Variables Website redesign New content in existing design Staff turnover, changing roles Participation in Project webinars Use of Project technical assistance

KEYBOARD INPUT “Input Device Independence”

Keyboard Navigation Hidden focus for navigation, links, controls Significant barrier for keyboard users CSS outline:0 or outline:none

More Keyboard Navigation Navigation menus Accordion menu, flyout menu, rollover menu Tab order? Tab focus? Visible? (Match mouse hover and keyboard focus states) General tab order attribute/ attribute/

Keyboards and Dialog Boxes Error messages, welcome messages, etc. Focus management Does it grab focus? (tabindex = -1) Does it keep focus? Does it make user close the dialog before they can get back into content? as a testwww.webaim.org/contact Submit empty form to see error handling

Unlabeled Fields Especially Site Search fields Placeholder text doesn’t do it Make label, associate with field Hide off-screen (no display:none) What about Title attribute?

CAPTCHA Ouch

Carousels and Sliders Cost/benefit Lots of effort to make accessible, but possible Click-throughs? Usability?

Links Link text behaves differently with keyboard a:hover should not be alone; add a:focus where you have a:hover Ideal: behavior should be the same with keyboard and mouse Links are not adequately identified Link behavior in WCAG 2 Need visual cue in addition to color cue for links in content

Headings Lots of illogical, blank, or no headings Headings should be unique to content on page Content managers and authors Work training/education into style guide, CMS training

Ease Navigation Still really helpful to use skip to main content links Redundant navigation on most sites Can have hundreds of navigation elements in navigation menus Top nav Side nav Hide until it receives keyboard focus (remember, just hide off- screen). Make visible on focus Remember: Skip to Main Content links are not just for people who are blind Heading structure

VISUALS Images, color, and zoom

Alternative Text Attributes Match alt text with text in images Really important for linked images, custom form fields and controls Some content driven, some in templates Logos for institutions, programs

Background Images If an image conveys meaning, then bring it out from the shadows Background images are hidden to assistive technology Attributes like alternative text, title are hidden to browser No interaction Social media icons Background images should not have meaning

Color Contrast Especially in Page footer Form fields All fonts need to hit the WCAG 2 A and AA mark Easy checks: Colour Contrast Analyser plugin for Firefox Web Accessibility Toolbar for IE The Paciello Group Colour Contrast Analyser WebAIM Color Contrast Checker

Text Zoom What does the page look like with text zoomed to 150%? Firefox: Ctrl + Shift + + Internet Explorer: Alt > View > Text Size Chrome: Chrome menu > Settings > Show advanced settings > Web Content > Font Size dropdown

MULTIMEDIA Captions and transcripts

Multimedia Audio: transcript only Video: captions (transcript synchronized with video)

TESTING Quick, cheap, helpful. You get all three.

Quick Desk Checks WAVE toolbar and website wave.webaim.org World Wide Web Consortium Easy Checks

Let’s Fix Some Stuff! The Accessibility Fix-it Contest! High points Sign up after the first of the year Fix barriers identified in your institution’s report Scoring based on priority assigned, number of barriers Contest will be during fixed period beginning around mid- January, running around 6 weeks More to come! Watch your Inbox just after the first of the year!

Thank you! Rob Carr, Oklahoma