Skip to Content 
TranslationsIn-Suite Navigation
Example Outline for a Web Accessibility Workshop
[Draft for review - updated 17 July 2012]
Page Contents
Introduction
This page provides an overview and outline for an example three-day hands-on workshop on web accessibility, as a basis for developing customized training for specific audience needs and goals. It links to Accessibility Topics and WAI resources that you can use as building blocks to develop your presentation and activity materials.
See also: How to Make Your Presentations Accessible to All for guidance on ensuring that your training is accessible to all of your audience, including participants with disabilities.
Overview
Scenario: A three-day hands-on workshop to inform participants about web accessibility and to teach developers how to implement accessibility requirements.
Target audience:
- Day 1: Managers and decision makers
- Days 1 and 2: Web content authors and visual designers
- All 3 days: Website developers and application programmers
Other key audiences include staff from public relations, marketing, communications, human resources, procurement, legal and policy advisors, staff representatives, and many more involved with the Web.
Overall learning objectives:
After the training, managers and decision makers should be able to:
- Explain the importance of web accessibility for people with disabilities and older people
- List common barriers experienced by people with disabilities and older people
- Describe the business case that influences an organization's web accessibility efforts
In addition, authors and non-technical developers should also be able to:
- Explain the role of the WAI guidelines and other components in achieving an accessible Web
- Apply basic principles of accessibility during the preparation of web content
- Carry out preliminary checks of websites for accessibility and communicate the results
Website developers and application programmers should additionally be able to:
- Utilize WCAG 2.0 and its supporting documents as a guide to implementing accessible websites
- Apply WCAG 2.0 techniques to develop accessible layouts, forms, tables, and other content
- Evaluate websites for conformance with WCAG 2.0 and communicate the results
Schedule
Day 1 schedule
- 09:00 - 10:30 Session 1 - Introduction to web accessibility
- 10:30 - 11:00 Break
- 11:00 - 12:30 Session 2 - Components of web accessibility
- 12:30 - 13:30 Lunch
- 13:30 - 15:00 Session 3 - Managing web accessibility
- 15:00 - 15:30 Break
- 15:30 - 17:00 Session 4 - Accessible content authoring
Day 2 schedule
- 09:00 - 09:30 Session 1 - Working with WCAG 2.0
- 09:30 - 10:30 Session 2 - Accessible visual design and CSS
- 10:30 - 11:00 Break
- 11:00 - 11:45 Session 3 - Accessible images
- 11:45 - 12:30 Session 4 - Accessible multimedia
- 12:30 - 13:30 Lunch
- 13:30 - 15:00 Session 5 - Accessible page structure
- 15:00 - 15:30 Break
- 15:30 - 17:00 Session 6 - Accessible navigation and orientation
Day 3 schedule
- 09:30 - 11:00 Session 1 - Accessible tables
- 11:00 - 11:30 Break
- 11:30 - 12:30 Session 2 - Accessible forms
- 12:30 - 13:30 Lunch
- 13:30 - 15:00 Session 3 - Basics of accessible scripting and WAI-ARIA
- 15:00 - 15:30 Break
- 15:30 - 16:00 Session 4 - Principles of conformance evaluation
- 16:00 - 17:00 Session 5 - Workshop review and lessons learned
Session Descriptions
Day 1 - Session 1: Introduction to web accessibility
Target audience: Managers and decision makers, web content authors and visual designers, website developers and application programmers, and other key audiences
Learning Objectives:
- Explain the importance of web accessibility for people with disabilities and older people
- List common barriers experienced by people with disabilities and older people
- Describe the benefits of web accessibility for people with and without disabilities
- Understand that the W3C/WAI Guidelines are the international standard for web accessibility
Outline:
- Overview of web accessibility, including what web accessibility is and why it's important
- Videos showing people with disabilities using the Web
- Information about the ageing population and ageing-related impairments
- Relevant legislation or other policies applicable to participants' organizations
- Carry-over benefits of universal design for people with and without disabilities
- Business benefits of web accessibility, including some case studies
- Overlapping experiences of people with disabilities and mobile users
- Introduction to WAI guidelines as the international standard for making the Web accessible
Related Accessibility Topics:
- Introducing Web Accessibility
- How People with Disabilities Use the Web
- Business Case for Web Accessibility
- Web Accessibility and Older People
- Web Accessibility Policy and Legislation
- Accessibility and the Mobile Web
Day 1 - Session 2: Components of web accessibility
Target audience: Managers and decision makers, web content authors and visual designers, website developers and application programmers, and other key audiences
Learning Objectives:
- Explain the components of web accessibility, including authoring tools and user agents
- Explain the role of the W3C/WAI Guidelines in providing a technical standard for accessibility
- Define the basic concepts of WCAG 2.0, its organizing principles and guidelines
- Describe the importance of authoring tools that support the production of accessible content
- Describe the benefits of involving people with disabilities throughout any web development
Outline:
- Hands-on experiential session showing the use of adaptive strategies and assistive technologies
- Introduction to the components of web accessibility
- Introduction to WCAG 2.0, its four basic design principles, and guidelines
- Benefits of WCAG 2.0
- Importance of accessible authoring tools, including content management systems
- Benefits of involving users in all aspects of web projects from the beginning
Handouts:
Related Accessibility Topics:
- Components of Web Accessibility
- Involving Users in Web Projects
- Introducing WCAG 2.0
- How People with Disabilities Use the Web
Day 1 - Session 3: Managing web accessibility
Target audience: Managers and decision makers, web content authors and visual designers, website developers and application programmers, and other key audiences
Learning Objectives:
- Describe the steps needed to develop an implementation plan for web accessibility
- Describe the steps needed to develop organizational policies on web accessibility
- Identify key players in achieving an accessible website
- Describe the principles for selecting appropriate authoring and evaluation tools
- Conduct a preliminary check of websites for accessibility and communicate the results
Outline:
- Developing a web accessibility implementation plan
- Requirements for an accessibility policy for an organization
- Approaches to improving the accessibility of an organization's existing website
- Identification of key players (people, departments) with the organization who might be responsible for developing, managing, and maintaining an accessible site
- Considerations in selecting authoring tools and content management systems (CMS's)
- Selecting evaluation tools for checking web accessibility
- Undertaking and documenting a quick check for web accessibility with exercise
Related Accessibility Topics:
- Improving the Accessibility of Existing Websites
- Web Accessibility Policy and Legislation
- Authoring Tool Accessibility and ATAG
- Quick Check for Web Accessibility
Day 1 - Session 4: Accessible content authoring
Target audience: Managers and decision makers, web content authors and visual designers, website developers and application programmers, and other key audiences
Note: This session provides an introduction to the preparation of accessible web content. Additional and focused training may be required for web content authors.
Learning Objectives:
- Describe accessibility requirements relevant to content authors, including for text, colors, and presentation
- Author accessible web content, including text-alternatives, text, links, and other page elements
Outline:
- Introduction to the accessibility requirements for making web content readable and understandable, including reading level considerations and creating clear links
- Introduction to other important accessibility features for content:
- Describing the purpose of images using alt-text (e.g. non-text content)
- Page organization (e.g. headings, labels, and other relationships)
- Visual presentation of text (e.g. colors, size, spacing, etc)
- Hands-on accessible content exercise, for instance one of the following:
- rewriting material to make it more readable and understandable
- organizing/structuring page content
- writing appropriate alt-text for a variety of different images in different contexts
- improving the visual presentation of the page
- Additional requirements for preparing accessible content (e.g. abbreviations and acronyms, and jargon and unusual words)
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
- Guideline 3.1 Make text content readable and understandable
- 3.1.5 Reading Level
- 2.4.4 Link Purpose (In Context)
- 1.1.1 Non-text Content
- 2.4.10 Section Headings
- 2.4.6 Headings and Labels
- 1.3.1 Info and Relationships
- 1.4.1 Use of Color
- 1.4.3 Contrast (Minimum)
- 1.4.8 Visual Presentation
- 3.1.4 Abbreviations
- 3.1.3 Unusual Words
Day 2 - Session 1: Working with WCAG 2.0
Target audience: Web content authors and visual designers, website developers and application programmers
Learning Objectives:
- Explain the concepts of WCAG 2.0 and list its supporting documents
- Use WCAG 2.0 documents to support practical implementation and testing
- Explain the improvements and benefits of WCAG 2.0
Outline:
- Introduction to the WCAG 2.0 documents
- Demonstration of the "How to Meet WCAG 2.0" customizable quick reference
- Benefits of WCAG 2.0, especially in relation to testability and applicability to different situations
- Applicability of WCAG 2.0 to all web technologies
- Introduction to accessibility support
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
Day 2 - Session 2: Accessible visual design and CSS
Target audience: Web content authors and visual designers, website developers and application programmers
Learning Objectives:
- Embrace the differences between the Web and print media
- Know the accessibility requirements for visual web page design and how to test for them
- Incorporate accessibility requirements in the visual design and development of web pages
Outline:
- Overview of the adaptability of the Web, highlighting the differences from print media
- Accessibility aspects of visual design of websites
- Importance of the use of color and contrast in accessible design
- Advisory techniques that enhance a site's readability, including the visual presentation
- Accessibility requirements for resizable text and flexible page layout
- Practical exercise, such as identifying pages with inaccessible visual design
- Introduction to the issues associated with movement on web pages (e.g. from scrolling text, animations, flashing/flickering)
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
- 1.4.8 Visual Presentation
- 1.4.1 Use of Color
- 1.4.3 Contrast (Minimum) & 1.4.6 Contrast (Enhanced)
- Guideline 3.1 Readable
- 1.4.4 Resize Text
- 2.2.2 Pause, Stop, Hide
- 2.3.1 Seizures
Day 2 - Session 3: Accessible images
Target audience: Web content authors and visual designers, website developers and application programmers
Learning Objectives:
- Know the technical accessibility requirements for images
- Implement and test appropriate text alternatives for a wide range of image-based content
Outline:
- Introduction to the many different types of images and different contexts that require consideration for accessibility
- Providing access to data and longer descriptions for diagrams, graphs, photographs, etc
- Use of CSS to include decorative and formatting images
- Introduction to the accessibility issues of images of text
- Practical hands-on exercise, for instance to improve the accessibility of some image-heavy pages
- Introduction to additional image-related issues such as sensory experiences and use of CAPTCHA
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
From Techniques for WCAG 2.0:
Day 2 - Session 4: Accessible multimedia
Target audience: Web content authors and visual designers, website developers and application programmers
Learning Objectives:
- Know the accessibility requirements for multimedia
- Implement and test appropriate accessible alternatives for multimedia materials
Outline:
- Introduction to the need for accessible synchronized media (audio and video; recorded and real-time)
- Illustration of the accessibility issues with some media players
- Solutions for accessible pre-recorded media, including transcripts, captions, and audio-description
- Practical hands-on exercise, for instance captioning some video with an appropriate tool
- Introduction to the issues and solutions for live audio and live synchronized media (video)
Related Accessibility Topics:
- Designing Accessible Websites with WCAG 2
- Conformance Evaluation for Web Accessibility
- Browser Accessibility and UAAG
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
- Guideline 1.2 Time-based Media
- 1.2.2 Captions (Prerecorded)
- 1.2.3 Audio Description or Media Alternative (Prerecorded)
- 1.2.6 Sign Language (Prerecorded)
- 1.2.9 Audio-only (Live)
- 1.2.4 Captions (Live)
Day 2 - Session 5: Accessible page structure
Target audience: Web content authors and visual designers, website developers and application programmers
Learning Objectives:
- Know the necessity of structural relationships for understanding web pages
- Implement and test semantic structure and links to aid understanding and navigation of web pages
Outline:
- Introduction to the importance of page information and structure
- Use of headings for organizing page content, and the use of correct heading levels
- Importance of lists in understanding and navigating web pages
- Additional page navigation techniques such as 'skip links' and providing a table of contents
- Importance of ensuring that content is presented in a meaningful sequence with a sequential navigation order
- Practical hands-on exercise, for instance one of the following:
- Identification of accessibility improvements to page structure
- Coding accessible page navigation, headings, and lists
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
- 1.3.1 Info and Relationships
- 2.4.6 Headings and Labels
- 1.3.2 Meaningful Sequence
- 2.4.3 Focus Order
- 2.4.1 Bypass Blocks
From Techniques for WCAG 2.0:
- G141: Organizing a page using headings
- H42: Using h1-h6 to identify headings
- H48: Using ol, ul and dl for lists
- G64: Providing a Table of Contents
Day 2 - Session 6: Accessible site navigation and orientation
Target audience: Web content authors and visual designers, website developers and application programmers
Learning Objectives:
- Know the requirements for accessible website navigation and orientation
- Implement and test accessible navigation elements and provide meaningful navigation across a website
Outline:
- Introduction to the importance of website navigation, including:
- Provision of multiple ways to locate a web page
- Provision of consistent navigation across a website
- Ensuring that the purpose of links is clear
- Provision of information about the user's current location, including the importance of page titles that describe the page's topic or purpose
- Practical hands-on exercise, for instance one of the following:
- Identifying inaccessible navigation on some sites
- Identifying orientation improvements for some sites
- Introduction to some of the known failures for creating links and menus such as scripts emulating links and scripted drop-down boxes
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
- 2.4.5 Multiple Ways
- 3.2.3 Consistent Navigation
- 2.4.4 Link Purpose (In Context)
- 2.4.8 Location
- 2.4.2 Page Titled
From Techniques for WCAG 2.0:
- F42: Failure of Success Criterion 1.3.1 and 2.1.1 due to using scripting events to emulate links in a way that is not programmatically determinable
- F36: Failure of Success Criterion 3.2.2 due to automatically submitting a form and presenting new content without prior warning when the last field in the form is given a value
Day 3 - Session 1: Accessible tables
Target audience: Web developers and application programmers
Learning Objectives:
- Know the requirements for accessible data tables
- Implement and test accessible data tables
Outline:
- Introduction to the concept of accessible tables requiring explicit information and relationships to aid understanding
- Introduction of the known failures for presenting tables
- Accessible table markup, including header cells with scope attributes, table titles and summaries
- Advanced table markup for more complex tables, including cell association
- Illustration of table navigation techniques used by assistive technology users
- Practical hands-on exercise, for instance one of the following:
- Coding some simple and complex tables
- Evaluating some tables for accessibility and recommending improvements
- Introduction of some advisory techniques for tables such as cell highlighting on hover
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
From Techniques for WCAG 2.0:
- H51: Using table markup to present tabular information
- H63: Using the scope attribute to associate header cells and data cells in data tables
- H39: Using caption elements to associate data table captions with data tables
- H73: Using the summary attribute of the table element to give an overview of data tables
- H43: Using id and headers attributes to associate data cells with header cells in data tables
Day 3 - Session 2: Accessible forms
Target audience: Web developers and application programmers
Learning Objectives:
- Know the accessibility requirements for accessible forms
- Implement and test accessibility features of forms
Outline:
- Introduction of the information and relationship requirements for basic form accessibility
- Introduction of some of the known failures for forms such as automatic submission and issues with phone numbers
- Accessible form features such as labels, instructions, keyboard compatible controls, and indicating required fields
- Advisory techniques such as linear form design and warning users about changes of context
- Practical hands-on exercise, for instance one of the following:
- Coding accessible forms
- Evaluating online forms for accessibility and recommending improvements
- Introduction to advanced accessibility approaches for completing forms, including error correction suggestions, error prevention, context sensitive help, client-side validation, and re-authenticating
- Accessibility implications of error correction and reporting approaches (client-side - server-side)
- Adequate interaction time as an issue for form completion
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
- 1.3.1 Info and Relationships
- 3.3.2 Labels or Instructions
- 3.3.3 Error Suggestion
- 3.3.4 Error Prevention (Legal, Financial, Data)
- 3.3.5 Help
- 2.2.5 Re-authenticating
- 2.2.1 Timing Adjustable
From Techniques for WCAG 2.0:
- F36: Failure of Success Criterion 3.2.2 due to automatically submitting a form and presenting new content without prior warning when the last field in the form is given a value
- F82: Failure of Success Criterion 3.3.2 by visually formatting a set of phone number fields but not including a text label
- H91: Using HTML form controls and links
- H92: Including a text cue for colored form control labels
- G13: Describing what will happen before a change to a form control that causes a change of context to occur is made
- SCR18: Providing client-side validation and alert
Day 3 - Session 3: Basics of accessible scripting and WAI-ARIA (Accessible Rich Internet Applications)
Target audience: Web developers and application programmers
Learning Objectives:
- Identify common barriers in scripted content
- Learn to include progressive enhancement techniques in the development process
- Understand the additional accessibility provided by WAI-ARIA for rich internet applications
- Implement and test basic accessibility scripting features
Outline:
- Introduction to the barriers created by some scripting techniques
- Introduction to the concept of progressive enhancement with scripting
- Introduction to scripting techniques that satisfy WCAG 2.0 success criteria
- Introduction to WAI-ARIA and accessibility barriers in rich internet applications
- WAI-ARIA techniques to improve keyboard usage and setting of focus
- Hands-on analysis of scripting challenges and solutions related to web applications, for example:
- embedded objects such as media players
- device specific events
- generic elements as interface controls
- scripting elements to emulate links
- scripted drop-down boxes
- Provision of related resources, including the use of libraries and toolkits with WAI-ARIA support
Related Accessibility Topics:
- Designing Accessible Websites with WCAG 2
- Accessible Rich Internet Applications
- Conformance Evaluation for Web Accessibility
Relevant WCAG 2.0 Resources:
From Techniques for WCAG 2.0:
- Client-side Scripting Techniques for WCAG 2.0
- F54: Failure of Success Criterion 2.1.1 due to using only pointing-device-specific event handlers (including gesture) for a function
- F59: Failure of Success Criterion 4.1.2 due to using script to make div or span a user interface control in HTML
- F42: Failure of Success Criterion 1.3.1 and 2.1.1 due to using scripting events to emulate links in a way that is not programmatically determinable
- F36: Failure of Success Criterion 3.2.2 due to automatically submitting a form and presenting new content without prior warning when the last field in the form is given a value
Day 3 - Session 4: Principles of conformance evaluation
Target audience: Web developers and application programmers
Learning Objectives:
- Define the concept of a conformance evaluation for websites
- Understand the importance of involving users in web accessibility evaluation
- Understand the concept of accessibility support and its applicability to the organization's website
Outline:
- Introduction of the concept of website conformance testing as a formal extension of the testing done in previous sessions
- Process for conformance evaluation of websites for accessibility
- WCAG 2.0 conformance requirements and conformance claims
- Selection of automated tools and their benefits and drawbacks
- Combining testing with users with formal conformance evaluation methods
- Introduction of the concept of accessibility supported technologies
Related Accessibility Topics:
Relevant WCAG 2.0 Resources:
From Understanding WCAG 2.0:
Day 3 - Session 5: Workshop review and lessons learned
Target audience: Web developers and application programmers
Session Objectives:
- Ensure participants have understood the key messages from the workshop
- Provide an opportunity for questions and answers to outstanding issues
Outline:
- General questions and answers (Q&A) to elaborate on anything needing clarification
- Summary of the overall requirements for accessible web design and development
- Reiteration of the value of using "How to Meet WCAG 2.0" as a gateway to WCAG 2.0
- Opportunities for follow-up, including the WAI Interest Group (and the associated WAI-IG email list)
Suggested activity:
- Ask participants to write down something they learned in the last two days that they will incorporate in their work immediately, something that surprised them, or the most interesting thing they learned. Discuss some of the impressions from the participants to share lessons learned.
Important Notes
This example workshop is not a complete set of training material. Trainers will need to adapt the material to suit their audience. For example, for an in-house workshop, trainers should focus on the issues most common to the organization's content and development environment, and could use the organization's website and authoring tools for examples and activities.
This material assumes that trainers are experienced web accessibility practitioners and trainers. That is, it does not attempt to train trainers.
This outline is for an initial workshop. Follow up workshops might be needed. For example, content authors would benefit from specific instruction on how to use their content management system (CMS) or other authoring tools to provide accessible content.
Additional notes for presenters for the technical sessions on days 2 and 3:
- Allow time at the end of each session to sum up the requirements and clarify any issues arising from the session.
- Finish days 1 and 2 with a brief summary of the day, and start days 2 and 3 with a brief summary of the previous day. Seek feedback at the end of each day and adjust remaining material as appropriate.
- Clarify that not all WCAG 2.0 success criteria are being presented and discussed in this workshop.
- Describe the intent of accessibility requirements, and their relationship to barriers for people with disabilities and older people. Also describe the broader benefits for mobile users, search engine optimization (SEO), and more.
- Draw illustrative examples from sites and material that are relevant to the participants backgrounds, e.g. government, commerce, etc.
- The Before and After Demonstration provides accessible and inaccessible web pages, including evaluation reports, that can be used as examples. Using the participants' own websites or similar websites to theirs (such as websites from competitor organizations) helps make the examples more tangible.
- Emphasize the benefits of How to Meet WCAG 2.0, a customizable quick reference to WCAG 2.0 requirements and techniques, including 'best practice' advisory techniques.
- Introduce appropriate evaluation techniques and tools for each issue as it is covered.
- Carry out activities and exercises to reinforce the learning effect.
