1 / 11

Enhancing Web Accessibility: Key Principles and Guidelines for Inclusive Design

This guide outlines essential principles for creating accessible digital content in compliance with accessibility standards. It covers the fundamentals of perceivability, operability, and understandability. Key areas include providing text alternatives for images, ensuring keyboard accessibility, and maintaining a predictable navigation structure. Additionally, the guide emphasizes the importance of clear labeling and error identification, along with best practices for using semantic markup. Suggested tools for testing accessibility compliance are also provided to help developers ensure their applications are user-friendly for everyone.

tudor
Télécharger la présentation

Enhancing Web Accessibility: Key Principles and Guidelines for Inclusive Design

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. RecapPrincipal 1, 2 & 3 iAccessible.org

  2. Principal 1 - Perceivable • Text Alternative • alt text (Images, Graphs) • Image as input control (Name need to be given) • CAPTCHA or MAPTCHA • Time based Media (pre recorded) • Audio and video Captions • Adaptable • Info and relationships (label placement) • Meaningful sequence (tab order) • Sensory Characteristics (identifying content using shape or location)

  3. Principal 1 - Perceivable • Distinguishable (background vs foreground) • Use of color (red color as invalid input) • Audio Control (if music play automatically) • Contrast (4.5 : 1)

  4. Principal 2 - Operable • Keyboard Accessible (tabindex, Inaccessible vs. Accessible Drag & Drop live example) • Enough Time to read and use content • Control time (time off, adjust, extend) • Pause, stop, hide (Marquee) • Seizures (flashes) • Navigable (Easy navigation, find content easily) • Bypass block (skip to main) • Page title • Focus Order • Link purpose (Click here)

  5. Principal 3 - Understandable • Readable (thru screen reader – multi lingual) • Language of page and part • Predictable (predicable web page) • On focus : change the context (submit button) • On Input : change the context (submit button) • Input Assistance (Help user to avoid or correct) • Error identification • Label of instruction (descriptive label and format)

  6. Guideline 4robust iAccessible.org

  7. Guideline 4.1: AT Friendly content • Parsing – well formed markup • What is well form? • Demo wrong html • Name, Role and Value – need to be programmatically determined

  8. Use Appropriate Markup • Use Semantic markup • CSS vs HTML table for layout • ul and li tags for listing instead of tables • Navigation – better to group as ul rather than links

  9. Testing Tools iAccessible.org

  10. Testing Tools • XHTML Validator • WAVE toolbar (rti.gov.in) • Icon keys • Errors • Structure and Order • Text Only • Outline • Color contrast check

  11. Exercise – Test Own Application

More Related