Skip to content

Commit a8e06b8

Browse files
authored
Refactoring of the forced-colors and prefers-contrast media feature (#5434)
This editorial reorganization of the text is intended to make the overlap between forced-colors:active and prefers-contrast:forced more readily understandable: one being the syntax that the CSS Working Group finds more desirable, the other being retained for compatibility with content issued against an earlier draft (see #3856). Prior to this refactoring, the definition of this mode was also spread between the two media features, causing confusion. This commits consolidates the whole thing in one place. Related to #5433
1 parent ddeef01 commit a8e06b8

File tree

1 file changed

+69
-44
lines changed

1 file changed

+69
-44
lines changed

mediaqueries-5/Overview.bs

Lines changed: 69 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -2624,7 +2624,7 @@ Detecting the desire for reduced transparency on the page: the 'prefers-reduced-
26242624
ISSUE: How does this interact with preferences around e.g. pattern fills and backgrounds?
26252625
They're not about transparency, but they also interfere with shape recognition.
26262626

2627-

2627+

oldids="forced-colors">

26282628
Detecting the desire for increased or decreased color contrast from elements on the page: the 'prefers-contrast' feature
26292629

26302630
@@ -2634,11 +2634,12 @@ Detecting the desire for increased or decreased color contrast from elements on
26342634
Type: discrete
26352635
26362636

2637-
The 'prefers-contrast' media feature is used to detect if the user
2638-
has requested the system increase or decrease the amount of contrast
2639-
between adjacent colors. For example, many users have difficulty
2640-
reading text that has a small difference in contrast to the text
2641-
background and would prefer a larger contrast.
2637+
The 'prefers-contrast' media feature is used to detect
2638+
if the user has requested more or less contrast in the page.
2639+
This could be responded to, for example,
2640+
by adjusting the contrast ratio between adjacent colors,
2641+
or by changing how much elements stand out visually,
2642+
such as by adjusting their borders.
26422643

26432644
26442645
no-preference
@@ -2659,10 +2660,12 @@ Detecting the desire for increased or decreased color contrast from elements on
26592660

26602661
forced
26612662
2662-
Indicates that forced colors mode is active,
2663-
identically to ''forced-colors: active''.
2664-
See [[#forced-colors]] and
2665-
[[css-color-adjust-1#forced]].
2663+
Indicates that forced colors mode is active:
2664+
the user agent enforces a user-chosen limited color palette on the page,
2665+
in effect also implying a strong preference for the associated contrast.
2666+
The UA will provide the color palette to authors
2667+
through the CSS system color keywords.
2668+
See [[css-color-adjust-1#forced]] for details.
26662669

26672670
26682671
This does not necessarily indicates
@@ -2673,10 +2676,18 @@ Detecting the desire for increased or decreased color contrast from elements on
26732676
or some other arrangement that is neither particularly low or high contrast.
26742677
26752678

2676-
Note: When the User Agent can determine whether the particular forced color scheme
2677-
chosen by the user is high or low contrast,
2678-
one of ''prefers-contrast: more'' or ''prefers-contrast: less'' should match,
2679+
Additionally, when the user agent can determine
2680+
whether the forced color palette chosen by the user
2681+
has a high or low contrast,
2682+
one of ''prefers-contrast: more'' or ''prefers-contrast: less'' must match
26792683
in addition to ''prefers-contrast: forced''.
2684+
2685+
Note:
2686+
Similarly,
2687+
if the forced color palette chosen by the user
2688+
fits within one of the color schemes described by 'prefers-color-scheme',
2689+
the corresponding value will also match.
2690+
See [[css-color-adjust-1#forced]] for details.
26802691
26812692

26822693
@@ -2702,6 +2713,51 @@ Detecting the desire for increased or decreased color contrast from elements on
27022713
result in a high or low contrast (or something else).
27032714
27042715

2716+
2717+
Preference for more or less contrast may arise
2718+
from a variety of different situations.
2719+
Here are some examples:
2720+
2721+
    2722+
  • 2723+
    Many users have difficulty
    2724+
    reading text that has a small difference in contrast to the text
    2725+
    background and would prefer a larger contrast.
    2726+
    2727+
  • 2728+
    People suffering from migraine
    2729+
    may find strongly contrasting pages
    2730+
    to be visually painful
    2731+
    and would prefer a low contrast.
    2732+
    2733+
  • 2734+
    Some people with dyslexia find high contrast text hard to read,
    2735+
    as they feel that the letters shine / sparkle as if backlit by too bright a light,
    2736+
    and find low contrast to be more comfortable.
    2737+
    2738+
  • 2739+
    Environmental factors may also lead
    2740+
    a user to prefer more or less contrast.
    2741+
    See also [[#auto-pref]].
    2742+
    2743+
    2744+
    Issue: This list should be refined and expanded.
    2745+
    2746+
    2747+
    For compatibility with legacy content,
    2748+
    the following syntax is also supported:
    2749+
    2750+
    2751+
    Name: forced-colors
    2752+
    Value: none | active
    2753+
    For: @media
    2754+
    Type: discrete
    2755+
    2756+
    2757+
    active matches
    2758+
    when ''prefers-contrast: forced'' matches,
    2759+
    otherwise none matches.
    2760+
    27052761

    27062762
    Detecting the desire for light or dark color schemes: the 'prefers-color-scheme' feature
    27072763

    @@ -2763,36 +2819,6 @@ Detecting the desire for light or dark color schemes: the 'prefers-color-scheme'
    27632819
    please contact the CSSWG to discuss this.
    27642820
    27652821

    2766-

    2767-
    Detecting a forced color palette: the 'forced-colors' feature
    2768-
    2769-
    2770-
    Name: forced-colors
    2771-
    Value: none | active
    2772-
    For: @media
    2773-
    Type: discrete
    2774-
    2775-
    2776-
    The 'forced-colors' media feature is used to detect if
    2777-
    the user agent has enabled a forced colors mode
    2778-
    where it enforces a user-chosen limited color palette on the page.
    2779-
    2780-
    2781-
    none
    2782-
    2783-
    Forced colors mode is not active;
    2784-
    the page's colors are not being forced into a limited palette.
    2785-
    2786-
    active
    2787-
    2788-
    Indicates that forced colors mode is active.
    2789-
    The UA will provide the color palette to authors
    2790-
    through the CSS system color keywords
    2791-
    and, if appropriate, trigger the appropriate value of 'prefers-color-scheme'
    2792-
    so that authors can adapt the page.
    2793-
    See [[css-color-adjust-1#forced]] for details.
    2794-
    2795-
    27962822

    27972823
    Detecting the desire for reduced data usage when loading a page: the 'prefers-reduced-data' feature
    27982824

    @@ -3212,4 +3238,3 @@ Comments from
    32123238
    akklesed,
    32133239
    and 張俊芝
    32143240
    improved this specification.
    3215-

    0 commit comments

    Comments
     (0)