Skip to content

clarification for :active state and non text contrast #4689

@ekaufman

Description

@ekaufman

I'm seeking a clarification to the intent of this wording in the understanding 1.4.11 document where it states:

This success criterion does not require that changes in color that differentiate between states of an individual component meet the 3:1 contrast ratio when they do not appear next to each other. For example, there is not a new requirement that visited links contrast with the default color, or that mouse hover indicators contrast with the default state. However, the component must not lose contrast with the adjacent colors, and non-text indicators such as the check in a checkbox, or an arrow graphic indicating a menu is selected or open must have sufficient contrast to the adjacent colors.

I interpret this to mean, for example, that it is sufficient to have a button with an :active pressed state effect that makes the button background color slightly darker while pressed without needing to meet 3:1 contrast with the default button background color as long as the pressed button itself still meets the contrast requirements with the content surrounding it. My rationale being that the exception above applies because "they do not appear next to each other" on the 2d plane that is the screen.

I recently heard an alternative interpretation (that I believe to be inaccurate). Essentially the terms "adjacent" and "next to each other" could have another meaning: "that whatever state immediately preceded the pressed state also needed to have 3:1 contrast". They are adjacent and next to each other on a timeline not just the 2d plane of the screen.

I did find this PR 550 as the source of the text above. The comments from Alastair there lead me to believe that the intent of this text was to "not create a requirement to differentiate states by color internally (e.g. between default and hover, visited link, visited + hover etc.)."

I agree these states should be perceivable, but as a practical matter it would be very difficult to design if every possible state needed a 3:1 contrast with every other possible state (and frankly I don't see many buttons meet a 3:1 contrast when pressed). I think that interpretation would just lead to an avoidance of defining an effect for :active and other states, I do not think that was the intent either.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions