The AccessibilityAccessibilityAccessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) Team provides accessibility expertise across the project to improve the accessibility of WordPress coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. and resources.
The WordPress Accessibility Coding Standards state that “All new or updated code released in WordPress must conform with the Web Content Accessibility Guidelines 2.1 at level AA.”
Color is important to make a beautiful website, but not everyone sees colors the same way. That’s why it’s important to check color contrast and also the use of color:
Check the color contrast of text against it’s background
Color should not be the only indicator for information or function
A few tips:
Website should be usable in grey scale – don’t use uncomfortable color combinations like bright green and neon-yellow or too-high color contrast
Dark fonts on light backgrounds are easier to read for most people; but some users may need the reverse
If using a light font on a dark background, you should use a slightly larger font than you might otherwise choose, so that it is still easy to read
Considering color contrast is an important issue to address for the accessibilityAccessibilityAccessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) of your website. It should be considered for foreground (text and other elements) and background colors (or images), but also between elements and hover effects.
Color contrast should be high enough for good readability, but at the same time it should not be too bright for people with sensitive eyes or cognitive problems.
Using color to differentiate between elements on a page is fine. However, you should avoid using color as the only visual means to differentiate parts of a page. For example,
error, success, or note messages
links in the content
active, hover or focus states
display information updates
Instead, use additional styling to mark a function or information, that includes a change of shape or decoration. For example:
Change symbols in addition to color
Underline links, that are embedded in text
Grouped links in sidebars, your footer or in navigation menus frequently don’t need to be underlined. If it is obvious in context that the text is a link, underlines are not required. However, in many cases underlining can increase the usability of your website.
Links not underlined – color blind users may have trouble distinguish links from text.
Can you see the links now?
Color used as the only indicator for information or functionality
The easiest way to check whether your website is usable for colorblind people is to use it in greyscale. When the color information is extracted, you can more easily see whether your website is still understandable.