RE: [css3-background] PFWG Comments: high contrast modes

When there is an inset box-shadow on the element in question, would you want it to be above or below "meaningful images" (when box-shadow is enabled)?

I would expect below:
 [top]
 ...
 text content
 meaningful images
 border
 inset box-shadow entries
 non-meaningful images
 outset box-shadow entries
 ...
 [bottom]

-Brian

-----Original Message-----
From: www-style-request@w3.org [mailto:www-style-request@w3.org] On Behalf Of Michael Cooper
Sent: Wednesday, October 27, 2010 9:37 AM
To: www-style
Cc: List WAI Liaison
Subject: [css3-background] PFWG Comments: high contrast modes

The following is input from the Protocols and Formats Working Group on
CSS 3 Backgrounds and Borders. Approval to send this as a WG comment is
archived at http://www.w3.org/2010/10/27-pf-minutes.html#item08.


PF has concerns about the use of CSS background-image by authors to add
images which are not backgrounds to pages. Authors do this to take
advantage of positioning and clipping features for CSS which are not
available with the HTML img element. One reason for this is to allow
multiple graphics to be combined in a single file to reduce server
round-trips, which can substantially reduce the monetary cost of
maintaining sites by reducing the number of servers needed and the
amount of bandwidth used. Because of the monetary costs involved, we do
not believe it is realistic to ask authors to discontinue this practice.

Accessibility accommodations for users with low vision often disable
background colors and images in order to display text more visibly.
These accommodations include High Contrast settings in the Windows and
Macintosh operating systems, accessibility settings in several browsers,
and assistive technologies. Disabling backgrounds is the correct
behavior for these tools, but disabling meaningful images is not.

With the current CSS implementation, there is no way for authors to
indicate which CSS images should be removed in low vision scenarios and
which should not. The PF working group feels strongly that there needs
to be a mechanism for authors to indicate this.

We have three possible solutions to propose:
1) foreground-image: Foreground images sit on top of background images,
but are otherwise identical. They are semantically different, in that
they are images that are intended to be the only rendered representation
of the element. Foreground images MUST NOT be disabled by assistive
technology.

2) introduce a property called 'background-noremove'

Name: background-noremove
Value: <boolean> [ , <boolean> ]*
Initial: none
Applies to: all elements
Inherited: no
Percentages: N/A
Media: visual
Computed value: as specified, but with URIs made absolute

This property indicates whether the corresponding background-image(s)
must Not be removed for an element as the image conveys important
information to the user. Removal of important information is also a
failure in web accessibility compliance per WCAG 2.0
(http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/F3). Images
referenced correspond to the order specified by the "background-image"
property.

See the section "Layering multiple background images" for how '
background-image' interacts with other comma-separated background
properties to form each background image layer.

An example specifying that a background image must not be removed would be:

div { background-image: url(tl.png), url(tr.png); background-noremove:
true, false }

3. Include no-remove as part of the value set for background image
Properties

This is a streamlined solution for authors but it would have a greater
impact on style sheet processing:

background-image: url(test.png) no-remove, url(tr.png)

Any of these solutions would be acceptable. In any case, we would also
suggest referencing WCAG 2.0 SC1.1.1, specifically F3 (Failure of
success criterion 1.1.1 due to using CSS to include images that convey
important information).

Received on Wednesday, 27 October 2010 17:38:09 UTC