Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Focused links have low contrast #264

Closed
cfq opened this issue Dec 7, 2016 · 4 comments
Closed

Focused links have low contrast #264

cfq opened this issue Dec 7, 2016 · 4 comments

Comments

@cfq
Copy link
Contributor

cfq commented Dec 7, 2016

Links don't have good contrast against $focus-colour when they're in focus, it's currently 4.07:1. Keyboard users who have low vision would notice them. Screen magnification and keyboard users whose zoom follow keyboard focus would find it hard if they need high contrast.

We can fix it by setting the link colour on focus to be the same as $text-colour.

Current:
screen shot 2016-12-07 at 15 27 17

Proposed:
screen shot 2016-12-07 at 15 26 11

@edwardhorsford
Copy link
Contributor

edwardhorsford commented Dec 7, 2016

Since it's very close to being acceptable, I wonder if we could just go with a slightly darker version of link colour? The black looks rather different, whereas a darker blue isn't that noticeable.

Example:
screen shot 2016-12-07 at 17 15 52

Edit: might want to pick a colour rather than simply using sass to darken. The darker version is not saturated enough - manually picking we could get colour that perceptually is the same.

@quis
Copy link
Member

quis commented Dec 7, 2016

The blue and orange isn’t a good colour combination because of chromostereopsis.

@robinwhittleton
Copy link
Contributor

I don’t mind the black, but it does cause another problem: it’s impossible to tell whether the currently focused link has been visited.

@edwardhorsford
Copy link
Contributor

@trevorsaint has pointed out that the contrast is poor on our service names when focused.

Example:
unnamed

Suggest the solution here is to make the service name black when focused - it then matches the proposition links that are already black.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants