When the Client's Favourite Colour Fails the Accessibility Test
A student is designing a mobile app interface for a local youth mentoring service. The client has supplied a brand palette: a mid-tone teal primary button (#3AAFA9) with white label text, a light grey secondary button, and a coral accent. The app must meet WCAG 2.1 AA contrast for normal text, which requires a contrast ratio of at least 4.5:1. The student calculates that white text on the teal button achieves roughly 2.4:1. The client insists the teal is central to their identity and asks the student to keep it exactly. The student has already built a clickable prototype with the teal buttons and the client has approved it visually. The assessment requires the student to justify accessibility decisions with evidence.
1. Evaluate the student's options for resolving the contrast failure while respecting the client's brand requirement.
Read the worked answer
The measured ratio of about 2.4:1 is well below the 4.5:1 threshold, so the current button fails AA for normal text. The student should not simply accept the client's instruction, nor override the brand unilaterally.
There are several legitimate options. The label colour can change: dark text on the teal may reach 4.5:1 where white does not, and this preserves the exact teal. Alternatively, the teal can be retained as a brand colour in non-text elements, borders, and large headings where the threshold is 3:1, while the button fill is darkened slightly to reach 4.5:1 with white text. A third option keeps the exact teal but increases the label size and weight so the text qualifies as large text at 3:1, though this only works if the resulting ratio clears 3:1, which 2.4:1 does not.
The student should calculate each option, present the ratios as evidence, and recommend the one that preserves the brand most closely while passing. The client's identity is not necessarily tied to one hex value; a slightly darker teal may be visually indistinguishable in context but compliant.
2. The client argues that accessibility is a nice-to-have and the prototype is already approved. How should the student respond, and what should be recorded in the portfolio?
Read the worked answer
The student should respond with the specific consequence, not a general principle. A 2.4:1 button label is difficult to read for many users, including people with low vision and anyone using the app outdoors, and the mentoring service's users may include exactly those groups. Accessibility is a functional requirement of the product, not a finishing touch, and a failed contrast ratio is a defect in the same way a cracked case would be.
The student should also note that the visual approval was given on appearance, not on measured contrast, so approval does not resolve the defect. The professional response is to present the evidence, offer the compliant alternatives, and let the client make an informed decision, recording that decision.
The portfolio should include the contrast calculation, a screenshot of the failing state, the alternative options with their ratios, the client communication, and the final chosen state. If the client insists on the failing colour, the student should document the advice given and the risk accepted. This demonstrates critical response and professional judgement rather than either silent compliance or unilateral change.