Member Avatar for Webnauts
Webnauts 2 Light Poster

All you need for learning, building, validating and publishing accessible web sites.

WATCH OUT FOR UPDATES & PLEASE REPORT BROKEN LINKS OR LINKS WITH MISLEADING INFORMATION!

DON'T MISS THESE:

- Why is Accessibillity Important to You? http://www.webnauts.net/accessibility.html

- Skip Navigation Links are Important (tutorial): http://www.webnauts.net/skip-navigation.html

- Avoid forcing links to open in a new window (tutorial): http://www.webnauts.net/new_window.html

- Guidelines for Accessible and Usable Web Sites: Observing Users Who Work With Screen Readers

- Don't open new windows (tutorial) http://www.sitepoint.com/forums/showthread.php?t=186540

- Semantic Markup (must check!) http://cookiecrook.com/AIR/2003/train/semantics.php

- How to Save Web Accessibility from Itself http://www.alistapart.com/articles/saveaccessibility/


FREE ONLINE ACCESSIBILITY TUTORIALS:

- Curriculum for Web Content Accessibility Guidelines 1.0 http://www.w3.org/WAI/wcag-curric/
- WebAim Accessibility Techniques & Concepts http://www.webaim.org/techniques/
- How-To: Accessible Web Design
- Making Educational Software and Web Sites Accessible - http://ncam.wgbh.org/cdrom/guideline/
- Accessibility for Web Developers - Introduction
- WebAim Introduction to Web Accessibility
- SitePoint - Introduction To Accessible Web Design, by Nigel Peck
- SitePoint - Do-It-Yourself Accessibility by Nicky Danino
- Information Technology Technical Assistance and Training Center http://www.ittatc.org/training/webcourse/ (Free registration required)
- Bobby Report Explanation Files
- HiSoftware� Understanding Accessibility
- Web Accessibility Learning Modules
- Dive Into Accessibility http://diveintoaccessibility.org/
- Juicy Studio Accessibility Tutorial:
- Designing Universally Accessible WWW Resources for People with Disabilities
- Making Your Site Accessible
- W3C Example for Checkpoint http://www.w3.org/WAI/wcag-curric/sam1-0.htm
- Accessibility http://www.yourhtmlsource.com/accessibility/index.html
- WebDevTips Accessibility Tutorial http://www.webdevtips.com/webdevtips/html/accessibility/index.shtml
- The National Center on Low-Incidence Disabilities (NCLID)
- - U.S Section 508 http://www.jimthatcher.com/webcourse1.htm
- School Web Accessibility
- Accessible Web Typography - an introduction for web designers


FREE ONLINE ADAPTIVE TECHNOLOGY TUTORIALS
- Adaptive Technology Tutorials
- Adaptive Technology Glossary


INDIVIDUAL ACCESSIBILITY TOPICS TUTORIALS

1. Readability and Accessibility

- W3C/WAI Guideline 14. Ensure that documents are clear and simple: http://www.w3.org/TR/WCAG10/wai-pageauth.html#gl-facilitate-comprehension
- Readability and its Implications for Web Content Accessibility:

2. Accessible Anchors (links)

- Accessible Anchors http://www.webdevtips.com/webdevtips/html/accessibility/links.shtml

3. Building Accessible Forms

- General rules for web forms http://www.webdevtips.com/webdevtips/html/accessibility/form_rules.shtml
- Forms and Accessibility
- Better Accessible Forms
- Forms Accessibility http://www.yourhtmlsource.com/forms/formsaccessibility.html
- Designing Accessible Forms http://www.netmechanic.com/news/vol5/accessibility_no19.htm
- Forms Refresher http://www.cookiecrook.com/AIR/2003/train/forms.php

4. Designing Accessible Tables

- How to Create Accessible Tables http://www.webaim.org/howto/tables/
- Designing Accessible Tables
- Table Manners
- Building accessible tables
- Accessible Tables http://www.jimthatcher.com/webcourse9.htm
- Favorite Tips

5. Using Alt Tags

- Providing text equivalents for images http://diveintoaccessibility.org/day_30_creating_an_accessibility_statement.html
- Improving accessibility with accesskey in HTML forms and links
- On the length of alt texts
- Making web graphics accessible

6. Using Accesskeys

- Improving accessibility with accesskey in HTML forms and links
- Device Independence
- Use numbers for accesskeys http://lists.w3.org/Archives/Public/w3c-wai-ig/2003AprJun/0117.html
- Alt and beyond: Making web graphics accessible
- Unlocking Hidden Navigation http://www.alistapart.com/stories/accesskeys/
- More reasons why we don't use accesskeys
- Using Accesskeys - Is it worth it?
- Link Relationships as an Alternative to Accesskeys
- The Future of Accesskeys
- Accesskeys and Reserved Keystroke Combinations http://www.wats.ca/resources/accesskeysandkeystrokes/38
- Revealing Accesskey Information

7. Using Tabindex

- W3C/WAI about Tabindex http://www.w3.org/WAI/UA/TS/html401/cp0101/0101-TABINDEX.html
- Contradictions in Accessibility - Keyboard Usage and Tabindex

8. Using Longdesc

- Demonstration of the LONGDESC attribute and the "d" link http://wats.ca/resources/longdesc/31
- Attribute for <IMG ...> LONGDESC = "URL" http://www.htmlcodetutorial.com/images/_IMG_LONGDESC.html
- Making images more useful

9. Using Colors

- Colors Tutorial http://www.ergogero.com/FAQ/cfaqhome.html
- Type and color http://www.joeclark.org/book/sashay/serialization/Chapter09.html
- Hex/RGB Converting Tutorial and vice versa

10. Use Relative or Absolute Font Sizes?

- Care With Font Size http://www.w3.org/2003/07/30-font-size
- Font sizes
- Using relative font sizes http://diveintoaccessibility.org/day_26_using_relative_font_sizes.html
- Accessible web text - sizing up the issues
- Font size: the 'font-size' and 'font-size-adjust' properties http://www.w3.org/TR/REC-CSS2/fonts.html#font-size-props
- What's wrong with the FONT element?
- Size matters http://www.alistapart.com/stories/sizematters/
- Making Text Legible

11. Animated Graphics and Seizures

- How to Create Accessible Graphics http://www.webaim.org/howto/graphics/accessiblegraphics5

12. Skip Navigation or to Content link

- Avoid forcing links to open in a new window http://www.webnauts.net/new-window.html
- Skipping over navigation links http://diveintoaccessibility.org/day_11_skipping_over_navigation_links.html
- Skip to Main Content Link http://www.washington.edu/accessit/AU/tutorial/ins.html

13. Creating Accessible PDF Files

- How to Create Accessible Adobe PDF Files Booklet

14. Creating Accessible PowerPoint Files

- PowerPoint - The Recommended Method http://www.webaim.org/howto/powerpoint/


FREE ONLINE BOOKS

- "Building accessible websites" by Joe Clark http://www.joeclark.org/book/sashay/serialization/


ONLINE CLASSES:

- Webnauts Net "Web Accessibility Consultant Certification Training Program" http://academy.webnauts.net/, in cooperation with WebAIM.
- Equal Access to Software and Information (EASI) http://easi.cc/workshop.htm
- Designing Universally Accessible WWW Resources for People with Disabilities


ONLINE WEB ACCESSIBILITY EVALUATORS / VALIDATORS

- Webnauts Net http://www.webnauts.net/check.html - Page conforms W3C/WAI-AAA Guidelines!
- Hera http://www.sidar.org/hera/
- Web Accessibility Visualizer (Beta)
- http://uitest.com/en/check/
- Ocawa
- Bobby http://bobby.watchfire.com/bobby/html/en/index.jsp
- Web Aim Waive http://wave.webaim.org/index.jsp
- CythiaSays http://www.cynthiasays.com/
- ATRC Accessibility Checker
- ART Guide http://www.ubaccess.com/artguide.html
- UsableNet http://www.usablenet.com/
- Watchfire
- W3C Web Content Accessibility Checking Service http://www.w3.org/2000/07/eval43/


WEB ACCESSIBILITY DESKTOP TOOLS AND UTILITIES

- TAW3 (Web Accessibility Test). Tool for accessibility automatic analysis
- A-Prompt Web Accessibility Verifier
- A-Prompt Web Accessibility Verifier (German)
- HiSoftware� Accessible Form Creator
- Accessify Acrobot - Abbreviation and Acronym Generator
- Accessify accessible form builder (using Table or CSS layout)
- Accessify table builder
- Accessify Pop-up Window Generator
- NCAM Media Access Generator (MAGpie) http://ncam.wgbh.org/webaccess/magpie/
- STEP 508


COLORS TESTING TOOLS AND UTILITIES

- Accessibility color contrast checker tool:
- Considering the Color Blind Design Evaluation:
- Colour Contrast Analyser: http://www.juicystudio.com/services/colourcontrast.asp
- Color Metric Converter: http://colorpro.com/info/tools/convert.htm
- Colour transformations - Decimal:
- Colours confused with neutrals (Hex):
- Colours and contrast http://www.autisticcuckoo.net/tools/web/colours-contrast.php
- Color blind simulator http://www.vischeck.com/


BOOKS FOR WEB ACCESSIBILITY

- Maximum Accessibility - Making Your Web Site More Usable for Everyone, by J. Slatin & S. Rush http://www.amazon.com/exec/obidos/ASIN/0201774224/
- Building accessible websites, by Joe Clark http://www.amazon.com/exec/obidos/ASIN/073571150X/
- WEB Accessibility for People with Disabilities, by M. G. Paciello http://www.amazon.com/exec/obidos/ASIN/1929629087/
- Computer and Web Resources for People with Disabilities, by Stephen Hawking http://www.amazon.com/exec/obidos/ASIN/0897933001/


SOME USEFUL RESOURCES FOR ACCESSIBILITY

1. How People with disabilities use the Web

- W3C - How People with Disabilities Use the Web: http://www.w3.org/WAI/EO/Drafts/PWD-Use-Web/20010104
- How do disabled people use computers? http://www.joeclark.org/book/sashay/serialization/Chapter03.html
- Disability and the Web:
- Browse tips by physical disability: http://diveintoaccessibility.org/by_disability.html
- How People with Disabilities Use The Web

2. A Guide to Making Documents Accessible to People Who Are Blind or Visually Impaired by Jennifer Sutton.

- The inclusion of products or services in the body of this guide and the accompanying appendices should not be viewed as an endorsement by the American Council of the Blind. Resources have been compiled for informational purposes only, and the American Council of the Blind makes no guarantees regarding the accessibility or quality of the cited references. More:

3. Accessibility Statement

- Creating an accessibility statement http://diveintoaccessibility.org/day_30_creating_an_accessibility_statement.html
- Writing and posting the policy http://www.joeclark.org/book/sashay/serialization/Chapter14.html#h2-1085

4. Words With Dignity - describing people with a disability

- Terms suggested to describe persons with a disability
- Treating Users with Disabilities as People http://www.useit.com/alertbox/20011111.html
- Guidelines for Reporting and Writing about People with Disabilities

5. Convicing Clients to Pay for Accessibility

- Why Accessible Web Design is important for Business
- Accessible Web sites are attractive
- Auxiliary Benefits of Accessible Web Design http://www.w3.org/WAI/bcase/benefits.html
- Buy standards compliant Web sites http://www.w3.org/QA/2002/07/WebAgency-Requirements
- Websites: think the way your customers think
- Promoting and Advertising Your Accessibility http://nadc.ucla.edu/Promoting.htm

6. Accessibility in Distance Education

- A Resource for Faculty in Online Teaching

7. Guidelines

- Web Content Accessibility Guidelines 1.0 http://www.w3.org/TR/WCAG10/
- Trace Center Collation of Access Board's 508 FINAL RULE and GUIDES

8. Accessibility Laws

- Policies Relating to Web Accessibility http://www.w3.org/WAI/Policy/
(Countries on this page: AU - CA - DE - DK - ES - EU - FI - FR - HK - IN - IT - JA - NZ - PT - UK - US)
- Guidelines for UK Government websites


OTHER ACCESSIBILITY RESOURCES LISTS:

- Usability.gov Accessibility Resources List: http://www.usability.gov/accessibility/index.html
- Web Design References - Accessibility (everything you need...) http://www.d.


TIPS STRAIGHT INTO YOUR MAILBOX:

- Accessible Web Design - weekly tips

  • 1 Contributor
  • 0 Replies
  • 350 Views

Dani AI

Generated

Great, comprehensive resource list from — excellent baseline. A few practical updates and focused tips that help apply those resources to sites built today.

WCAG 2.2 is the current published baseline (adds accessibility checks for mobile/touch, authentication, focus behavior, and more). Make WCAG 2.2 your target when you plan or audit improvements. (w3.org)

Prioritized, modern checklist (actionable)

  • Prefer semantic HTML5 landmarks (header, nav, main, footer) and quality heading structure before adding ARIA. When ARIA is required, follow the WAI-ARIA Authoring Practices and the "first rule of ARIA" (use native semantics when possible). These resources explain common pitfalls and correct widget patterns. (w3.org)
  • Treat accessibility as a development workflow: automated checks in CI (axe/Dequeue-style rules) catch many regressions, but they don’t find everything. Combine automation with manual keyboard tests and screen-reader checks. (deque.com)
  • Test with real assistive tech early and often (NVDA on Windows; VoiceOver on macOS/iOS; TalkBack on Android). Automated tools are a starting point — assistive tech testing reveals real-world problems. (nvaccess.org)

Quick implementation notes

  • Make skip links visible on focus and target a single main landmark. Ensure focus is moved into the target (use tabindex="-1" on the target for programmatic focus when needed).
  • Respect prefers-reduced-motion and provide accessible alternatives for complex interactions (captions, transcripts, non-visual cues).
  • Keep a short remediation plan: fix high-impact, high-frequency issues first (labels, contrast, keyboard order, form labels), then tackle complex ARIA/widget issues.

Minimal skip-link example you can drop in and adapt:

<a class="skip-link" href="#main">Skip to main content</a>

<nav>...site nav...</nav>

<main id="main" tabindex="-1">
  <h1>Page title</h1>
  ...
</main>

<style>
.skip-link{position:absolute;left:-999px;}
.skip-link:focus{left:8px;top:8px;}
</style>

Caveat: automated scores are useful, but real accessibility is proved by manual testing and people. The list from is a solid library — use it together with the updates above.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.