​>> Virgil: You ​look ​at ​a ​color ​palette, ​you ​look ​at ​a ​design ​and ​you ​kind ​of ​do ​that ​in ​a ​box. ​And it ​looks ​all ​pretty ​and ​you ​think ​it ​looks ​great. ​But ​in ​practicality, ​when ​you ​implement ​that ​on ​the ​site ​and ​then ​you ​test ​it ​for ​inclusivity, ​oftentimes ​they ​fail ​miserably.

>> Intro Speaker: You're ​listening ​to ​Discussing ​Stupid, ​a ​podcast ​sponsored ​by ​HighMonkey. ​​Join ​your ​host, ​Virgil ​Carroll ​and ​others ​as ​our ​podcast ​helps ​you ​transform ​bad ​digital ​experiences ​into ​teachable ​moments ​you ​can ​use. 

​>> Virgil: Last ​month, ​we ​finished ​up ​a ​process ​which ​took ​way ​too ​long, ​uh, ​in ​redoing ​our ​own, ​High Monkey ​website. ​Something ​that ​needed ​to ​happen, ​but ​my ​staff ​has ​been ​very ​busy, so ​it ​was ​something ​that, ​myself ​and ​Cole ​had ​to ​tackle, um, ​kind ​of ​on ​our ​own. ​​And ​it ​really ​brought ​back ​a ​lot ​of ​things ​and ​kind ​of ​startup, ​I'm ​going ​to ​say, ​as ​a ​series ​about ​rebuilding ​a ​site ​and ​everything ​that ​you ​do ​about ​it. ​So ​there's ​just ​a ​ton ​of ​topics ​around ​it. ​But ​one ​of ​the ​things ​I ​think ​is ​really ​unique ​about ​what ​we've ​done ​not ​only ​for ​our ​website, ​but ​also ​for ​the ​Discussing ​Stupid ​website, ​is ​that ​is ​talking ​about ​color. ​And ​not ​only ​color ​from ​an ​accessibility ​and ​inclusive ​design ​standpoint, ​but ​also ​from ​the ​challenge ​that ​colors ​kind ​of ​bring ​into ​your ​layout ​and ​kind ​of ​getting ​things, you ​know, ​obviously ​designers ​always ​want ​to ​make ​things ​very ​colorful ​and ​very ​exciting  ​and, ​uh, ​there's ​a ​lot ​of ​trade ​offs ​when ​you ​start ​looking ​at ​inclusive ​design ​and ​some ​of ​that. ​So ​in ​today's ​episode ​we're ​going ​to ​talk ​a ​little ​bit ​more ​about, ​uh, ​what ​some ​of ​those ​challenges ​are ​and ​kind ​of ​how ​we ​can ​deal ​with ​them, ​uh, ​and ​some ​of ​the ​strategies ​that ​you ​can ​use ​to, ​uh, ​be ​able ​to, ​um, ​you ​know, ​use ​color ​yet ​at ​the ​same ​time ​make ​your ​site, ​um, ​that ​inclusive ​site ​that ​it ​needs ​to ​be.

>> Cole: Um, yeah, for those wondering why this is episode 13.1 and not 13, um apparently 13 is a pretty unlucky number, so we decided to dodge that.

>> Virgil: It is, say you have a very superstitious boss that doesn't like to do things in 13. So there we go.

>> Cole: Well, there was certainly no 13 for, discussing stupid season one because it uh...

>> Virgil: Didn't ever made it that far. Thank you for pointing that out yet again. Yes, I realized that I, I only made it to nine episodes, but thank you.

>> Cole: Yep. But enough yapping. so we today are going to be talking about accessibility, but more specifically about how it applies to your brand's color palette. And so we've personally recently gone through some, you know, kind of similar experiences with our color palette. 

>> Virgil: Pain. Pain.

>> Cole: Pain. Pain, yeah, pain.

>> Chad: Yes.

>> Cole: Yep. We have realized that, you know, while it's, you know, probably a lot more fun to have a color palette with bright colors and fun colors and stuff, it's not always easy to have the text to background ratios be accessible. And that's, you know, obviously very important. It's of the, utmost importance on the web. But, you know. Yeah. anyone want to speak to how bad it is to have a inaccessible color palette?

>> Virgil: Oh, it's bad. It is tough. I mean, right there. I mean, you know, don't get me wrong, of course we've always had an accessible color palette, but. And it's not even about that. It's more about how you use it. And, and so it's, you know, the thing that, you know, especially you and I going through this redesign process of our website and really digging deep into something that that Chad does all the time. And us, maybe, you know, where we do the upfront stuff, don't really do the. The nitty gritty build work these days, or I should say, I don't do them these days. and Cole has never done them. So, that kind of works out. it's. It's color to implementation. You know, I mean, that really is what it's about. It's about, you know, you look at a color palette, you look at a design, and you kind of do that in a box and it looks all pretty and you think it looks great. But in practicality, when you implement that on a site and then you test it for, inclusivity, oftentimes they fail miserably, because colors just don't work. And so you and I were talking about it that, you know, definitely seeing a trend out there on websites of being more monochromatic again. you know, bright brights, dark darks, to really kind of meet that standard. and you can still do a lot of really cool things from design, but it's kind of knowing that up front and the challenges that you run into. And Chad, I know you run into it with our customers all the time.

>> Chad: Yeah. Even, even when they think they're, you know, designing towards that, inclusivity, accessibility, and the colors on a design look like they're going to be great. they won't pass. They sometimes just will not pass a test for that contrast that you're looking for. especially like bright colors against white backgrounds or those darker colors against a dark background. even if they're. Even if on a design, they're. They're pretty clear as day, that contrast ratio, that's what we look for, just isn't strong enough.

>> Virgil: Yeah. You know, one of the things I'd say, and actually it's kind of funny is, you know, as. As Cole and I were going through this redesign of the High Monkey site, I kind of use it as an opportunity to experiment and kind of, you know, not only refresh and get the cobwebs off my knowledge, but also to kind of look at what's new and crazy, that one of the things I experimented with for, I don't know, just a few days was, doing font size as a percentage, which seems like a great thing until you realize that if you've got a color out there that is, you know, and for People that don't know. Usually it's like large text, small text, so it's over 24 pixels and then it's under that, the, kind of, the kind of, the breakpoint there. And you put it in there and it's compliant, but you put it in as a percentage. As soon as you start to shrink down the screen and you go with the lower screens, it becomes uncompliant very quickly. And so that's another thing that happens a lot is that, you know, we test it on desktop and we're like, oh look, this is compliant. Well, the reality is, you know, you don't use a 40 point font on a mobile phone, you know, unless you want three letters per line, you know, and that. So, so I immediately went there where I, I set specific font sizes for that exact reason because there you can control it and say, I know this font size is compliant.

>> Cole: Yeah. So it's, it's not just about, you know, like the, the two colors between the text and background. It's also, you know, how big is your, your font because it might be accessible at a, you know, pretty large font size. but you know, as you get smaller and also you just don't want in general really small fonts on your, on your site. It's not a good look. But so we, we kind of so far have discussed the shift of a lot of websites to a more monochromatic look. But for people, you know, kind of wondering, hey, why I still want some color pop on my website, I still want some, I don't want it to look boring. you know, what are some ways that people can still achieve that on their websites?

>> Chad: Well, I was going to say, you know, I think it's important to have a theme. Just like it is important to have any sort of style guide. having a theme, having a color palette that colors work together to complement one another but still limit you to keep that design consistent. It's an experience when you visit a website, so you can have bright colors, you can have a range of colors, but keeping them in a palette, keeping them consistent throughout the site I think is very important. And, and knowing where to use them, what colors can be used on what kind of backgrounds, that kind of stuff and what sizes like you said, Virgil.

>> Virgil: Well, and I think also when you say where to use them, there's using colors, for decoration and there's using colors for purpose. Purpose colors. You should really never have accessibility issues. I mean in the ideal situation, if you have a black background you're using white text, you're never going to have an accessibility issue in that scenario in that. So, but decorative, that's, it's a little bit murkier. So I mean, you know, when you think about it, you're talking about people with, with, you know, it could be colorblind or it could just be some kind of different, you know, color sensitivity or something like that. You know, from, from the regulation standpoint, decorative doesn't matter. You know, and so you kind of have to balance that. So you know, you use it as a little accent color, as maybe an underline in that it's that it doesn't have a purpose. That's the most important part. It's just like when they talk about images, you know, you can kind of have really colorful images and for somebody that has vision challenges, they might not be able to see that. But if that image is there for a decorative means, otherwise it's just a pretty image on the page that's meant to be there to add some visual impact. you're not, you're not breaking the spirit of the rule. But if it was like a graph or it's showing, you know, multi lines at different colors to be able to show the trends on a sales projection or something, that's something that you need to be compliant because that image has a purpose to it. Those colors have a purpose to them. They're trying to identify it. So what we try to do is not make color have a purpose. And if so, then you better make sure that it's compliant colors that have a purpose. But if it's there for decorative means, I mean technically.

>> Cole: Okay, yeah, unrelated but important. If you're tuning in and appreciating the content, please make sure to like and subscribe and follow us because this is how we continue to do the podcast.

>> Virgil: And don't forget, people should share it as well.

>> Cole: Oh yeah, I always forget that.

>> Virgil: Kids, dogs. Whoever.

>> Chad: Seen some of my kids YouTube, shows, I think you're supposed to say smash that subscribe button.

>> Cole: Oh yeah, forgive me. Smash that subscribe button. Right, yeah, yeah, kind of. You know, the approach that we took to our website redesign was kind of leaning more towards, you know, a, darker background for most of the sections and lighter background for the other sections, but kind of really using decorative, images to enhance the look of a lot of pages to make it, you know, not just look like a black and white website. I, think that's, it's looking, looking pretty effective so far.

>> Virgil: How, but we weren't 100% successful, were we? I mean, we, we tried using color, but, like the orange or. I mean, let's go back to. It depends on who you talk to at High Monkey, whether it's orange or yellow. I'm going to go with orange because that's what I think it is. but. But our color, that, that one's one there that's very difficult for us. We can use it on very large text. We can't use it on small. We can use it on, as a background on, on, on very large text or very dark text. in there. But that's, you know, it's a perfect example. But yeah, I mean, on our site we basically said, instead of bringing a lot of color into the site itself, we, would bring it in through images and through. Through colorful images and, you know, tried to get images that were very vibrant in colors. Not, not more muted in that, but very vibrant in colors to kind of add that contrast. So there's a lot of, you know, this, this isn't a bad thing for designers. The problem is what happens is that usually most organizations, primary colors in their color palette just don't work in that. So, I can think of a particular state that we've worked with many a times, and I can tell you that even though their, their colors are compliant, their color combinations are terrible in that, you know, and that's just one of those things that frustrates a lot of people because you can't use a lot of those colors well to make something visually look good, but they are compliant. So that's kind of. There's this impress impression out there that if you have compliant colors, you can't make them look good together, in that. And so you have to be a little bit more flexible and a little bit more creative in how you do your designs.

>> Cole: Yeah, maybe they should just revert to the, the good old brown, brown look that all those old.

>> Virgil: Yeah. Well, you know, the funny thing is to me and Chad and I both remember this as, you know, where so many years, the common style was blue on blue on blue. You know, it was just different shades of blue, and none of that would work in that kind of stuff. So, you know, I've. I've been a preacher of contrast for a really long time. Even before, accessibility, inclusive design really took a forefront in there. I've always said it because it's also just easier on people's eyes when they view things it's much easier for them to see and understand when they see contrast that this is important that this is different than over here and too many designers do complementary more so and don't really think of it from a functional standpoint and I think that's one thing that is very good about kind of inclusive design practices is it makes you make things very functional.

>> Cole: Yeah fully agree there. I think a lot of times the functional aspect of color palettes is kind of lost but that's what we're here for to push, push that positive agenda.

>> Virgil: That's a very good way of summing it up Cole.

>> Cole: Appreciate it. Alrighty. Well thanks everyone for tuning in and have ah a great rest of your day.

>> Virgil: Just a reminder, we'll be dropping new episodes every two weeks. If you enjoyed the discussion today, we would appreciate it if you hit the like button and leave us a review or comment below. And to listen to past episodes or be notified when future episodes are released, visit our website at www.discussingstupid.com and sign up for our email updates. Not only will we share when each new episode drops, but also we'll be including a ton of good content to help you in discussing stupid in your own organization. Of course, you can also follow us on YouTube, Apple Podcasts, Spotify or SoundCloud, or really any of the other favorite podcast platforms you might use. Thanks again for joining, and we'll see you next time.