Confirmed users
36
edits
Accessibility/Design Guide: Difference between revisions
Jump to navigation
Jump to search
Add CSS System Colors link, update to canvas colors from windows colors
Mreschenberg (talk | contribs) m (style) |
Mreschenberg (talk | contribs) (Add CSS System Colors link, update to canvas colors from windows colors) |
||
| Line 9: | Line 9: | ||
=== With HCM enabled === | === With HCM enabled === | ||
Colors should be mapped semantically from the typical application palette to the reduced palette supplied by the operating system. Colors outside this palette should not be used because they will not adapt to users' preferences. Mapping should not result in a loss of information or context (eg. selected items should remain visually distinct from non-selected items, and information should not be communicated by color alone). The following are traditional foreground / background mappings: | Colors should be mapped semantically from the typical application palette to the reduced palette supplied by the operating system. Colors outside this palette should not be used because they will not adapt to users' preferences. Mapping should not result in a loss of information or context (eg. selected items should remain visually distinct from non-selected items, and information should not be communicated by color alone). The following are traditional foreground / background mappings given in [https://www.w3.org/wiki/CSS/Properties/color/keywords#System_Colors CSS System Colors]: | ||
* Selected elements should use SelectedItemText / SelectedItem | * Selected elements should use SelectedItemText / SelectedItem | ||
* Controls should use ButtonText / ButtonFace | * Controls should use ButtonText / ButtonFace | ||
| Line 15: | Line 15: | ||
* Visited links should use MozNativeVisitedHyperlinkText for their foreground, background preserved | * Visited links should use MozNativeVisitedHyperlinkText for their foreground, background preserved | ||
* Inactive components should preserve their background, but change their foreground to GrayText | * Inactive components should preserve their background, but change their foreground to GrayText | ||
* Components not in the above categories should use WindowText / Window | * Components not in the above categories should use CanvasText / Canvas (older implementations may use WindowText / Window) | ||
For components which represent a combination of states, a combination of colors is necessary. For example: | For components which represent a combination of states, a combination of colors is necessary. For example: | ||