CSS AAM Potential Features
CSS-AAM Potential Features and Potential CSS WCAG Techniques
The goal of this document is to provide a preliminary list the CSS Modules under development that have impacts on accessibility. Some of these require documenting how the CSS features should be mapped to Accessibility APIs on various platforms. Some need authoring advice, in the form of WCAG Techniques and Failures and/or CSS Best Practices. Others are potentially useful for accessibility scenarios, and should be further explored. Some were too long or complex for a cursory read to determine their accessibility implications, and need additional review.
Finally, there are two broad categories of issues where there is no consensus on how to proceed. These are areas where we hope that frank and open discussion among experts from the CSS and APA working groups can yield deeper understanding and new approaches. These are:
- Order and Flow for screen-readers and sequential navigation on pages where visual layout and DOM order are not in synch.
- Whether and how to use CSS and media queries to create experiences optimized for accessibility scenarios and users.
The list below is a first attempt at slotting the various CSS modules into these categories for further exploration and discussion. It is an early draft intended to stimulate further discussion among members of both APA and CSS.
Possibly related to reading/navigation order question
The specs below are less clearly related, but are worth a look while thinking about holistic solutions
- CSS Multi-column Layout
- CSS Fragmentation Level 3
- CSS Box Alignment Module Level 3
- CSS Basic Box Model Level 3
- CSS Paged Media Level 3
- CSS Intrinsic & Extrinsic Sizing Module Level 3
- CSS Template Layout
- CSS Regions
- CSS Round Display Level 1
- CSS Basic User Interface Module Level 4 (resize section)
Document existing mappings and implementation consensus
- CSS Display Level 3: Display:none changes the AAPI tree. Document that and any other features that do.
- CSS Generated Content Module Level 3: Document how generated content should be exposed in AAPI
- CSS Generated Content for Paged Media: Document how generated content should be exposed in AAPI
- CSS Counter Styles Level 3: Document how to expose generated list numbers and bullets in AAPI
- CSS Lists Level 3: Document how to expose lists in AAPI, including numbers and order
- CSS Tables Level 3: Document how it impacts mappings of HTML tables
- CSS Basic User Interface Module Level 4: Document how caret and keyboard direction maps to AAPI
- CSS Image Values and Replaced Content Level 3: How does this interact with name calculation? Does it impact the accessibility tree structure?
- CSS Writing Modes Level 3: Text Direction exposed in AAPI. Discuss with bidi AT developers about what needs they have, if any.
- CSS Ruby Level 1: Document how to expose Ruby in AAPI. Get input from international AT vendors, especially in Japan.
- CSS Backgrounds and Borders Level 3: The way IE did high contrast caused some problems. Consider documenting how high contrast, themes, color inversion should be handled by browsers with respect to backgrounds and borders.
- CSS Masking Level 1, CSS Overflow Level 3: Should masking and clipping impact what text is in AAPI? If so, when and how. Document consensus.
- CSS Values and Units Level 3: Document how zooming and text sizing should impact each unit, to avoid situations like the differences in handling of pt and px in IE and Firefox.
- CSSOM View, CSS Object Model, CSS Typed OM Level 1: Document relationship between CSSOM and AAPI
- CSS Pseudo-Elements Module Level 4: Should any pseudo-element styling be reflected in AAPI?
- Filter Effects: Document interactions with high contrast, color inversion, etc.
Authoring Advice Needed
WCAG techniques/failures and CSS Best Practices for how to use feature
The CSS WCAG techniques are very old, and don't cover many features of CSS that have known accessibility utility and pitfalls. Some of these are covered in the CSS Best Practices. The following specs could benefit from coordination between CSS and WCAG to develop techniques and define the relationship between CSS Best Practices and WCAG techniques.
- CSS Fonts Level 3: Techniques on how to do UI glyphs accessibly. (may not be directly related to this spec)
- CSS Values and Units Level 3: There are known issues with resizing and re-layout when mixing different types of units.
- CSS Animations, Web Animations 1.0, CSS Transitions, Motion Path Module Level 1: look into techniques for animations related to WCAG requirements for stopping/pausing motion, seizures, and improving understanding for user with cognitive disabilities.
- Non-element Selectors: WCAG technique for using role and aria-* attributes as selectors
- CSS Color Module Level 4: Look into techniques and failures related to contrast
Older WCAG ideas for CSS techniques
These are links to lists of ideas the WCAG working group had for CSS techniques a few years ago. They were last reviewed in 2015, so should not be taken as definitive.
Might be useful for other WCAG techniques
These specs have features that could be leveraged in WCAG techniques, particularly WCAG techniques related to cognitive accessibility optimizations. Have the WCAG and COGA teams take a look at these for technique ideas.
Using CSS to optimize for Accessibility
APA has been interested in ways that CSS can be used for accessibility-optimized views. The CSS working group has a particular view on the intentions of these features and how they interact with accessibility. This is an area where a joint task force can be useful to understand the different viewpoints and seek common ground. This work should start with examining design goals of these features and accessibility use cases. It might results in new CSS features, CSS-AAM mappings, authoring guidance or some combination, and has a fairly long time horizon.
- Media Queries
- Media Queries level 4
- CSS Conditional Rules Level 3
- CSS Device Adaptation: Should accessibility views (e.g. magnification, symbol replacement for users with cognitive disabilities) be treated as devices?
Do further review
- CSS Level 1 (largely covered by existing WCAG techniques)
- CSS Level 2: Look for areas that are not covered by reviews of later modules
- CSS Speech: Has much potential for accessibility enhancements
- Compositing and Blending Level 1: Look at interaction with SVG-AAM
- CSS Transforms: Look at interaction with SVG-AAM and whether this has any relationship to the order issue.
- CSS Painting API Level 1: Is there a mechanism for text alternatives?
- CSS Properties and Values API Level 1: Extensibility mechanism for CSS. How will this impact AAPI construction? Will there be a way to reflect these new things in AAPI?
- Worklets Level 1: Will this impact AAPI construction?
Out of Scope
These are CSS specs that, on first review, don't seem to have accessibility impact.
- CSS Snapshot 2015
- CSS Snapshot 2010
- CSS Snapshot 2007
- CSS Color Level 3
- CSS Namespaces
- Selectors Level 3
- CSS Print Profile
- CSS Style Attributes
- CSS Cascading and Inheritance Level 3
- CSS Syntax Level 3
- Geometry Interfaces Module Level 1
- CSS Cascading and Inheritance Level 4
- Cascading Variables
- CSS Will Change Level 1
- Selectors Level 4
- CSS Scroll Snap Points Module Level 1
- CSS Line Grid
- CSS Font Loading
- CSS Scoping Level 1