Page MenuHomePhabricator
Create Task
Maniphest T126918

Contrast too low for some elements and Darken colours not respected in iOS app
Closed, DeclinedPublic
Actions

Description

Some texts in the app have too low contrast, some people will therefore have trouble reading such texts. WCAG formulates that text should have a contrast ration of at least 7 : 1, except for large text (at least 18pt or 14pt bold) which can have a lower contrast 4,5 : 1 (level AAA of WCAG).

  • Headings of sections on the Explore page have a contrast ratio of 3,65 : 1
  • Subtitles in Nearby have a contrast ration of 3,65 : 1
  • Additional information in language selection has a contrast ratio of 3,65 : 1
  • The “Search Wikipedia” boilerplate text has a contrast ratio of 1,92 : 1
  • The Search Wikipedia edit field has a contrast ration of: 1,74 : 1

(This was tested rAPIOS44e76753b09c in late December so the numbers might not be entirely up to date, but it is evident that contrast is still low in these circumstances with current version too.)

The solution is to darken these colours to increase contrast above the 7 : 1 threshold when Darken colours is turned on in iOS Settings -> General -> Accessibility -> Increase Contrast -> Darken Colours. See [[ UIAccessibilityDarkerSystemColorsEnabled | UIAccessibilityDarkerSystemColorsEnabled ]] and UIAccessibilityDarkerSystemColorsStatusDidChangeNotification.

It remains to identify all the places where this is needed.

Related Objects
Search...

Event Timeline

hhanke created this task.Feb 14 2016, 3:44 PM
hhanke raised the priority of this task from to High.
hhanke updated the task description. (Show Details)
hhanke added projects: Accessibility, Wikipedia-iOS-App-Backlog.
hhanke added subscribers: MBinder_WMF, • BGerstle-WMF, hhanke and 8 others.
Danny_B moved this task from Unsorted to Colors on the Accessibility board.Feb 15 2016, 12:34 AM
• JMinor moved this task from Needs Triage to Bug Backlog on the Wikipedia-iOS-App-Backlog board.Feb 18 2016, 12:30 AM
• JMinor lowered the priority of this task from High to Low.May 9 2016, 7:11 PM
• JMinor removed subscribers: • KLans_WMF, • wikibugs-l-list, • Deskana, • brooke.
• JMinor added a project: iOS-app-feature-Accessibility.May 9 2016, 11:57 PM
MBinder_WMF unsubscribed.Jun 6 2016, 8:41 PM
MBinder_WMF added a project: iOS-app-Bugs.Jul 25 2016, 7:15 PM
• JMinor moved this task from Backlog to October-2016-Sprint on the iOS-app-feature-Accessibility board.Oct 20 2016, 12:22 AM
• JMinor edited projects, added iOS-app-feature-Accessibility (October-2016-Sprint); removed iOS-app-feature-Accessibility.
• JMinor added a project: iOS-app-v5.3.2-Lighthouse.Oct 20 2016, 12:30 AM
• JMinor added subscribers: cmadeo, RHo.

@RHo can you take a look at the contrast ratios for the dynamic text styles you're spec'ing?

cc @cmadeo

• JMinor moved this task from Tasks from Product Backlog to Needs Design on the iOS-app-v5.3.2-Lighthouse board.Oct 20 2016, 12:33 AM
RHo added a comment.EditedOct 20 2016, 12:53 AM

@JMinor – yep, this can added as extra columns on this spreadsheet, with each text element updated to those in our new color palette that are at least AA-compliant in normal settings.

  • M82 Color palette (Wikimedia Design Style Guide/WikimediaUI)
    17

    • Suggest we could split this into two tasks:

    1. Ensure text in the app complies with AA contrast standards.
    2. Ensure when the iOS Accessibility Setting 'Darker colors' is turned on, AAA-compliant colors are applied.
    • JMinor created subtask T148770: Ensure app colors meet AA contrast ratios.Oct 20 2016, 5:14 PM
    • JMinor created subtask T148771: Support the Darken colors iOS setting.Oct 20 2016, 5:17 PM

    Thanks @RHo. Created two subtasks based on your suggested phasing.

    RHo added a comment.Oct 24 2016, 10:03 PM

    @JMinor – just clarified the second Darken colors ticket T148771: Support the Darken colors iOS setting that we would just check sufficient contrast is applied on key text sections in the app since:
    (a) it does not appear that we can actually set the darker colors, the OS just detects and darkens colors.
    (b) Clarify that we will not aim for AAA-compliance everywhere, but the more forgiving WCAG AA-compliance (my emboldening):

    1. Conformance Level: One of the following levels of conformance is met in full.

    Level A: For Level A conformance (the minimum level of conformance), the Web page satisfies all the Level A Success Criteria, or a conforming alternate version is provided.
    Level AA: For Level AA conformance, the Web page satisfies all the Level A and Level AA Success Criteria, or a Level AA conforming alternate version is provided.
    Level AAA: For Level AAA conformance, the Web page satisfies all the Level A, Level AA and Level AAA Success Criteria, or a Level AAA conforming alternate version is provided.
    Note 2: It is not recommended that Level AAA conformance be required as a general policy for entire sites because it is not possible to satisfy all Level AAA Success

    (From: Web Content Accessibility Guidelines (WCAG) 2.0 https://www.w3.org/TR/WCAG20/)

    Note AA is also within the acceptable minimum recommended Apple's guidelines:

    Strive for a minimum contrast ratio of 4.5:1, although 7:1 is preferred because it meets more stringent accessibility standards.

    From: https://developer.apple.com/ios/human-interface-guidelines/visual-design/color/

    RHo moved this task from Needs Design to Needs Acceptance Criteria on the iOS-app-v5.3.2-Lighthouse board.Oct 31 2016, 2:17 PM
    • JMinor moved this task from Needs Acceptance Criteria to Needs Engineering Sync on the iOS-app-v5.3.2-Lighthouse board.Nov 8 2016, 7:19 PM
    • JMinor moved this task from Needs Engineering Sync to Needs Design on the iOS-app-v5.3.2-Lighthouse board.Dec 5 2016, 8:03 PM
    • JMinor removed a project: iOS-app-v5.3.2-Lighthouse.Dec 6 2016, 7:50 PM
    • JMinor closed subtask T148770: Ensure app colors meet AA contrast ratios as Resolved.Feb 24 2017, 9:12 PM
    • JMinor closed this task as Declined.Mar 23 2017, 9:04 PM

    Closing this, as contrast is resolved under another ticket and darkening has its own subtask.

    • JMinor closed subtask T148771: Support the Darken colors iOS setting as Resolved.Mar 15 2018, 8:41 PM
    Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL · Credits