[OPLIN 4cast] OPLIN 4cast #518: Do your website’s colors measure up?

[OPLIN Support]

Email not displaying correctly? View it in your browser.
<http://www.oplin.org/4cast/>
[image: OPLIN 4Cast]

OPLIN 4cast #518: Do your website’s colors measure up?
November 30th, 2016

[image: The magnifying glass standing on a leaf of the test print] We’re
all generally aware that websites – and perhaps library websites especially
– should be accessible to people with impaired vision. One aspect of that
accessibility is the contrast between the color of the text and the
background color of a webpage; too little contrast and the text becomes too
difficult for some people to read. Fortunately, there is no need to guess
about the proper contrast, because there are standard measures and a number
of software tools that can calculate the contrast ratio and tell you if it
is within the correct range. Unfortunately, some web designers ignore color
contrast in the interest of making websites prettier – at least to their
eyes on their monitors.
- Usability: Accessibility
<https://material.google.com/usability/accessibility.html#accessibility-color-contrast>
(Material design | Google)  “The contrast ratio between a color and its
background ranges from 1-21 based on its luminance, or intensity of light
emitted, according to the World Wide Web Consortium (W3C)
<https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html>.
Contrast ratios represent how different a color is from another color,
commonly written as 1:1 or 21:1. The higher the difference between the two
numbers in the ratio, the greater the difference in relative luminance
between the colors.”
- Calculate contrast ratio of two colors as per WACG guidelines
<http://www.ilovefreesoftware.com/09/featured/calculate-contrast-ratio-of-two-colors-as-per-wacg-guidelines.html>
(ilovefreesoftware | Salman Khan) “WACG 2.0
<http://webaim.org/blog/wcag-2-0-and-link-colors/> (Web Content
Accessibility Guideline 2.0) is actually a set of rules for content
accessibility (mainly for people with impairment or color deficiency), and
color contrast is one of the aspects of accessibility. The color contrast
ratio is measured in two different types of accessibility compliant i.e. AA
and AAA. According to the WACG 2.0, the standard AA ratio for normal text
should be at least 4.5:1 and for larger text 3:1, whereas, the standard AAA
ratio should be at least 7:1 for normal text and 4.5:1 for larger text. So,
using these websites you can generate color contrast and check whether they
pass or fail AA and AAA standard ratios.”
- Contrast (Minimum): Understanding SC 1.4.3
<https://www.w3.org/TR/2016/NOTE-UNDERSTANDING-WCAG20-20161007/visual-audio-contrast-contrast.html>
(W3C Working Group Note)  “Text that is larger and has wider character
strokes is easier to read at lower contrast. The contrast requirement for
larger text is therefore lower. This allows authors to use a wider range of
color choices for large text, which is helpful for design of pages,
particularly titles. 18 point text or 14 point bold text is judged to be
large enough to require a lower contrast ratio. […] ‘18 point’ and ‘bold’
can both have different meanings in different fonts but, except for very
thin or unusual fonts, they should be sufficient.”
- How the web became unreadable
<https://backchannel.com/how-the-web-became-unreadable-a781ddc711b6>
(Backchannel | Kevin Marks)  “As LCD technology advanced and screens
achieved higher resolutions, a fashion for slender letterforms took hold.
Apple led the trend when it designated Helvetica Neue Ultralight
<https://kevinmarks.github.io/colourandcontrast.html> as its system font in
2013. (Eventually, Apple backed away from the trim font by adding a bold
text
<https://www.macobserver.com/tmo/article/ios-7-go-bold-for-easy-to-read-text>
option.) As screens have advanced, designers have taken advantage of their
increasing resolution by using lighter typeface, lower contrast, and
thinner fonts. However, as more of us switch to laptops, mobile phones, and
tablets as our main displays, the ideal desktop conditions from design
studios are increasingly uncommon in life.”

*Articles from Ohio Web Library <http://ohioweblibrary.org>:*

   - Web accessibility, libraries, and the law.
   <http://search.ebscohost.com.proxy.oplin.org/login.aspx?direct=true&db=cmh&AN=58478965>
   (*Information Technology & Libraries*, March 2011, p.34-43 | Camilla
   Fulton)
   - Vision: Brightness and contrast.
   <http://search.ebscohost.com.proxy.oplin.org/login.aspx?direct=true&db=cmh&AN=109424537>
   (*Salem Health: Psychology & Behavioral Health*, 2015, p.1992-1995 |
   Bonnie S. Sherman)
   - Accessibility is more than curb cuts and ALT tags.
   <http://search.ebscohost.com.proxy.oplin.org/login.aspx?direct=true&db=cmh&AN=112316569>
   (*Computers in Libraries*, Jan./Feb. 2016, p.22-24 | jessamyn west)

------------------------------
The *OPLIN 4cast* is a weekly compilation of recent headlines, topics, and
trends that could impact public libraries. You can subscribe to it in a
variety of ways, such as:

   - *RSS feed.* You can receive the OPLIN 4cast via RSS feed by
   subscribing to the following URL: http://www.oplin.org/4cast/
   index.php/?feed=rss2.
   - *Live Bookmark.* If you're using the Firefox web browser, you can go
   to the 4cast website (http://www.oplin.org/4cast/) and click on the
   orange "radio wave" icon on the right side of the address bar. In Internet
   Explorer 7, click on the same icon to view or subscribe to the 4cast RSS
   feed.
   - *E-mail.* You can have the OPLIN 4cast delivered via e-mail (a'la
   OPLINlist and OPLINtech) by subscribing to the 4cast mailing list at
   http://lists.oplin.org/mailman/listinfo/OPLIN4cast
   <http://lists.oplin.org/mailman/listinfo/OPLIN4cast>.

© 2016 Ohio Public Library Information Network
[image: Find us on Slideshare] <http://www.slideshare.net/oplin>  [image:
Find us on Facebook] <http://www.facebook.com/oplin.org>  [image: Find us
on Google+] <https://plus.google.com/107751358238995507967>  [image: Find
us on Twitter] <http://www.twitter.com/oplin>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.oplin.org/pipermail/oplin4cast/attachments/20161130/e2b3c53a/attachment.html>