APG: Radio Group example with CSS Generated Content

Hi Jemma,

As discussed during the APG call today; I have added the visuals for the radio buttons via CSS Generated Content to the Radio Group example <https://rawgit.com/w3c/aria/feature/radio-generated/practices/examples/radio/radio.html>. I have tested them with Edge on Windows 10 in High Contrast mode (all themes), Safari 9/Chrome 43 on OS X 10.10; they work flawlessly. The method used might not be the most conventional—I used a border for the state part—but it works and looks great. To make a comparison easier, I have created a pull request for these changes <https://github.com/w3c/aria/pull/126>.

To reflect the CSS changes in the text, I have changed bullet number three under Accessibility Feature. It now reads:

> CSS Generated Content is used to visually indicate the state of radio (e.g. checked, unchecked). To ensure the visual state will be visible when browsers or operating system use “High Contrast” settings by people with visual impairments; the visuals are created in CSS rather than via the use of a background image. (Note: CSS background image techniques result in visual state disappearing when browsers or operating systems are configured to display high contrast themes.)

I think we can remove the last/note part that is between parenthesis; that should be clear form the previous sentences. What do you—and others in the group—think?

—Michiel

Received on Monday, 14 December 2015 20:56:01 UTC