Episode 6: Website User Experiences That Drive Users Insane

Most website owners attempt to create user experiences that they would want to experience themselves, but sometimes business and/or marketing goals create experiences that drive users insane. In today’s episode, Hannah, Ben and Kathy bring their grievances to The Kadence Beat, but also provide some alternative solutions that could potentially help site owners avoid pitfalls of user experience decisions while still meeting their business and marketing objectives. We also review what’s next with Kadence Blocks including Meta Box support, a Show More block, and more.

Listen via the controls below, or add us to your favorite podcast app.

Listen in a new window.

Timestamps & Links

0:00 Introduction

0:54 Popups that don’t meet customers where they’re at

2:50 Recipe sites that make it difficult to consume content. Recipe Box

7:30 Sites that have poor design

10:26 Why images are so important to your site

11:26 Craigslist, why are you so retro?

13:34 Authentication issues where apps don’t connect with websites

16:28 Single sign on

17:48 Contact forms that don’t have intentional design

19:05 Support is so critical to small businesses

19:36 Visit the theworldsworstwebsiteever.com for a chuckle

21:15 What’s upcoming with Kadence & Kadence Blocks

Transcript for Episode 5 of The Kadence Beat

Kathy: Welcome to episode six of The Kadence Beat. This is the podcast about creating effective websites with Kadence. But for episode six, we’re going to the upside down world. We’re going to turn everything around, and we’re going to talk about the worst website experiences that we’ve ever had. And maybe some ways that we could help people who are creating web experiences, not make some of these mistakes.

What do you think, Hannah?

Hannah: I’m here for it.

Kathy: We had a few minutes of discussing about what we were going to talk about in this episode, sort of the pre-show talk. And we just got into the content right away. I think we’re ready for this. I think we all have some good examples of sites that we’ve had some issues with.

I would like to go first ’cause I have some Festivus-level complaints about websites on the internet. I would like to talk about sites that hit me with a pop-up wanting me to join their list or even worse asking me whether or not I would recommend them to a friend when I have been on the site for less than five seconds.

Ben: I feel ya.

Hannah: That’s a very valid complaint.

Kathy: I would like to point at Williams-Sonoma, Pottery Barn, all of their brands, they all do this. And now they’re asking for my phone number, and while I love their brands and I love shopping on those sites, I don’t necessarily want to be hit with a pop-up. First of all, they already have my email address.I’ve bought things from them before, we already have a relationship. But still, every time I hit one of their sites, they want to communicate with me like I’ve never been there before, and that I’m not on their lists. It’s just annoying. I just want to look at beautiful pictures of furniture and housewares.

Hannah: I think that’s very fair. Although I will say if there popup is offering you like 20% off for your email, I may be one that’s going to be like, here’s an old email and yes, I’ll take 20% off. But I do feel like they should give you time to see what they’re offering first.

Kathy: At what percentage number would you give your email?

Hannah: You know, it probably wouldn’t take much, but it depends if I’m going through a site where I don’t really know who you are and I don’t know what you’re selling, then I’m annoyed and I’m probably just going to leave the site. But if you’re like a huge brand, if I’m going to Patagonia’s site and I know I want a jacket and they’re like, here’s 15% off. I’m beginning to be like, okay, sick, ’cause I’m here for a jacket. But if you’re a site where I’m like I don’t know what you’re selling. I’m not even sure how I found you. And now you’re giving me this pop-up, I’m annoyed. So then I’m probably just going to leave. And probably most people listening aren’t Patagonia. So maybe you should take Kathy’s advice and chill with the pop-ups.

Kathy: Yeah, I’d like to see a few less popups in the world. Ben, what about you? What really grinds your gears when you’re visiting a website?

Ben: Definitely popups. What gets me more than they want your email address is ads that pop up. So I’m calling out every recipe site on the internet. I don’t need to name any names cause they’re all this way, especially on your mobile phone. Just recently I cooked Cajun shrimp cause I was craving some Cajun shrimp. So I went online and looked for Cajun shrimp recipes. And of course, every website you go to you click on it and you know, five pages on how to cook Cajun shrimp when you just really want to see the recipe. And as you’re trying to scroll through, you’re going to get hit with popups, for videos of them making Cajun shrimp and tons of ads for other recipes and everything else.

And just trying to get to the recipe and then you have it sit there and you’re like, okay, I can see the recipe. Then a pop-up happens the whole page shifts and that recipe scrolls up or scrolls down. Yeah, it’s a, it’s a miserable experience. So hey, pro tip for everybody out there, Recipe Box is a free app and I love it. And you can take the website you’re trying to get a recipe from, copy the URL and put that into recipe box and it’ll actually grab the actual recipe and instructions out and put it into a nice, easy to read format.

Hannah: It is wonderful. Ben told me about this app a couple of months ago, and I use it all the time because even if you’re on a recipe page and you’re like scrolling down and you’re trying to just screenshot the recipe, by the time you actually do the screenshot, there was like eight videos that have popped up.

And then the videos are so small that you can’t even exit it. And then you’ve blown up the video. And then by that point, I’m like, I’m just going to make up a recipe because this is so annoying. So Recipe Box is legit, but also maybe you will just, shouldn’t put so many ads on their recipe page.

Kathy: Why do they do that? Why with all the ads, why with all of the extraneous, why not just give someone the recipe? Do you ever search for another recipe and say, oh God, not that site again.

Hannah: And it’s not just the ads actually. It’s like, when you’re trying to find your recipe, you have to scroll through the whole life story. And then you have to hear about their great aunt who made this recipe at their uncle’s funeral and like, blah, blah, blah. And I’m like, I just want the recipe. I don’t need to know all of this.

Kathy: Well, they must have some business need, that’s causing them…

Ben: You could talk to recipe sites and they’d be like, well, we have to make money somehow. We do all this work to create all this content, to get these recipes, to get the pictures, to get the videos. Like we have to earn money somehow and nobody’s willing to pay for recipes.

We just aren’t. And if anyone charged for recipes, instead of showing ads, we wouldn’t, we absolutely wouldn’t go to their website. We’d be like, you’re charging for a recipe. It’s like news sites that charge read their articles. It’s like the easiest click away, oh no, there’s a million news sites. I don’t need yours. Unless it’s like, which we can call out New York Times because their design is awful. They’re very good journalists, right, and worth subscribing to, but man, their app and their website, like, ugh, anyway.

I think if you’ve got ads on your website, because if somebody were listening to a little, I, I, I had to get ad revenue, there’s like two ways to approach it. Like one is, I need to get as much ad revenue. So I have to load this site with ads and I’m going to just do it until it’s like just before the nuisance of “they just rage-left.”” So it’s going to be a major nuisance to the users. And I wonder if there’s not a way you can do ads that aren’t a nuisance. That would make me come back to your website or if there isn’t a strategy for, cause like I don’t go to a recipe site and search for a recipe, I search Google and then I see what the results are.

But if I knew there was a recipe site that I liked the recipes and their design and they didn’t throw a million ads. Maybe that would be a site I would go and see, “Hey, did they have a recipe?”” Or it even might be a site that I go, I want to subscribe to that so I can see what new recipes are coming out with. And then there’s more ways, maybe if you’re running a recipe site, you can create an eBook that you sell for a few dollars. That’s the kind of thing, like if it’s a low enough price and I’ve already looked at some of your recipes and I really want that Cajun shrimp recipe that, you show a beautiful picture of, then I could see that being a way to earn revenue too.

So, I mean, I think some of it is creative versus the easiest is just to put in Google ads and say, yeah, torture my users.

Kathy: Definitely. Hannah, do you have a site that is driving you insane online or a website experience that has really affected you?

Hannah: I don’t know that there’s one site in particular, but I have done support for the last eight years. So I’ve seen many sites that need a lot of help. So when it comes to like design, I guess that’s something that very much turns me off. Like if I go to your site and you know, someone’s asking like, how do I make my header bigger? And, and then you’ve got this background photo that’s like, just completely distracting from the content or your colors are off. We’re using like eight different fonts on one page. I’m not going to give you a lot of credit because I’m just turned off by your design.

Ben: I catch people a lot with background images, especially where they have text over it, where they’ve set that up for one specific screen size, and it’s a screen size that they happen to be looking at it. And they’re like, well, you know, like the, you can read the text in this screen size.

Hannah: Oh, I’ve seen this so much.

Ben: Yeah, blow up the screen. And all of a sudden that text is over that dark part of the picture and it doesn’t work at all. That’s a really common newbie mistake of I got this beautiful text over this image that has way too much contrast. If you’re going to put text over an image, don’t use a high contrast image, but, uh, they make it work on their one screen size.

And then, you know, they’re not looking at it on others and that’s where it really falls apart.

Hannah: I remember one person in particular and we love all of our support people. Right. We’re so grateful to do what we do, but there was one guy in particular we worked with for probably six months, and his website was so bad. I mean, so bad for so many reasons, but we helped him, he wanted it to look this way and we were going to help him make it look that way. But also it’s hard to hold back and be like, actually, you should change some things. And we definitely did. And hopefully he got a website. That’s not just what he wanted, but also effective. But it is pretty funny, the kind of things that people come to us with and I’m like, ah, you’re missing the big issue here.

Ben: With Kadence, I want to give you the tools to build beautiful websites. I want to give you the tools to build effective websites, to build fast websites, to build compliant like accessibility websites. But by giving you those tools, it means you can build really ugly websites that are not compliant, that are not fast, all of those things can happen in reverse because what we’re trying to create our tools, we’re not locking you into this is what it is, we’re going to force you to have a pretty site. Even if you want a really ugly one. That’s not been Kadence’s goal. We just want to empower you to build a pretty site. And so what it means is we’ve empowered people to build a lot of very un-pretty websites.

Hannah: That we help, we try to help.

Kathy: Especially, like the starter templates really help people get started with something that a designer has actually spent a lot of time thinking things through. And you can go in a few directions with just changing those brand colors and everything. But it kind of keeps you coloring in the lines, so to speak rather than, you know, veering off into the wilderness.

Ben: Yep. Yeah. And That’s part of it. I think part of what people have to realize is when, even when they’re taking a starter template is images are so powerful for your design. And they mean so much to how a user gets a sense for what they feel and what they think about your website.

And so we’re talking about like bad experiences, like when you get on a website and the images are clearly not the right fit. They’re just not, they’re sized wonky and they throw off the layout or they’re just, the background has way too much contrast. And so you’re confused or you’ve got competing things, competing colors in your images.

Those kinds of mistakes are really easy because you’re like, “well, these are the images I have.”” And not a lot of people have a budget to be like, we’re going to go take professional photos for our website or our business or whatever. I was joking with a designer the other day. I was like, half of your time is spent searching for images. Design is one thing, but getting the right images is so important for like making it, making it work.

Speaking of design, I want to throw out a one website that I just, every time I get on there and I was just recently on there looking for a mountain bike. I’m like, how is it that they’re still this design, and that’s Craigslist. If you’ve ever been on Craigslist, you know exactly what the design is because it’s been the same since Craigslist launched, and they went about it with the approach, I think of, we’re not going to use CSS, because I can’t figure out how else you end up with this design. But yet, like here they are like getting just so much traffic. They’ve been getting so much traffic for forever. People could be like, well, it’s worked, but I don’t know.

Like to me, Craigslist is one that’s such an easy fix. Like there’s not a lot that needs to be done. Like we need to just make the site responsive and we just need to clean up the UI just a little bit, make it easier to navigate, easier to see things. Instead, it’s just a whole long list of links. It’s just so bizarre.

Kathy: It’s like Yahoo in the nineties. It still has that same vibe. Right. It’s rocking the retro scene. And it’s crazy to me that, I’m just on their Wikipedia, and they have 50 employees as of 2017, but still 50 employees and their revenue in 2016: 694 million dollars.

Ben: Goodness.

Kathy: They’re not paying for CSS though, right Ben?. That’s Ben’s joke, I’m stealing it.

Hannah: You kind of get the feel that you’re like shopping in some old man’s garage when you’re on their website, it’s like kind of eerie a little bit and maybe they want you to feel like that, I’m not sure. It is bizarre, but yet so many people still use it.

Ben: I, we just did. I just got a mountain bike on Craigslist. I’m like, I’m using this service and I’m like, just fix your design. Yeah, it’s wild. I mean, no wonder they get the rep for being like this sketchy way to buy stuff too. Like, it’s just got this…

Hannah: This old man’s garage feel.

Kathy: It’s an unconscious warning.

Ben: Okay. Well here I got another example this, just happened to me to the day that. Goodness. So we got an HP printer. And we decided to sign up for their instant ink service, which essentially you get like the app with your printer and the service watches the ink levels in your printer, and when your ink levels get low, they send you more ink It’s very confusing because they don’t actually send you ink per month, but you pay per month. You pay based on how many pages you’re going to print and there’s some rollover there. And none of that makes any sense because they don’t send you ink every month. So it’s not like they give you a certain amount of ink for each page. But either way, this is their service. I was on because we never actually got any ink from them.

We’ve been in six months now, our printer needs ink. And I was like, why haven’t they sent us ink? Like now we have to go buy ink from the store. So I’m looking through their app, which then sends me to their website. And of course I’m logged in on the app.

And now that I’m on their website, they’re asking me to log in again, because they don’t have that authentication piece worked out and their app has like three pages of content than everything else basically sends you to their website. And so I’m trying to see, have they ever shipped anything or are they shipping something, any of that stuff?

And the website and the app keep kicking me back and forth between I’m on the website now, not in the, in the app, but on the browser. And I’ve already logged in four times, I’ve logged in on the app and then on the browser, and then it got kicked back to the app. And then I got back to the browser, had to log in again, and then I got kicked back.

And then back to the browser again, logged in again, just to find out what’s the shipping status. And so I would rank that as like one of the like, wow, for such a big company. This is HP, to not have this. They make tons of money on their instant ink service. it was very surprising that they don’t have the login authentication figured out especially if you’re going to build an app where you send everyone to your website anyway, that seems like a crucial piece, but yeah, I logged in four times and I finally just gave up and it was like, I’m going to have to do this on a desktop where they stopped kicking me back and forth between the app and the browser.

Kathy: Almost sounds like there’s two teams in the organization. There’s the web team who’s working in a completely different building than the app team and they don’t talk to each other. And there might be like rules in the organization, security rules, that prevent these two teams from actually communicating with each other.

Ben: What’s funny is I ended trying to get to the contact. Maybe I just can contact them and I click on that and it says that I need to log in to do their instant chat. I was like, I’m done. I’m not logging in again, because I knew once I logged in it kicked me back to the app.

Cause it’d be like, oh, you’re on the app. So we’ll just kick you back to the app and then I’d hit the contact button again. And it would take me back to the website and say, do you want to log in?

Hannah: it is the most annoying thing to have to log in. And re-login like, when people remember my login, I’m so happy, but to have to do it over and over and over for one need on one site is so annoying.

Ben: Yeah, it’s tricky. What’s your opinion on using your Google account? Or let’s say your Apple account or whatever to log into like these random stores or things that you use, do you do that?

Hannah: I do. Yes.

Kathy: Yeah, I do fairly frequently, obviously with any kind of single sign-on type of situation, it’s something where you have to watch. You’re putting all your eggs in one basket, somebody compromises your email account and your…. basically everything is compromised, right? So if you’re using single sign-on, it definitely saves time, it’s so much easier. I don’t have to load up LastPass or 1Password to enter in another password. But on that same token you have to make sure whatever you using, whether it’s Google or Facebook or Apple or whatever, that that account is strongly secured.

Any other issues that you’ve seen online. I’ve got a whole laundry list. I mean, I could go on forever complaining about everything.

Ben: Common ones that, that I definitely see, even on like highly professional sites is it’s not clear. I don’t know what you sell or what you do or how this helps me. And I look around for awhile and will leave. Or like you’ve got a five minute video to explain a very simple product and you don’t explain that simple product unless they watch that five minute video.

Kathy: I have one about contact forms, and especially with Contact Form 7, which I know a lot of people in the WordPress space use. Contact Form 7’s confirmation can get overlooked a lot of times because it’s just this tiny little line saying your your contact form has been submitted.

But it’s so small and it doesn’t really give the user a visual feedback that the contact form went through. I just put in a contact request, and I don’t hear anything back for three days.

Did they get that contact? Should I try to find another way to contact this company, cause I have an issue that I need resolved?

So it is akin to like having somebody walk into your storefront and nobody talks to them. They just kind of walk around and look at things and your floor staff are like in the corner, looking at their phones and they’re just ignoring the customers. You don’t want that kind of experience on your website.

So ensuring that your website is customer focused ensures making sure that there is a way to contact you that makes sense. And a lot of people don’t want that. Right. They want to lessen the support load. So they make contact forms or a way to get in touch and actually talk to a person much more difficult because they don’t want to put more load on their support staff.

But, but you’re losing something there.

Ben: Yeah, I see a lot of big companies doing that. It’s pretty frustrating. If you’re a small company, support is everything like that people are choosing small because they want to be able to access a person. Um, so yeah. Pro tip: Kadence Blocks. We have a contract block a form block. And in Kadence pro you can save those to the database. You can also do an auto response right from that contact form. So they grab that email and send a response. Hey, we got your got your you ticket. It’s submitted.

I think there’s one, one last thing I think everyone should do to make their day better. And that is to go to the worldsworstwebsiteever.com. And just have a chuckle. It’s pretty brilliant on it. You’re going to see things like, the world’s longest number on a webpage. That’ll make your scroll bar go right for quite a while. There’s lots of little nice, hidden things in this site that, uh, will just make you chuckle.

Hannah: It is pretty remarkable. I think the hot dog background image is what really gets it from me.

Hannah: Just a nice touch.

Ben: The marquee race is also like pretty awesome.

Hannah: I wonder what this looks like on mobile.

Ben: I started on mobile with this site and it, yeah, it looks like this just on mobile.

Hannah: Amazing. We love that. For the ultimate guide of what not to do. This is where you go. You’re welcome.

Kathy: Beautiful. Could somebody build something like this with Kadence?

Ben: You could that’s what’s like… you can, if you want to. I don’t know some of it, I think. So you would need some custom CSS to like actually effectively force it to not be responsive. Like with this site the text just doesn’t ever fold over. There’s no like max width. But you could probably do this with Kadence, so.

Kathy: Nothing in Kadence blocking anyone from using comic Sans or the blink tag apparently.

Ben: Yeah. Or the marquee tags. So yeah.

Kathy: Excellent. Okay. Well that was a fun discussion. What’s upcoming with Kadence, Ben, anything people should be watching out for to drop into their updates?

Ben: Yeah, think soon, and there’s been a lot of internal updating going on, but we should have a Kadence Blocks and a Kadence Blocks Pro update out, hoping in the next couple of days, I’ll just say that, and with that will come a new block for pro, which is a dynamic list block that allows you to source taxonomies or whatever, based on what the current post is.

So if you wanted to show which categories this post is in, you’ll be able to do that. You can style it certain ways, but you can also use check box lists from like Advanced Custom Fields or Meta Box that you’ve created that you want to show which ones are checked in a list format. So that’s one that will help, it’ll help with like building custom templates where you need to show different things in Kadence. That’s a new pro block. There’s also like we added in full support for Meta Box, which is kind of like Advanced Custom Fields, it’s a pretty popular one. And then with free, we’re adding in a show more block and some updates, like you’ll be able to dynamically source galleries.

And then there’s just some like internal fixes for different things. but yet ends up like most things where like we do this and it’s like, well, no, we need to fix this. And we’ve got like, these are ending up to be pretty large updates because of how much we’re having to like structurally get set up, in part, because some of the bugs that, 5.9 came out with that doesn’t look like we’re going to fix in 6.0, so we’re going to go ahead and fix them.

And that is like, if you have a panel open on your block and you switch to tablet view, that panel is closed. This happens with all core blocks. You can call it a bug, because it shouldn’t happen, but it’s also more technical than that. So things like that, that we’re creating solutions for.

So those are the big next things.

Kathy: Exciting. Yeah. You gave us a little preview the other day of what’s happening and I’m really excited to introduce all of this to the Kadence community. I think people are going to be really excited about some of these new additions. Very, very cool. Well, I think that’s all we have today for The Kadence Beat.

We hope that this was an entertaining, but also informative discussion about some mistakes that drive users insane. And hopefully you can learn from these and start creating more effective websites with Kadence.