5

This is a similar issue to the one affecting the SE profile pages, but affects the mobile version of the website.

A screenshot of the problem taken by changing the Safari user agent string to mimic the iPhone

This fails the WCAG contrast checking algorithm, which recommends that the contrast ratio be at least 5:1. According to the OS X version of the Colour Contrast Analyser tool, the ratio according to the algorithm is currently 1.1:1:

Foreground: #173B5B - Background: #313C57

The contrast ratio is: 1.1:1

Text failed at level AA Text failed at level AAA Large text failed at level AA Large text failed at level AAA

1.4.3 Contrast (Minimum): Text (and images of text) have a contrast ratio of at least 4.5:1, except if the text is pure decoration. Larger scale text (at least 18 point or 14 point bold) or images of text can have a contrast ratio of 3:1. (Level AA)

1.4.6 Contrast (Enhanced): Text (and images of text) have a contrast ratio of at least 7:1, except if the text is pure decoration. Larger scale text (at least 18 point or 14 point bold) or images of text can have a contrast ratio of 4.5:1. (Level AAA)

colour difference:31 / brightness difference:8

The difference in brightness between the two colours is not sufficient. The threshold is 125, and the result of the foreground and background colours is 8.

The difference in colour between the two colours is not sufficient. The threshold is 500, and the result of the foreground and background colours is 31.

0

1 Answer 1

Reset to default
2

the 48x48 site icon was meant for desktop use(where the bg is white). It obviously didn't work well for the UX site on mobile. So I updated the color scheme. so the contrast ratio is about 1.75:1.

enter image description here

The update will be in the next production build.

3

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .