What makes a homepage actually work?
In this episode, we break down the strategy, structure, and surprising mistakes we still see on client sites—and what separates a generic homepage from one that sells.
Episode Timestamps
00:00 Welcome to Web Design Empire
00:18 Meet the Hosts: John and Kelly
00:50 Motor Goat: The Cool E-Bike
02:23 Ninja Warrior Competitions
03:50 Today’s Episode: No Place Like Homepage
04:23 Homepage Strategy: Start with a Plan
05:51 Navigation: Keep It Simple
10:19 Hero Section: Clear and Concise
12:37 Service Blurbs: Define Your Offerings
13:27 Avoiding Franken Sites
17:19 Social Proof and Testimonials
19:44 Opt-Ins and Email Grabs
21:23 Image Breaks and Graphic Elements
23:01 Footer: The Junk Drawer
24:03 Footer Design Best Practices
24:35 Importance of Contact Information
25:48 Social Media Links Placement
28:01 SEO vs. Design on Homepages
30:09 Common Web Design Mistakes
30:20 Sponsor Break: Break into Web
31:25 Outdated Web Design Elements
40:38 Final Thoughts on Web Design
Full Transcript
[00:00:00] What’s up y’all? Welcome to the Web Design Empire, where we share stories and strategies to help you build your web design empire from a side gig to multiple six figs. I’m John. I’m joined by Kelly. We’re full-time freelance web designers who’ve escaped the real world, broke up with our jobs, our old bosses, those ugly cubicles and our long commutes over 15 years ago, and we haven’t looked back.
We’re also course creators. We web design store owners, Kelly owns Airbnbs. I’m a touring, professional musician, all that to say we are building our empires. Are we not? Kelly? How are you? Doing Well, how are you? I’m doing well. I have a, a cool little motorcycle looking e-bike arriving tomorrow, so I’m excited about it.
Oh, tell me more. The motor goat? Yes. The motor goat. Yeah. Check it out y’all. The [00:01:00] motor goat , it can go up to 45 miles an hour. That is on the bike path, which unsafe. It is illegal, so I’ll have to, I’ll have to watch it, you know. What is the limit? Is there a limit on the bike path? It’s 25 miles an hour.
That’s cool, but who’s enforcing that? Like, you know who’s out there? I don’t know, but no, to me that makes sense in my head because, I witnessed a human being run 25 miles per on the treadmill. So I’m like, if someone could run that fast, then I suppose you can bike that fast. So that makes sense. You might, that must be where they got that, what they were like going 27.
You gotta tell that runner to slow down. Yes, slow down, dude. That’s too fast. And you know, there was a debate on that, like, should it be 20 miles an hour? Well, I don’t know. My cousin runs pretty fast. Mm-hmm. Maybe, well, about 30. Nobody can run 30 miles. Nobody. They landed on 25, you know, so’s funny.
It’s like school zone the whole way I guess, or So do you have to like, put a governor on it or, or do you just keep an eye on that thing? Well, I think there’s supposed to be a governor on it, but I. [00:02:00] You know, there’s not That’s awesome. So anyway, and, and there’s no, you don’t have to license it. You don’t have to insure it.
Right. Right. You can park, you can park wherever you want. Um, nice. You know, you have to worry about it getting stolen. That’s kind of a thing. Like, true, you can put a lock on it so it doesn’t roll anywhere, but people could just, it weighs a hundred pounds. People could just lift it and take it, you know?
But anyway, it would be awkward. Yeah. How was your week? We had like, not much this weekend. We had a, we had round two of, uh, ninja Warrior competitions for youngest, and it went much better, but we were afraid she broke her thumb. So we had x-rays yesterday. That was fun. Um, she did not, thank goodness.
Funny, funny that you say your daughter’s thumb. My, my thumb started hurting yesterday and I, I think it’s getting better, but, but of course my brain Are you doing Spider-Man crawls up a wall like her? No, probably no. I was just living regular. Life happens when you get old. You just live regular life are, you’re just sleeping and, and things go, things go wrong.
Of course. I’m like, that’s, I wonder if this is what carpal tunnel feels like, you know? My last [00:03:00] two injuries that have happened , I just woke up with a, with a neck cramp that lasted for six months. It’s just sleeping. Just sleeping. That’s how hard living is in your forties anyway.
How does someone’s kid get into Ninja Warrior? Is this like a, does someone pitch them? You find a place that says , Hey. Yeah, it’s like a gymnastics studio or a dance place. Like they, they’re everywhere.
We have two in Longmont, so there’s probably and nine ninja Warrior called Lincoln. Yeah. I don’t know why it’s called Ninja Warrior, , that just puts the wrong picture in your head. It’s just an obstacle course, you know, like you see on the TV show.
Got it. Where they fall in the water, not the crazy one, but like the actually talented skilled one. I guarantee there’s several places in Lincoln that do it. Sometimes they’re tied to a rock climbing gym or a gymnastics place. But yeah, there’s lots of ninjas out there doing nothing. ninja-y . Well, today’s episode is titled. Very clever by Kelly. It’s titled, there’s no place like Homepage, there’s no place like [00:04:00] homepage, there’s no place like homepage.
Trademark, also ideal homepage elements and how it’s evolved over the years because it has, right? It definitely has a little bit evolved over the years. So how do you wanna do, should we start with what should be on there now? Start at the top now. Okay. Start, start with what should be on there. Now let’s start, let’s start at the top.
Let’s start at the nav, right? Mm-hmm. Actually, I think we have to start before at the top, we have to start with strategy. And there is something to be said for you cannot dive into a homepage design without knowing what the strategy is. What is the goal? What is the thing, the main thing you want the user to do?
Mm-hmm. And then perhaps a secondary goal as well. If they’re not ready for that main goal. I like to call that an off ramp. But anyway, I think strategy is number one. I hope you agree. Yes. And , I have a funny story about that. We had a client once, oh gosh, come to us and, they were interested in a website and they were talking to this other company in Omaha.
And so , we [00:05:00] start gathering, oh, a quote for them, and then they get back to us and they’re like, Hey, the company in Omaha already sent us what our homepage would look like. And I asked them, well, did you. Did you meet with him and talk strategy and, no, they just sent over what, they thought it should be.
And it’s like, no, you wanna have some say. I mean, sure. As designers, we are the professionals and we can say, hey roofer, you probably want more of this. But it’s still good to talk to them and find out, what they wanna push on the site, what they wanna highlight about their business.
Yeah. Yeah. A little bit. Well, and again, knowing what that main call to action is like, is it to pick up the phone? Is it to fill out a form? Is it to get on the e list? Is it to buy a product online right now? Not knowing what that main goal is. Or having that change changes the entire direction of the homepage in my opinion.
So yeah, very important. Number one, strategy. Start with strategy. I agree. Start with strategy. All right, next comes the menu. People keep trying to f with menus. Mm-hmm. And they do. Here’s a story I have really recently. A [00:06:00] client , and this was a,, this is a physician clinic practice, a big one.
And they’re like, we were thinking instead of having, home about services contact, we would use our five core competency or like, whatever their strategy acronym was. Oh yeah. It was like compassion, integrity. I don’t remember the other ones were, but they wanted to use that as the nav and then have the things I was like, absolutely not.
That is not going to happen. You need the most boring menu ever as a physician. Like you can’t screw with that stuff. It’s gotta be clear, straightforward. You do not want people wondering where your content lives that they’re looking for, or they will not move forward. Yeah, that’s correct. I have a whole, car analogy about headers, because, like, let’s hear it.
I, I get it. As designers, and I see this with young designers a lot, is that they’ll be vibing along, churning out websites, and then all of a sudden they’ll be like, I wanna mix things up on this next one. [00:07:00] And I don’t know, let’s just put the logo wherever else on the right, in the wherever and let’s, and it’s like, Hey, why are you doing that?
Are you doing that because you’re bored or. Because it’s best for the , not for the client, but for the client’s audience either, right? Yeah. And so my car analogy for this is , let’s say I land in Miami , at two o’clock and I want to get in my rental car and I want to get to the beach by three 30. So I can still have an hour, hour and a half to enjoy the beach. So I land, I grab my bags, I head to the rental car counter and they send me to the garage, right?
And they’re like, Hey. Here’s this, Honda Accord that everybody knows how to drive or we can upgrade you for free to this new fangled car. It’s different than any car that’s ever out there. And it’s an upgrade. I’m like, cool. I’ll try the upgrade I get in the car and let’s say the ignition isn’t , on the right, it’s on the left.
And the brake and gas pedal are switched around. And, I don’t even know where the turn signals are. And I’m like, you know what? I’m in a hurry. Just gimme the Honda Accord. And that’s [00:08:00] just, gimme the Honda. That’s what people visiting these websites want. They want it easy to use navigation.
They don’t have to guess how to work your newfangled, fancy, no animation. Don’t call your menu item compassion. , Don’t do that. No, like you, that means nothing. We’re big. We’re big. Except to you. Except to you and you’re not the audience. I. No, clients, you are not the audience, you know? We’re big fans of StoryBrand and so when you talk about putting compassion and whatever that, whatever, integrity, integrity, integrity.
Let me click on integrity. See where that takes me. No, no. Give me the contact information please, and thank you. Yeah. If you have to say you have integrity. I dunno. Maybe you should just, no, it was just, I just thought , that was a perfect story. ’cause I haven’t had a client bring that up in a long time.
Like, I wanna get, I wanna get wild and clever with these, with the No, you don’t. Ooh. No, you don’t. You said it, you wanna be boring on the menu. Clever. So we’re [00:09:00] big StoryBrand fans at Artillery use StoryBrand. And so a lot of my, what’s gonna be on a homepage is coming from StoryBrand, but one quote from StoryBrand, when you’re talking about the navigation especially, and the homepage overall, cute and clever are the enemy of clarity.
Ooh, that’s good. That’s so don’t put compassion, integrity, or instead of about us, let’s put, I don’t know, in 1985. The other quote is, you confuse, you lose, you confuse, yeah. You lose again. They want to get in the Honda Accord and they wanna get to the beach.
These folks, they don’t have 20 minutes to peruse your website. Okay. This ain’t h and m for men, you know, they’re usually in a hurry. I mean, go look at your average time on site, your average time on site’s probably gonna be under five minutes,
yeah. Anyway. Oh, for sure. And I think especially as Divi designers, I think that’s one of the complaints is that, oh, you can tell it’s a Divi site by the header, and it’s like, well, you know what? It works, it works great. Me logo on the left, menu on the right. Right. Justified, like, come on.
There’s a [00:10:00] reason it works. Yeah. Yeah. And with us, you, with us, especially with the StoryBrand, framework, the last menu items, the button, right. It’s your call action button. Yep. That was next on my list. The call to action button on the far right, and that’s, that should align with whatever that main goal is.
Revert back to strategy. One thing to think about when we’re talking about, there’s that call to action, the menu, because the next section, I have is the hero, right?
Your hero of course. And there I put simple and clean. Mm-hmm. A clear call to action, right? Usually you got a little something, a little, a little something like a title 3, 4, 5 word title, and then you got a optional little subtitle and then you got your call to action.
You might have a background video there or a solid photo, or you might have a little marketing video up there, but that call to action usually, usually mirrors the one in the navigation. That’s usually not for sure. Something else I. Correct. I like it. Along those lines with this hero section, the first section, my things [00:11:00] here are, for that title and subtitle again, we’re not being cute or clever here.
I know StoryBrand has a perfect analogy for that, that I can’t remember. Something about a painter. But, you want to say as concisely as possible what you do and why you are different slash better up in that header. I have a perfect example of a crappy headline.
This is on one of my client’s site. This is the title they had to have was, we are Here to Help You Be the Expert. Any guesses what they do, that’s tough. You’ll never guess. So, so yeah, you wanna have, what you actually do , in that title. And then the subtitle, I think is about, pointing out why you’re different slash better.
You want that information to be as clear and concise as possible, as close to the top as possible. And then again, whatever background’s going on, whether it’s a image , or a video, it should just help visually tell the same story as [00:12:00] that title and subtitle. It should, , reinforce as opposed to have nothing to do with what’s on that title. So don’t go pick. Some random, I mean, I know we’ve all had clients that I wanna use this photo. Well, this has nothing to do with, you know, like flowers in the background of, a plumber website or something.
It’s like, no, no, no, no. Or some, or some photo they took on their iPhone and it’s just like, oh man, there’s oh, oh, I have that on my list of Don’t you dare. Is, yeah, just crappy photos. Either too stocky or like just low quality. Yeah. We’ll, we’ll get there. We’ll get, we’ll get there. Okay. We covered hero. What comes after that? Well, usually, it’s the what you do section and usually it’s either a three column grid or,, if you do provide multiple things, , it’s the first chance to funnel them to different parts of the website.
I have that same thing. I have product slash service blurbs, , literally, , it’s usually what I use is the blurb module there. Mm-hmm. , But, , whether,,, you’re selling products or services, that’s where you [00:13:00] define what those different categories are , and then funnel them appropriately.
I think the other thing important , is, like having , a hierarchy of titles like the , every section should be clearly labeled, , for lots of reasons. , SEO being one, but also just clarity for the user being another. And Scanability story.
Yes. Scanability. And I think the other thing I wanna point out sooner than later, because I’m sure you’ve had this happen as well, is. Gosh, , I’ve had these sites that turn into what I call Franken sites, where, ,, it started as,, a startup and, , we had their five page site and it’s great.
And then they start adding stuff and they’re like, oh, we need to put this somewhere. Oh, we need to put this somewhere. Oh, we need to put, and we just start squeezing things in the nav or on the homepage. And it just turned into this, this Franken site. , But the reason I, I point that out is , I’ve had this happen so many times where clients, they want so many different things to stand out mm-hmm.
On the homepage, that it just becomes this [00:14:00] like, okay, I have a website right now, , that has seven calls to action above , the fold. It has five, five CTA buttons. Oh. Against my will. I argued this. So hard. , And I lost five buttons in the nav and then two more buttons, , on the hero.
, And I’m just, I can’t even, I can’t even handle going to this homepage. But anyway,, if you’re trying to give the user seven different things to do, right when they get to the site, guess what they’re gonna do? They’re gonna bounce, they’re gonna leave, they’re gonna bounce, they’re gonna be confused.
They gotta point, they’re be confused. Point, point. Anyway. So don’t try to make everything stand out. Agreed. One thing, maybe two. That’s it I totally agree. , There’s this nonprofit. I do all their websites and , they have a lot going on, but the owner will want to. Shove different stripes on the page and it’s like, here’s my new book. Here’s a recap video , from , the yearly seminar thing.
Here’s another new thing that we are doing, and then here’s our three programs [00:15:00] that we offer folks. Right? And it’s just like, holy cow, what do you, what do you want? Nailed that people to do here. Yes. Getting yelled at, what is the number one goal I’m getting yelled at? I’m getting yelled at. Why let’s this see this, watch this. I’m For real. Come on. Okay, so you got your header, easy use navigation system, clear call to action. You got your hero with a call to action that’s supporting that one from the nav.
Then you got your, what you do section, right? Or what’d you call it? The services slash. , Product slash service blurs area. Yeah. What’s after, what’s what now? It doesn’t have to be exactly the sort or from here on out. True, true. But , what do you have after that? , I think now it does become a little bit , of a choose your own adventure as far as the order.
But here are some things that I like to include. , Well, first of all , with the service blurbs, depending on how much detail you’re going into there, you wanna make sure you’re focusing on, like, this is another StoryBrand thing , on the benefits instead of the [00:16:00] features, , there’s a big difference between those two things , for users.
So you wanna focus on benefits, like, right, you know, saving time, , increasing sales, reducing stress as opposed to, , features like, . , They call it the stakes. That section is called the stakes. Yes. There you go. What you’re going to solve. , And usually from their point of view, you know? Yeah. Like, , are you tired of having a slow website or are you, whatever it is, you know? Right. Or, or in our case, , we kind of future cast , on our website, artillery, , strategic design.
Your new website will be beautiful. , Like we’re trying to get them to be in that place , where this process is over , and they have this new website that can, we’re trying to put them in that space. But yeah. The stakes. Yep. Love it. The stakes. Yep. That’s a , good section.
If it makes sense for the business. . I like to have usually towards the bottom. And , I think this is completely optional, but especially like working with small, Midwest type companies. , There’s a local vibe, a local jam to other local [00:17:00] business owners. And so having some sort of tiny about Blurb, I’m gonna use Blurb a lot.
Mm-hmm. , On the homepage with a link to more just like a quick little intro of who’s behind the business. People like to see faces, they like to hear stories. I think that’s something good to have. I usually put that towards the bottom of the homepage, but that is something I like to have on homepage.
, Other important things I think are like social proof. So whether it’s some kind of testimonial or some kind of familiar set of logos, something that just legitimizes and proves that you don’t suck, you know, so normally, usually after the stake section, normally, , that’s when your solutions come in.
, And that can either be, you know, in our world, in the web design world, that’s usually , here’s some highlighted portfolio pieces, right? Mm-hmm. Or something like that. And then, , yeah, but if you’re not, but if you’re not showing off like designy portfolio stuff, that’s where you could spell out your solution a little more.
I guess you could have a section that, that talks a little more about , your solutions a little [00:18:00] beyond those three, , the three blurbs up top where they can quickly go to that. So it’s a, it’s kind of a secondary option to sell them on what you do. And most of us use a portfolio to do that. And Yep, we only, on ours, we only show four.
Like I just tell folks, Hey, lead with your best three to five. Don’t throw, don’t throw 12 portfolio pieces on your homepage. Don’t do it. No. They put your best three on there, you know, , or whatever works for the design grid that you’re using, right. , Odd numbers are nice. I, I prefer odd numbers. Oh, yeah.
Odd numbers are nice. Yep, yep, yep, yep. , Social proof. Yep. I had that written down as well. Oh, man. And , I think the opposite of, , like the social proof and again, testimonials are like a nice set of logos that, , support what you do , and like what type of clients you work with.
I think the opposite of that is those giant like security badges or just the big logos from like the local chamber of commerce or whatever, like stuff that people don’t really care about and they’re always way too big. , I [00:19:00] don’t think that kind of stuff really actually belongs on the homepage.
Certainly not on the footer. Best website design company of 2022 by expertise.com. Yeah. We all know who paid for, like maybe put those on the about page, but, but, , they don’t belong on the Yeah. , It’s so gimmicky and just they’re always agreed. Like, it makes me question it now, like, were you Yeah.
Yeah. I mean, who, or did you just pay $50 for that? You know, you probably paid $50 for it. Yep. You know, probably, , here’s one that everyone says, well, not everyone, A lot of people say, you need to have this on your homepage. And we did for a while, and we took it off because it was just not happening. , And I could see an argument for it, , the guide.
A PDF email grab. Oh. Or some, or some kind of the opt-in. Yeah, let’s call it the opt-in. ’cause because, ’cause the guide, the way we use the guide is with blog posts. We show three blog posts and that kind of sets us up as experts. Like, Hey, we also blog [00:20:00] about this. Great. But so that’s, that’s, sorry, that’s one, you know, uh, the blog post.
Like a resources, yeah. Yeah, resources. But as far as the email opt-in, we had this email opt-in on our website for a long time called The Seven Steps to an Effective Landing Page. And I swear fewer than 10 people ever put their name and email in it depends on what your goal is. Your goal, obviously on the artillery site is to get them to fill out , that form the help form, inquiry form.
And so if that’s your main goal, then there’s no reason to delay that. And it’s a small, it’s a small ask to just fill out the form. So why make them fill, you know, grab this other thing when really you can just get to the guts of it. , So yeah, I mean, it, it depends on the business and depends on what you’re selling and how you’re selling it and whatever.
I mean, there’s a lot of factors there, but I think it does make sense for some people. I feel like it was all the rage while ago. It was all the rage a while ago. It was, and it’s kind of been played out and, , you don’t see it as much anymore. , But yeah, I’m sure it’s highly effective for some people.
Yeah. Mm-hmm. [00:21:00] I don’t want one. Mm-hmm. I do have some clients, actually, literally last night I added one to a homepage for a client. ’cause , he made this hand handout that he just had to have for people , to get their emails. So people still try. We’ll see if it’s effective for him. , I have a few more for what should be on there now.
, Like, these days, like, not how it used to be. Yes. But, , yes, I put on here image breaks. So, , on our site I like to sometimes give a visual break Oh. In between sections. Usually it’s a parallax image of , some sort. , On our site it’s pictures of our team or our, we have a beautiful office space.
So , it’s just, we really do, , it’s just showing them like, Hey, we’re professionals. , We’re good at this. Here’s our dope office space. Like, it, it’s kind of, kind of that vibe. , And , it shows some photos of, . Our team members interacting together , and really pushing this team vibe.
So , that’s something that I have written down that I use a little bit as image breaks, especially if it’s like, man, we got [00:22:00] two or three sections with a lot of content on them. Let’s give their eyes a break here a second. And then, yeah, no, I like how you call it an image break because it’s literally just, yeah, it’s a break from all the content just to have a visual, pleasant, pleasant experience, like, oh, thank you.
Oh, man. Okay. Okay. Take a break. Eyeballs. Yep. , And then the one that kind of goes along with that image break is a graphic elements that nod to your brand. So, , on ours at the bottom we have this where story meets design graphic. That’s just kind of another image break. , It’s actually kind of hard to read , and you, but it’s fine.
I’m fine with it because it’s like, yeah. It’s just a , cool. , A brand section, I guess. Like a, like a brand. Reinforcer or something just like, ah, cool. And our merchandise has the same thing on it. And so folks will see that same slogan , on our merchandise too. Not an, it’s not like a must have, but it’s just something that , I don’t mind it.
, I don’t mind having it on there. [00:23:00] Yeah. , What about the footer? I feel like we should talk about the footer a little bit. The classic footer. , The, well, what is the classic footer anymore? You, you call it, what do you call it? A, I know a story brand called, I didn’t know I how to name for it.
Okay. Story Brandand calls it the junk drawer. And Oh, I like that. That’s what it is. Now, our, our foot are super simple at artillery. It’s pretty much, I’m a fan of super simple. Right before our footer, we have that little local thing you talked about. It says proudly made in the Midwest. Right. You know, Midwest values we’re proudly rooted in the heart of the mid, you know?
Okay. , That feels good. That feels nice. But , our footer is literally two social links. The little copyright and then a big fat hire artillery button. Right? , Another call to action. That’s where it should be, right at the bottom, top bottom should be the same one. I guess I bring that up just because, man, I still see a lot of big ass footers, if you know what I’m talking about.
That has the entire site map down there. And again, it’s. [00:24:00] Uh, to me that’s just like such overwhelm. , You’re giving them too many things to do and, but, but I can kind of see both sides of that. , But I still think if you’re putting links in the footer, , it’s just the main ones, , those quick links, , or just the main links that people are gonna be looking for.
, Maybe some contact info. That’s a good place for the social stuff. You don’t wanna put the social stuff at the very top. I do have some clients who try to get, , social icons at the top and it’s like, we don’t wanna send them away first thing. Nope. Let’s keep them here. Agreed. , So yeah, those are my feelings on the footer.
Keep it simple. But I also, , think. And again, this is kind of controversial, especially , for us, ’cause I don’t really practice what I preach here, but some, , for the homepage, , some sort of contact information. , I don’t even have my phone number on my website , and I’ve been to websites before where I am like cursing the website because I can’t find the phone number.
And, and I, I do that too. However, I do have a button to book a call with me. I just get so many like scam calls, , [00:25:00] from that phone number. So , I’m doing everything I can , to limit those. So that’s my excuse. , But you need to have some sort of clear contact information. Like if people do wanna reach out to you, how do they do that?
And make that very clear and make it easy for them to do. And I like putting that kind of stuff in the footer too. Agreed. , And a lot of times in client sites, , you got , the address there, you got your, and I always do a little button that says direction, that’s a Google map link. So if they click it, I imagine someone’s trying to like in their car and they’re driving and they’re like, where’s the sat?
So I make it nice and big so they can easily click that thing with their fat dom or finger or whatever they’re going. Yeah, totally. Yeah. If they have a, if they have a physical location, yeah. That address , that customers go to, that address should definitely be on the homepage, if not the footer. I’m with you on social media links.
Like we actually post to Instagram and Jake does these videos where he does site reviews on their new launches. So I’m actually fine with it. , And he posts those on Facebook as [00:26:00] well. But you go to apple.com, you know what, you’re not gonna see anywhere. You’re not gonna see a social media link anywhere.
None. You know why? Because they know. That if you want to find him on Facebook, you can go to Facebook and type in Apple. , So I’m with you. I’m with you , on the social media, especially not being at the top. Yeah. Because yeah, I click that and then I’m, let’s say I click it and I go to K Design, that’s Kelly’s company.
I go to K Design Webs Facebook page, and I’m checking you out on your Facebook page, which is not gonna be as well designed as your website. Right. It’s not gonna visually look any better at all. And then all of a sudden I see a notification that my friend’s birthday’s today. So now I’m going and telling my friend Happy birthday.
And I’m off here. I’m off. Yep. And you instantly forgot why you went there. It’s like going to the pantry this morning. I’m like, why did I come in here? I still don’t remember. I’m gone. You get distracted. I’m gone. , I still recommend for us web designers, I still like putting in, , designed by or website by, [00:27:00] yeah.
Not as big as it used to be. Unless the client’s like, does it have to be there? And like, oh, if they, if they bring it up, fine, I’ll take it off. , No problem. Or , if a client has like, , bastardized a site after you’ve launched it.
I know. Then you just that right back out. Nope. Nope. You added big ugly purple font right on the homepage. I’m, I’m out. Yeah. Oh, I think that’s a, I think that’s a great collection of . Elements that probably should be , on your homepage, how do you feel you got any more for what should be?
, My other things that I have here , that are Do’s are like, yes, mobile optimized if, , obviously, I mean it goes without saying anymore, but even mobile first, , especially for that homepage, you wanna make sure, ’cause over half the traffic, I mean, again, do your research on the client , and see what kind of traffic is coming from, , mobile versus desktop.
But chances are over half is from mobile. And so you just wanna make sure that impression on mobile looks as good as it does, if not better than, , desktop. [00:28:00] Yeah, . And then , the other thing I was gonna say was, , I feel like there’s this constant, it’s like a cat and mouse thing with SEO and I.
SEO people versus web designers and SEO people want to use , , big paragraphs, lots of content, , ridiculous titles that the client never wants, right? , And I just feel, especially, I think there’s a time and place for SEO don’t get me wrong, but on a homepage, , especially like design and copywriting win and an SEO becomes at least a little secondary on the homepage.
, That’s how I feel , , you’ve been to the websites where it’s like, oh, this is beautiful, this is lovely, and then all of a sudden there’s three pair long paragraphs in a row that, you know,, are just there for search engines and , it kind of ruins it too much work. So , keep it simple and clean on that homepage and save the SEO for other spots, in my opinion.
Agreed. I tell clients, Hey, we’re gonna try to wow people on the homepage, get them [00:29:00] interested, , and then. They click on a link and it goes to an interior page. Now it’s more business. Now it’s more Yeah. . More wordy and texty because they’ve asked, they’ve asked,, they’ve asked for it.
,, when they click , on a whatever, and it goes interior page, now we can. Now , we don’t have to zazzle ’em anymore. You know, sham. Wow. ’em anymore. , , They’re already bought in at that point. They’ve already, , which kind of nods to you or like, Hey, don’t put everything on the, don’t put three paragraphs on the homepage.
They haven’t asked for that yet. Don’t do it. Put like three sentences on there and then if they’re like, boom, , then it goes in. So yeah, that’s what I totally we’re gonna wow ’em on the homepage and then be on that. Make it easy for them to find the content they want. Yeah. And that’s kind of why usually , when we send over mockups for a web, for a website, we usually only do the mockup for the homepage.
We’re not mocking up every page. ’cause like, not every page needs that much attention. I mean, look at your analytics, , your top page usually is going to be the homepage by a long shot. , So now if there’s another [00:30:00] page that folks are like your contact page, well sure. Like give some, give that page a little bit of love.
But anyway, yeah, I agree with you on that. Yeah. Awesome. Let’s get into what not to do or , what has things that, if your homepage has this, it’s time for redesign. How about that? Before we do that, we gotta cover our sponsor. Oh, break into web. Oh, okay. Break into web.com. Start or scale a self-employed web design, business, and lifestyle you love.
Time has never been better. Don’t wait until next year, next month, or even Monday. Stop waiting and start taking action and break into web like Leah did. Leah is loving the freelance lifestyle. She says, I used to wake up at 4:45 AM and commute an hour each way to a job I hated. Now I’m working as a web designer full-time.
Still feels surreal. This is my new life. Because of break into web, I now have an amazing career. My lifestyle has greatly improved. I really love my life. [00:31:00] Oh, that feels good. It feels good to read that adorable Break into web.com. She’s still doing it. She’s, uh, she is, she’s still doing it. She’s, she’s, I’m wearing my, I’m wearing my Nashville shirt, which is near, near Leah.
I actually bought this from a store she recommended. So, yeah. Hi Leah. Yeah, she’s doing great. She, we, we can’t afford her for subcontract work now, so, okay. So how it good thing, how it used to be or things that if you still have it might be, it might be time, its time, time for reason what you got, what you got.
This will be fun. Okay. Number one. Number one is, , content sliders. Y’all, they’re done. They’re over. Same. They’re done. I mean, the first thing people do on their phone, think about it. They’re going this way. No one’s sitting there going, going this way. I mean, they’re on a different app if they’re doing that., It also comes down to , those were big for the people who are like, oh, we also need to tell ’em about this. Oh, we also need tell ’em about, no, you can’t have five main headlines, five main goals. Pick one. Maybe an off [00:32:00] ramp for number two, but have that main guts right there.
What do you really want people to know? Tell ’em that and then that’s it. Yeah, I, I agree 10000% with you. , Research shows that 98% of folks never see past slide one. I. . Or again, folks will be like, well, , what about a testimonial slider?
What if I, you know, three testimonials and it slides over and there’s three more and there’s three. My, my argument would be, Hey, if it’s on your homepage, just show your best three. Or I want to, I wanna carousel blog posts that are sliding because who, because the person can’t figure out how to hit the view all button and go browse them that way.
It’s like, no, , just show the best three. , Just do that. You’re right. And sliders slow homepage, they suck on mobile. Right. Not great. Yep. So anyway, sliders was my number one. Oh, boom. Hey, we aligned. Yay us. All right, well, let’s keep going. Let’s see if we, I don’t think we’ll hit any of the other ones, but let’s see. , Another one I put on, and I kind of touched on this a few times, but this is [00:33:00] different, is, oh gosh, okay.
Like one popup acceptable. Oh, that’s multiple popup. That’s second one too. Is it? Right? Yes. But like multiple popup or , there’s a popup and then there’s like an announcement bar, and then there’s like a slide in. It’s like, oh my gosh, this is, I can’t stop clicking X’s. , It’s just too much. Again, it, I mean, if, if you’re comparing calls to action, to bowling balls, each one of those is like.
Is like a suburban It is. It is. Which is so obnoxious. It’s a suburban, it’s and you’re overtaking the user’s view screen. Yes. I mean, so I, I don’t even know. I, I could be like, Hey, why Instead of having that popup, why not just have that be a section? If it’s that important, yes. Agreed. Then then make it your third section or fourth or something like mm-hmm.
Yeah. I put popups. Then my second one, and then I, I put especially the ones that are like, the only way to get out of it is you have to put like, no, I don’t like saving money. Or, or Right. Like, let’s just get, you have to insult them to get to go on, [00:34:00] like, that’s not worth it so bad. So bad. It’s like I just, I just landed on your website and you’re gonna shove this popup at me.
I don’t even know if I’m a first time visitor. I don’t even know what’s up yet. Like, and you’re just am in the right place yet, and you’re, and you’re just, here’s wheel to spin and my insult to, to accept. Thank you. Oh, totally, totally, totally.
Excellent. Okay. This is fun. Let’s keep going. There is no, I just, there’s no chance that we have any more of these. . And , this is really, I can’t, no, what’s your next one? I’m not, there’s no way I’m hitting it. , My next one was too much pressure. I can’t take it. Okay, fine. My next one was , sidebar.
Oh, I like that. I like that one. , I love that one because if you still have a sidebar on your website, if you still a sidebar, if you have the dual sidebar, you’re definitely like, and what’s that sidebar full of? I’ll tell you. Uh, post categories, blog archives, recent blog posts, hot links, [00:35:00] meta meta info, a search thing, a blogger icon.
Anyway, yeah. , That was, I mean, obviously that’s. We’re talking a, , that’s old decade ago’s, like we’re talking. I know, but there are plenty of sites , that still have some sort of sidebar going on. I, gosh, I just got a redesign not too long ago that they still had a sidebar on every single page.
I’m like, wow. Well, I just told you my Pilates, the place I go to Pilates, , they have the double sidebar , and oh gosh, , it looks 20 years old. It really does. Time for a trade. Time for a trade, John. It’s definitely a, we are talking about it. We are talking about it. Excellent. , That’s funny.
Okay, here’s one is, , and this, I don’t see this very often anymore. But like autoplay videos or like audio. , My, my best friend used to have this on her, , on her wedding website where it was just, you would go to it and it was like, bam, this wedding song, which is this like sappy wedding song would hit you.
And it’s like, oh my God, how do I turn this off? I’m in public. This is embarrassing. [00:36:00] Like un unwilling audio. , Or again, autoplaying videos, same thing. , You don’t want people to get embarrassed looking at your website. So clo close in public. I, I close. Oh. I mean, no, no one has us anymore, but this was just a bygone era thing That’s so glad.
We’re beyond, but , it’s a distant relative of the auto playing. Music or video? I put flash intros with music. Oh, yeah. Remember that? Like, you, you go to a webpage and first you had to watch a ten second thing. Yep. Uhhuh. And then you’re like, I just want to, I just, I just wanna see where you’re playing at band.
I already liked, I remember, I remember being so devastated that I just, I could not get the knack of flash and Oh, thank God I didn’t waste any more time on that. Oh, I did. I I went down the route. I bet you did. I bet you were really good at it. Oh, it was a thing. Uh, but it had it stay. Yeah. Agreed. So, yeah.
Yeah. Don’t, Ooh, I’m willing on, well, I’m adding a new one here because of that. Oh, okay. All right. , Overtaking the user’s, , [00:37:00] mouse with some horizontal situation. I hate that. You know what I’m talking about. You’re scroll down a little. Okay. First I thought you were talking about first I thought you were talking about like the dot follow the mouse around, but now I know what you’re talking about.
Well, that’s, which is like when you’re going from vertical scroll to horizontal scroll. Yeah. And then all of a sudden, , and then you’re like, and then you can’t, you can’t scroll fast enough to get and then know get past. Yes. That, that, that section that’s annoying doing, that’s another doing, that’s another good stop doing it.
That fits with your like car analogy. Like, it’s not supposed to work this way. I don’t like it. How do I get out of it? . Yeah. , I don’t see that ever becoming mainstream ’cause, but I mean, it’s cool, but No, but I agree with you. The little, the little translucent ball following your mouth.
Like, Hey, let’s, you know what, let’s make something hard to read by having a ball zip around the page while you’re trying to. Uh, yeah, agreed. Don’t do it. Don’t do it. You know what that is? That’s the case. That and that other thing, , where you, the horizontal scroll users overtaking that is designers getting bored.
It’s what it is. It’s designers getting bored. And usually where you see [00:38:00] that is on like agency websites. Yeah. Or , designy creative websites, which honestly, like, I get it, that’s somewhat acceptable. You wanna show what you can do flexing. They’re flexing a little bit fine, but , that should not be on a standard, , user website looking for the contact information to call their doctor.
Like, no. Or the plumber like agreed. Like no, no, no, no, no, no. Horizontal scrolling there. Okay. What else? , I already talked about crappy photos. , Just things that are way too stocky and, you know what I mean? Oh, yeah. And, , and low quality. , Don’t be sending me your, actually, I mean, it’s hard to, it’s hard to blame iPhone anymore.
’cause , the photos are, it can take great photos. It can, but, uh, don’t send me crappy photos. But the But the person taking the photos isn’t framing the photo. Right. Right. Or they take it outta angle. They don’t know what lighting is. Yeah. We had someone send us a, a background video from their iPhone.
It’s like, no, this is not, in fact, talking about use professionals , about trading services with this , Pilates studio is, I just told them, , I said, well, [00:39:00] first off, , we gotta get the strategic stuff written out and all that great stuff, but man, where you need to spend money is you need to hire a wedding photographer to come in here.
Yeah. , All this equipment you have is made of wood. It would look so gorgeous with the sun coming in here. His logo is orange too. And , it’s in a old school, it’s , , a rounded s font too. So it’s modern classical. It’s like, Hey, I, I could totally see it.
Like I can totally see, you know, like that’s what I would spend money on right now. I’d spend a thousand bucks on getting a photographer in here, whatever it took. I can’t, I mean, media on the website.
’cause I’ll, I’ll do the website if you gimme, if you gimme great media and great background video and you got all your content, it makes our job so easy. I’ll just do that website. You just hop on our maintenance plan, our hosting. Right. And I’ll, ’cause he only needs like a 3, 3, 4, 5 page website. Fine. I’ll just do it.
Yeah. , But , don’t make me work with, use garbage, with crappy use garbage. Yeah. Agree. I know. Yeah. Totally agree. Yeah, that’s, I always tell my clients , your website will look as good as the photos you put on it. So if you’re giving me junk, it’s gonna look like [00:40:00] junk. In fact, , when I send a style tile to a client or I send a mock up to a client, I do not use their photos.
I use photos that I find from usually Unsplash or Envato that don’t look super stocky. Uh, why do you do that, John? I do that because I wanna show them what it could be like. That way when we develop it and they put their garbage photos in, they know it’s not me, you know? That’s exactly why I do it.
They’ll, they’ll even send a bunch of photos too, and I just ignore ’em. I just ignore ’em. I just, I just, yeah. I just put in what I want anyway. Okay. I like that one. Good job. Yeah. And then the last one I have really is, , and this is really generic without going into like loads of detail, just outdated design.
The thing is, websites have a life. What would you say a lifecycle of a website is? I’m saying . Three to five years. I agree. Agree. And that’s a designer. Yeah. , Like five Max because design [00:41:00] trends just change. They evolve and you can tell what sites are modern and fresh and what ones have been around for over five years.
, Just by looking at them. , Designers, again, , we can pick out really specific stuff, , but we’ll save that for another episode or something. Mm-hmm. , But yeah, if your website is three to five years old, start budgeting for a redesign. ’cause it’ll do good things. , Most of our clients. Are doing it around year four or five. You know, , some of them , are beyond 10 years. My dad’s church site’s been up for over 10 years. It still looks fine.
It’s, I was gonna say it looks good, but it’s like, ah, there’s some things about it that I just , wanna change, feel. It’s probably using plugins that are old. Yeah. There’s a lot of factors, . Last thing I had is, , and I was guilty of this one, , for a long time.
, The good old in the footer scroll the top button. Oh, I don’t think I ever once did that. Who Like, who’s I? It’s so funny. Who’s that? [00:42:00] Yeah. It’s so funny to think about it now. It’s like, I love this website. I need to go back to the top. Yeah. I think there’s still an option in Divi for that, isn’t there?
There is, yeah. Yeah. But I’m just like, why was that ever a thing? Why? Well, I’ll tell you why. So you can get to the menu. Oh. But now the menu comes with you. Oh, there we go. Generally, I like that. A lot of clients want that. Yeah. Like 98% of clients want , the fixed smaller. It shrinks down Sticky. Yeah. The sticky.
The sticky nav bar. But do we like it for mobile? I don’t mind it for mobile, but some folks don’t like it ’cause it takes up too much real. I don’t, I don’t mind it either. I’ll, I’ll do it when asked. Just ’cause it’s extra effort. , And I’m lazy, but I don’t mind it. It does, I mean, it just does take up a chunk of real estate.
It just depends on Yeah. What’s more important. Yeah. Homepage, y’all. There’s no place like homepage, something that AI is gonna continue to struggle with. I mean, AI can build interior pages [00:43:00] pretty fine, pretty great, but they ain’t got the skill yet for the old homepage. And that’s where honestly, that’s where us web designers make our money is the homepage, .
On the service side of it. Because so much that you determine on the homepage , should set the tone for the rest of the site. , , And sometimes if you got eight to 10 sections on that homepage, I would be like, man, maybe just reuse those sections across the whole entire site with different content.
Just another way to give some, uh, , what do you call it? . Consist what? Consistency. Consistency. Thank you. Anything final on the good old homepage how’d you come up with?
There’s no place like homepage. Hey, did you, had you just watched Wizard of Voice or, oh, John, I go to thesaurus.com a lot and , I google idioms. I forget which side I use for idioms. , But when coming up with headlines, like I am a, I’m a cheese ball and I love a pun.
So, , I will google that kind of stuff or use the source or an idiom to come up , , with. Taglines , and headlines. And usually I’m doing it totally tongue in cheek and as a joke. And a lot of times the client will keep it ’cause they like it. But anyway, [00:44:00] it was a, I was looking up idioms for home and there’s no place like home was there.
I was like, oh yeah, no place. Like home page. I have it. I I should t-shirt. I have it on a t-shirt. Well, because it’s so good. I mean like, like Home Sweet homepage, eh, you know, like, I’m trying to think of about not as, as good, not as good, you know, like, no, but there’s no place like homepage. It’s like, yeah, that’s the, that’s the right weight.
, That’s good. It’s good. That’s the right amount , of lore too. Like, Ooh, wizard of Oz. Ooh. Technologies in Wizard of Oz. Ooh. Web design, fairytale land colors. Anyway, it all works out. All of that. Yeah, I didn’t think of any of that, but yes. I know sometimes clients will, they’ll, they’ll do that.
Like, oh, I love how you did this because it, it, it nods to this, and, and you’re just like, oh, man. Yeah. Okay. Oh, man. Yep. Love it when that works out. Well. All right, y’all, thanks for joining in today and talking about there’s no place like homepage, all the web design empire. Also, check out our sponsor break into web.com.
Learn how you can [00:45:00] break away from your daily grind. Become a freelance web designer like Kelly and I, and create the empire you’ve been dreaming of. Alright. Cheers, y’all. We’ll see you next time. byeeee
How long was that? Was that long? I dunno.
Kelly Diekmann
Business Instructor
Kelly is owner of KDesign. She has an MBA with a Marketing emphasis from the University of Nebraska – Lincoln, and a BS in Information Systems with minors in Math, Spanish and Art from Nebraska Wesleyan University. Learn more about Kelly