A little late but finally ready: test cases for CSS flex box layout and its accessibility issues.

http://sprungmarker.de/wp-content/uploads/css-a11y-group/css-a11y-flexbox.html

As expected flex box possibilities to change content order is critical to keyboard users.
All browser and screen reader use for keyboard use source code order and not visual content order generated with CSS.
This can be quite confusing and depends on use case of reordering content. At worst it can be more like a zigzag on the page.

Only current Firefox is using visual order in old flex box specification and ordinal-group.

New spec is hard to test because only chrome is supporting it. Internet Explorer 10 and some versions of Webkit nightly do too. So I have to keep an eye on development and update test cases when browser get more along with the new spec.

Also we have to consider that browser and screen reader might adapt on visual content flux with flex box. No one knows.

I will keep test case updated.

Sylvia

In Working Groups we use phone, IRC, wiki, blogs and F2Fs to foster group communications. As a community group, we have all of this technology as well.

I realize everyone has personal preferences. I personally think this blog (viewable to you via email, RSS, etc.) is best for now as our main point of contact, and the existing wiki (not yet fleshed out but feel free to jump in!) for projects, brainstorms and other issue tracking.

For IM, voice, video – let’s gather preferences. I personally do not care what we use so long as everyone else is happy.

As for F2F’s – we’ll see how things go and then you can all come to mine some time for a poolside BBQ Wild Wild West (WWW) style.

Molly (all my puns are bad puns)

Molly here, current chair of this CG (that’s open for discussion btw, right now the group needs a cat herder and apparently I’m her!)

I’d like to extend a welcome to all existing and incoming folks and ask that you write a few words about yourself, where you live (Time Zone too, please), your interest in CSS and Accessibility, and what you feel your strongest skills to contribute would be such as:

• Code samples
• Writing and editing administrative documents (Charter, etc.)
• Writing and editing best practices documents
• Promoting best practices to social networks online
• Promoting best practices and this CG’s purpose at barcamps, sigs, conferences and other F2F’s
• Gather top resources for CSS practices in general from around the Web
• Add your vision here!

With the increasing additions of gradients, animations, transitions/transforms and other changing visual styles, it’s becoming ever more important to offer some best practices for these individual concerns.

I’d be interested in working on this. I’ve been appointed Community Group Liaison for issues related to CSS and a11y – so any help/input they can offer, they are happy to do so.

Molly

Ideas

• review CSS Techniques for WCAG 2 with a view to updating adding techniques
• collect articles, data on CSS accessibility issues/ fixes:
  • Using display:table has semantic effects in some screen readers
  • Screen readers, list items and list-style:none
  • Techniques for High-Contrast-Friendly Icons
  • use/support for CSS content:before etc.
  • use of CSS background images (text alterntives etc.)
  • display:none, display:hidden support/issues.
  • content hidden offscreen using CSS.
  • css animation
  •  css marquee
  • grid layout module.
• Review current guidance in the CSS specs.
  • CSS Techniques for Web Content Accessibility Guidelines 1.0