5 Best Button Practices for Websites
Channel: Shepherds Loft
Date: 2023-04-27

https://www.youtube.com/@Shepherdsloft Web Design With Purpose
#webdesign #calltoaction #localbusiness 

5 Best Button Practices for Websites

Five Best button practices that every website owner should use. Hello, I'm David Grubb from shepherds loft. And I want to help you design a better website. Today I want to talk about

00:15
the five best button practices that you should follow every business owner should do.

00:23
So, right quick, I'll give you the five, and then I'll explain. Number one is, is having the, the number of buttons that you have on the top of your page. Number two is going to be the label of the button. Number three is the color. And before is the shape. And number five is the link. Okay, so now we know what our five best button practices are. Let me explain each one of them to you. And then I also want to show you some before adding in some before and after examples. Okay. So number one is, is having

01:02
at least one button, but no more than two buttons on your homepage. Okay? The reason for this is you want the customers want to engage with you. But if you give them too many options, they're gonna get distracted. And then they're never going to make a decision to get engaged because they're looking for that thing to, to click on and engage. But they're not sure what to do when you have more than two options there. So it kind of it distracts them and it prevents them from having clarity on what to do.

01:39
So number two is the label of the button, you want the you want the button to say exactly what it's going to do. You want to avoid things like learn here, get more get started. You want to avoid things like that because the button itself is unclear. So just imagine if you had a button on a page by itself. And it said to learn more. Well, what are you going to learn more about? So it doesn't really make sense. And behind the scenes, there's also, you know, accessibility issues. So the button says learn more. Again, it doesn't define what it's going to do. But there are also SEO consequences. If it just says learn more, well, that's not search engine friendly, either. So if you were searching for something specific,

02:29
if you're trying to rank your page for something specific, then that button is not going to help you.

02:36
So that's why it's really important to label things exactly what they are. So you set those expectations, right. It's kind of like, you know, when your friends play tricks on you, and they say, Oh, check out this great kitten video, you know, and then they give you a link to the famous, you know, the Rick rolls, you know, you're watching YouTube, you're watching the music video, so you've been tricked. And so you don't want to do that to your customers, you don't want to trick them, you want to label the buttons, and link them to the thing exactly as, as it says is going to be linked to the third part is going to be your color of the button.

03:18
So there's been a lot of research on this, I'm not, I don't know the stats, but I'm telling you that warm colors do best. A lot of people think that green is the color of money, or, you know, you know, or other colors have psychological meanings. And we should use one of those colors. But most often times a warm color button, red, yellow, or orange, those kinds of those colored buttons are, they're more attractive, and people are more likely to click on a button of that color. So you want to stick, with what works there. To increase that click-through rate. The fourth item is the shape of the button. And I have had a customer before to email me and say hey, you know, it doesn't even look like a button. So when you just put a square box on the page, and it's just kind of floating in there, or maybe the layout and design is very box oriented. And then your button is square as well. Sometimes it's just not really clear that that's actually a button to click on. So you can do things like rounded corners and add shadows, you know, and even change the text color that's on the button. So you have the background color, the text color, and rounded corner shadows, there are lots of different things that you can do to make it look like a button. And that just entices the users that oh, that's the thing that I want. And I know it's a button I'm going to click on it. The Fifth Element here.

04:55
Best practice is to link the button to the appropriate page.

web design, website buttons, buttons, local business, websites, website design