code4lib / 2022.code4lib.org

Website for the 2022 Conference
https://2022.code4lib.org/
2 stars 3 forks source link

Updated Color Scheme for 2022 Conference Site #2

Closed dzoladz closed 2 years ago

dzoladz commented 3 years ago

We'll need to apply a fresh coat of paint on the site for the Buffalo conference. In previous years, we've used color schemes that have drawn from the professional sports teams of the host city. To get the ball rolling, I've put together a simple palette based upon the Buffalo Sabres hockey team: https://coolors.co/002673-f3d03e-F5F5F5-e8e8e8

I've also quickly updated the assets/_scss/_variables.scss with the above set of colors, which you can preview here: http://code4lib.org/2022.code4lib.org/

By no means do we need to stick to this color scheme, if there's a more appropriate or applicable color references to the Buffalo that we should consider. If we decide to generally stick with this color scheme, we'll need to perform an accessibility audit and open separate issues to resolve any problems.

phette23 commented 3 years ago

The blue/yellow scheme looks excellent to me! We'd have to be on the lookout for the secondary yellow used as a font color anywhere since, in my experience, it seldom meets contrast standards except against a black background. My instinct was to go with the Blue/Red of the Buffalo Bills, but I forgot about hockey: https://teamcolorcodes.com/buffalo-bills-color-codes/

yarnetsky commented 3 years ago

tl;dr -- I like the blue-gold combo, but we'll need a different link color for white backgrounds — traditional blue on white?

Onto the details...

Blue as primary is a no-brainer to me— Buffalo is a water city. The city flag, Sabres, and Bills all use varying shades of medium blue. Of these, the city flag is easiest on the eye. I'm on board with the #002673 shade of blue.

Secondary colors get messy. I tested contrast using the Sabres gold and Bills red (as taken from their websites— gold #FEBA35 and red #c41836).

Combos that pass (tested both ways)...

Combos that fail...

Thus, as Eric notes, we'll need multiple link colors whether we go Sabres or Bills. (Then again, we use multiple link colors in our footer alone.)

All that said, I'm leaning towards the blue/gold theme, but we'll likely need to use blue on white instead of gold on white for body text links.

dzoladz commented 3 years ago

We'd have to be on the lookout for the secondary yellow used as a font color anywhere since, in my experience, it seldom meets contrast standards

Noted... and wholly agree.

All that said, I'm leaning towards the blue/gold theme, but we'll likely need to use blue on white instead of gold on white for body text links.

I'm fine with this approach.

dzoladz commented 3 years ago

Before we definitely move forward with a blue/gold focused theme for 2022 (using red as accent color, https://coolors.co/002673-feba35-f5f5f5-e8e8e8-c41836).

@ranti @starsplatter @kaitlinnewson Do you have any input to add to this discussion before a decision is made?

dzoladz commented 3 years ago

Updated gold on white links to be blue on white: http://code4lib.org/2022.code4lib.org/

kaitlinnewson commented 2 years ago

I'm happy with the blue/gold theme as well!