Skip to content
This repository has been archived by the owner on Sep 12, 2022. It is now read-only.

Using blue color for links instead of red? #209

Closed
roll opened this issue Jun 24, 2021 · 3 comments
Closed

Using blue color for links instead of red? #209

roll opened this issue Jun 24, 2021 · 3 comments
Labels
enhancement General improvements

Comments

@roll
Copy link
Member

roll commented Jun 24, 2021

Hi,

@rufuspollock
@lwinfree
@sglavoie
@sapetti9

I've been working a lot on the website lately and still can get used to the red color of the links and hovers. TBH red is usually associated with danger/errors/etc (e.g. Bootstrap Button) so it might be the reasons why it doesn't feel natural at least for me.

If we compare the main website and the specs:

The latter in my eyes is more comfortable to read.

WDYT? Does someone have a similar perception? Shall we ask users to confirm that it's OK/not OK?

@roll roll added the enhancement General improvements label Jun 24, 2021
@sglavoie
Copy link
Contributor

@roll since you asked, here are some of my observations 😄 :

Current theme with orange

The contrast can't be high enough with a white background according to the WebAIM contrast checker: otherwise, the color needs to be much closer to red than to orange. This can be seen with the checker tool here.

current_orange

Orange: #EA6D4C

A clear orange would work well with a dark theme if this is ever considered as an alternative:

dark_theme

Clear orange: #ff9a00

Theme with blue

With a white background, blue is a clear winner in my view. However, the current tint of blue also lacks some contrast.

Current theme with blue

current_blue

This color would also work a lot better for a dark theme.

Blue: #1A98FF

Proposed modifications

The fine tuning of the colors is of course up to you, but I think something like this can be achieved:

new_blue

This would be done by taking the orange from the logo, making it dark enough and taking its complementary color:
2021-06-24_08-18

Then, for the links in the navbar and sidebar to shine a bit more, contrast can be dropped a bit on the inactive links by choosing a different tint:

2021-06-24_08-31

New blue: #007A9A
New navbar/sidebar inactive color (grayish blue): #616E7C

This color picker tool could be helpful to experiment.

@lwinfree
Copy link
Member

this is SO helpful @sglavoie! thank you for all this info!

@roll
Copy link
Member Author

roll commented Sep 12, 2022

MERGED into frictionlessdata/frictionlessdata.io#757

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement General improvements
Projects
None yet
Development

No branches or pull requests

3 participants