The Psychology of Color in Web Design

Brett Johnson [: 00:00:00

Welcome to The Circle Sessions featuring The Circle of Experts. The Circle of Experts are Yasmine Robles from Robles Designs, Tanisha English Amamoo of TJE Communications, and Don The Idea Guy. I'm Brett Johnson from Circle 270 Media Podcast Consultants. Each week, one of the Circle of Experts joins me to talk about critical aspects of growing your podcast. We focus on marketing, social media, monetization, and website design, with all in mind of keeping them implemented together to get your podcast even better. This week, Yasmine is here from The Circle of Experts. Yasmine works alongside clients to design a website that's driven by strategy, looks amazing, and that you can actually use to grow your business, your podcast.

Brett Johnson [: 00:00:45

Anything you wanna do with your website's gonna grow. Yasmin, thanks for joining me today.

Yasmine [: 00:00:48

Yeah. Thank you for having me back. I'm I'm always excited to share some knowledge.

Brett Johnson [: 00:00:52

Cool. I I love the topic. We haven't touched upon this really very much at all that you wanna talk about the psychology of color in the web design. I I it that fascinates me that it's that different colors do things to us that we don't even know. I I I mean, you know, it's it's interesting. It it really is. Go into it a little bit more. Yeah.

Yasmine [: 00:01:15

Yeah. So like you mentioned, colors can make us take action. They can make us sad. They can make us excited, but they really carry the psychological meanings that can vary across all cultures, really. So for instance, red Red is often associated with passion and urgency, while blue conveys trust and stability. So you can see the difference between Certain businesses like banks and and fast food chains and what colors they end up choosing, there. And then really understanding these will help You when you are creating the art for your podcast, your podcast artwork for website designers and small business owners who might be overseeing their website Designer or just in general, like a graphic designer, and really thinking about color in an in an intentional and impactful way.

Brett Johnson [: 00:02:02

Right. You know, you mentioned something about that international viewer. Is there some references or points to go to? You know, maybe red means something different to us than a a possible targeted geographical area you wanna do business in.

Yasmine [: 00:02:17

Yeah. So it's a so you'll wanna think about your user or your Target audience. So very general in China, they have their the red symbolizes something very different from Here or, for example, my mother will not wear any red because she thinks she's very, very religious. But She she doesn't associate red with, like, passion. She associates it with something else. Black is associated typically Cross cultures as morning, a color of morning if you wear it. But others might attribute it, perhaps, the color white as the color of morning. So It just really varies, and you just wanna know your target market.

Yasmine [: 00:02:54

We're here. We are in the States, and I do business with other people who've been here a while So or or North America in general, so it's a little similar. And as people are traveling and experiencing other cultures, I think we're just gonna have a A blend of all of these ideas, but you still wanna keep in mind when you're creating your artwork for your podcast, your logo, What do you wanna convey? What sort of action? Are you a yoga instructor? Are you getting people to do a HIIT workout? And those 2, they're still in the health sphere, but those 2 might require different colors.

Brett Johnson [: 00:03:27

Right. So let's talk about how these colors impact our emotions and moods when we interact with the websites.

Yasmine [: 00:03:34

Yeah. So colors have the power to really evoke a wide range of emotions. Like we talked about, warm tones like the reds and the oranges, they'll create excitement and energy, While the cooler tones with the blues and greens will promote more calmness. So, again, keeping that target market and keeping your overall brand identity in mind. In website design, in particular, selecting the right colors can help convey these desired emotions that you you you want to bring out And really enhance the overall user experience. And we'll touch a little bit upon this. But, for example, we you have to keep in mind the people who might be Colorblind might have a little shift in their color spectrum, and we are currently designing a site for a client who the partner of the company, revealed that he was I I forget off the top of my head, but, like, blue green color blind. And so when we were designing with teal and greens, he was like, I can't see that.

Yasmine [: 00:04:27

And we'll talk about some free tools online where you can fix the like, you can test your site and your graphics. Even looking at it in black and white and or gray scale can help, but that's a little more into the accessibility realm, which we did a talk on before.

Brett Johnson [: 00:04:43

Yeah. That's interesting that you you have access to a person. You have the test market right there in that company. That's that's I mean, you look at everything pro con, you know, sadly that, you know, he has that issue with seeing the colors, but it's like, what a great opportunity to make sure that that website's zoning in On that, you you understand that that exists out there potentially. Yeah. Oh my gosh. Yeah. So how let's talk about brands.

Brett Johnson [: 00:05:07

You know, strategically using colors to build identity and recognition. That's probably the easiest for us to understand. We we are inundated with brands all the time, but we we we look beyond them. We don't know that It's all by design of how they've put the colors together and the look.

Yasmine [: 00:05:24

Yeah. Yeah. And you say by design, I think some a lot of start up business Pick their favorite color. I know I did. When I first started, I think it was, like, hot pink or something.

Brett Johnson [: 00:05:32

Right.

Yasmine [: 00:05:32

And, and then we we start to evolve But beyond that, right, when we start growing the business or your podcast starts to gain some leverage, how can we expand on this and become an empire? Right? A really well branded company. So Brands use colors to evoke specific emotions and create a memorable identity. And they and think of iconic brands like Coca Cola or, with their bold red or Starbucks with its green colors. And think of the coffee shops that you See, all of the if you go through down the aisle of all of the, energy drinks, what sort of colors are they using? How are they differentiating themselves? And their target market. Right? So if you are targeting women be on a as an energy drink, if you are targeting men who are into fitness and power Power lifting or whatever, and you're targeting women who might be into yoga and just want that little pick me up for the 3 o'clock slump. Your colors will vary a lot, for your brand. So, again, keeping I keep saying keep the target market in mind, but it's really It will really knowing them will really support your color choices.

Brett Johnson [: 00:06:37

And I know talking about that too and not really trying to create a hurdle to stop you from doing something and just You spend weeks on this. It's pretty easy to do some research. I the research been has been done for you. You look up those brands and and even ask Google why did Coca Cola choose this color? I'm sure you'll find research on it. So it's one of those pick the niche that you're looking at whether if you're if You have a podcast about coffee. We'll look at, okay, what are cough common coffee colors that are being used and kinda research that. I, you know, I I always look at it as don't try to create a hurdle, but it's like but do some research. Put a couple of hours into it.

Yasmine [: 00:07:13

Yeah. A couple of hours, you don't have to become a a color scientist To or designer to think about this. But even if let's say you do have a product, go to the grocery store and look at what other similar products. Maybe your product is something new and incredible. What are the direct and indirect comp competitors out there, and what colors are they using? How can you both fit in but also stand out? So just because a coffee shop tends to use Brown colors, Starbucks decided to use a green. Now they didn't use a red, but they used a green color that still has a little bit of energy. It still invokes a certain emotion, but it's not going to be, for example, like a red Coca Cola can.

Brett Johnson [: 00:07:59

Right? So the the practical applications in web design, I'm I'm sure many are are essential. And what tips do you have for web designers or those that are putting, you know, a website together when you're working with a web designer, when selecting and on harmonizing those colors for a website. Because, yeah, you could you might have a favorite here and a favorite here, but they just clash as as most guys when they're put you know, wearing clothes, like, don't put that Together that tie doesn't go with that shirt, you know, that sort of thing.

Yasmine [: 00:08:27

So okay. So keep in mind. So, yeah, if you are going with your favorite colors, we, As a designer, I can help work around those, but think about what your users are are expecting. So if you are a bank and so banks tend to be some green, but most of them in the blue, very navy blue kind of, look and feel. Some of them I Try to throw in a little bit of energy, but, usually, they'll stay within a particular color scheme. Usually, there there are exceptions. But think about what your target market is expecting. So if you are high end if you're talking about high end bags, in high end fashion On your podcast, you will want to evoke a different sort of feeling and look at those colors that portray that high end energy, or emotion versus if you are a podcast about fitness or or about podcasting, about marketing, you could get away with so for example, marketing, you could get away with Using orange or a vibrant color, maybe neon green, because you're you're you're targeting a specific type of of people.

Yasmine [: 00:09:29

So when selecting these colors, designers should really consider the emotional impact. Designers and the small business owners, you consider the emotional impact and you and the contrast and readability and the overall aesthetics. And by contrast and read for readability, What that means is on when you're transferring these colors to your website, is it still easy for people to go on there and See that bright pink like I used to have on a white background? Is it easy to read? Does it mess with anyone's eyes? Is it a color that could potentially fade into the background when people with a certain disability go to your site? So keep that in mind. And then really creating that harmonious Color palette is about balancing all of these elements and really creating this incredibly appealing and user friendly website. But, again, it takes testing. It takes, talking to people. It takes I had to I had I was blessed with a Client who had this disability and could tell me, hey. I actually do not see any of that teal or the greens that are on the design.

Yasmine [: 00:10:35

And so just talk to your people. Know your target market.

Brett Johnson [: 00:10:38

Yeah. I would think that would also it would also have a little bit of an application to okay. You've chosen the palette you wanna use now. This is also what we're gonna use on printed letterhead, billboard. I mean, again, without trying to make it more complicated, but You are going to take that color palette across different mediums.

Yasmine [: 00:10:57

Yeah. And you have to keep in mind, sometimes things Print darker. So if you do have this great happy green color and then you send it to print, it might look a little more dull, a little more a little darker. And then there's we can go into how to optimize for print and for digital. But just keep in mind where your colors will be used And then keep some alternative options. So when we design a logo, we will ensure that you get all The logo in all of the colors of your brand, your brand palette, but you'll also get a white one, a black one, and you can come back and say, hey. You know what? They're trying to print my logo In this really weird color, I don't know what's going to clash. And, usually, we can support with getting a shade of a different A shade of your current color palette that will work with that.

Brett Johnson [: 00:11:45

Alright. So, our next topic here, which Came to mind earlier, and it's been running in my mind the whole time is that, okay, we are driving our listeners, our potential clients, whatever might be from the podcast or whatever else you're doing to the website now. Do color choices influence user actions like clicks, conversions, and Even more important, maybe time spent on website.

Yasmine [: 00:12:09

Yes. So, I mean, there's a lot that goes into a website, but, Yeah. Color psychology really plays a pivotal role in that user experience, that behavior. And color can influence these actions from encouraging people to click on call to action buttons to really impacting conversion rates and AB testing, which means that you it's So if you don't know what AB testing is, AB testing is you can duplicate if it's on the website, you can duplicate that same web page And change, I would say, just one thing. So if we are talking about colors and buttons on that page, we would shift only the colors of the buttons and then track to see if we could increase conversion rates by just that small switch. So it requires you to have analytics installed and and things like that, but you can AB test what colors are working on your site. So AB testing really allows designers to optimize the website for the maximum performance based on your color choices. You can do AB testing with, your email campaigns.

Yasmine [: 00:13:10

So If you're on Mailchimp, I'm pretty sure they offer AB testing. You can do it on your website, anything that you can duplicate and send to an audience, And then just gain that feedback from looking at the clicks and the engagement.

Brett Johnson [: 00:13:25

Are those 2 things running simultaneously simultaneously then? So you're feeding A certain audience, let's say, a red button and your fee feeding some a green button at the same time to test it in real time?

Yasmine [: 00:13:36

e back end. So to ensure that: 5050

Yasmine [: 00:13:59

ng your color palette or do a: 5050

Brett Johnson [: 00:14:21

Okay. Gotcha. I thought it was at the same time because that's that's the best test, I would assume. But, I mean, I've also heard though, let's run this for a couple weeks and this for a couple of weeks, but I would think you'd want at the same time. So yeah. You mentioned earlier about accessibility. It's It's important to think about it. We kind of touched upon that a few times.

Brett Johnson [: 00:14:37

How can web designers create inclusive color schemes for users With that what we talked about color blindness and visual impairments.

Yasmine [: 00:14:45

Yeah. So designing for inclusivity involves considering color contrast, alternative text and using patterns or textures in addition to color. There there are some tools out there free and paid that can that are available to simulate how these designs will appear to different users, and you can toggle between the different levels of colorblind different types of color blindness. And just As even if you just do the most simplest thing and convert your browser window or your phone and look at your website in a grayscale, Does anything so you could have 2 different colors, but when it turns into grayscale, they almost blend in. And so that can tell you a lot about the accessibility issues that might Coming up. That you can take a screenshot and upload it to there's a couple of those, color there's those tools that will test for color blindness, And then you can you can visually see what they see. And and, like, it's just it opens up a whole this whole new world, right, for design. And I'm not gonna say that it's the easiest thing to design for all to include be inclusive of all because it's it's difficult.

Yasmine [: 00:15:53

So some might be what is it? Like, I think it's, red color blind. There's a blue, and I believe there's a green. So there's different levels. And if you optimize for 1, you might not be able to optimize for the other. But at least you're doing your decisions on color with intention, and you're designing your site, Your artwork with that knowledge that you're not just kind of willy nilly picking a color out of thin air. You are intentionally Making your buttons a specific color. When I mentioned color contrast, it's also, for example, black a black button with white text inside is the highest contrast. But when you start veering into different colors, so a bright pink button with a white text might be less of a contrast.

Yasmine [: 00:16:34

And if you just squint your eyes and look at your site, How easy it is is it to read the text? How easy is it to see that where that button is? That will tell you a lot about that accessibility.

Brett Johnson [: 00:16:45

Yeah. What's gonna be interesting is If one takes this episode and really starts to dissect different brands, you never will see a brand the same way again I think because all the stuff that you've learned going, oh, I know why they're doing that. I know why they're doing that, which is a good thing because I think, us understanding marketing breaks it down so we're not so, easily persuaded. Let's put it that way, kind of understand what's going on. I think it's important, on that aspect. And in and in return, you get to learn how to market yourself as a business, as a podcaster, to do the best that you can to help them through the journey. So so let let's wrap it up a little bit. Let's Synopcize what we talked about because there's a lot to this episode with color.

Yasmine [: 00:17:31

isions. Even if you say, hey,: 2024

Brett Johnson [: 00:18:31

ter job with their website in: 2024

Yasmine [: 00:18:50

Yeah. So I am offering I started offering website audits now, which the price will roll into The official website design. You can contact me on my website, RoblesDesigns.com. That's roblesdesigns.com, Or you can just download the freebie I have at roblesdesigns.com/checklist. And that can, in a very a basic level, help You really understand what's going on with your website, not just with the color, but also with accessibility and a little bit of SEO and give you that little kick start that you might need.

Brett Johnson [: 00:19:24

Audits are the I think maybe: 2024

Yasmine [: 00:19:51

Well, it's true. You can't make business or podcast. You can't make pivots with life in general. You should probably be auditing your life. I know I will be. But you can't make pivots without knowing what's happening. So kind of like my accountant Says know your numbers. Understand what's happening.

Yasmine [: 00:20:07

You also have to understand what's happening with your marketing, with your podcast insights, and and just Having this information and making these even if you say, you know what? I can't redo my website or I have to continue DIY ing my podcast, But at least you are doing it with intention, not just going in blind.

Brett Johnson [: 00:20:23

Yes. Exactly. I agree. I agree. Well, thanks for joining me again, and and and and thank you for listening to The Circle Sessions.