199 - How 2023 Web Design Trends May Adversely Affect Your UX and SEO - Thumbnail 600x900

Exploring Potential Pitfalls of Trendy Website Designs When It Comes to User Experience and SEO

In this episode, Jesse is joined by Web Designer Taylor Horn to take a closer look at some of the 2023 web design trends and their potential impact on user experience (UX) and SEO. Together, they explore the intersection of aesthetics and functionality, uncovering the roadblocks that may arise when embracing these cutting-edge design trends. From excessive animations to complex layouts, they discuss how these trends can inadvertently hinder UX and lead to SEO errors. Listeners will gain valuable knowledge and practical tips on how to navigate the evolving landscape of web design and optimize their websites for both users and search engines.

What You’ll Learn

  • How certain 2023 web design trends may negatively impact user experience and SEO rankings.
  • Why finding a balance between aesthetics and functionality is crucial for positive user experience and website performance.
  • What practical steps can be taken to ensure a seamless user experience while maintaining strong SEO performance.

 

Thanks for listening! Show your support of the show by sharing and reviewing us wherever you get your podcasts. Ask SEO questions and get a free SEO audit on our website!

Don’t miss an episode – listen on Apple Podcasts, Google Podcasts, Spotify, iHeart, and more!

Jesse Dolan: It almost seems every time there's a new design trick or ability, whether it be in builders or whatever, people just latch onto it. It's the cool new thing, but if somebody has to stop and think for a minute on how do I actually navigate this website or find the thing I'm looking for, does it matter how cool your design was if you now made it unusable for your users? That's counterintuitive.

Welcome back to Local SEO Tactics, where we bring you tips and tricks to get found online. I'm your host, Jesse Dolan here with Taylor Horn. First time on the show, Taylor, how're you doing?

Taylor Horn: Doing good.

Jesse Dolan: Taylor, just so everybody knows, is part of our team here Intrycks and is our brand marketing manager, which means Taylor, you're pretty much in charge of all the graphic design, logos, website, branding packages, pretty much helping all of our clients present their brand properly, the best foot forward.

Taylor Horn: Yes.

Jesse Dolan: Been doing this professionally for over seven years. You've got a passion for this, you're a rockstar on it. If anybody goes check out some of our Google reviews, Facebook reviews, I know you're mentioned or these services are mentioned, you're an absolute rockstar on our team and we've been talking about getting you on the podcast here and the YouTube show to talk about web, branding, that type of thing. Even though it's not a direct SEO ranking factor, here we are Local SEO Tactics, but you really can talk about SEO and local SEO websites without all the things that you bring to the table, Taylor. So, I'm excited to have you on to introduce you to everybody listening and watching, but also to dive into this topic for everybody because we haven't really talked about these types of things on the show yet, and I know this stuff is going to help a lot of people out. So, did I miss anything in your quick bio and intro there, Taylor, that we should highlight for everybody?

Taylor Horn: No, I think you covered it, just a huge branding nerd. I consider myself a web designer first and then an SEO second. So, I'm definitely excited to bring the two together in this podcast episode.

Jesse Dolan: What we're going to be talking about here today is roughly how current trends, 2023 trends in web design can adversely affect your SEO and your user experience. There's too much of a good thing. So we're going to go through... Taylor has a bullet point list here of several things that she sees all the time where we want to avoid excess or doing these things to a point where they cause you some problems. So let's dig in, Taylor. What do you want to talk about for the first thing?

Taylor Horn: Sure and I'd like to also start by saying I'm definitely not trying to dog any design or stop any innovation in the design realm. I'm just here to speak on behalf of a designer who works in SEO now and be that guide in your SEO for your website design. So starting off, I definitely want to bring one of the more common things that you see, it's pretty consistently used now and it has been for the past couple years, and it's that big hero image. So, a big hero image or video when you first go to a website, sometimes if I go to a website that doesn't have one, I'm like, "Ooh, this is weird," but it's very much a eye-catching way to grab your visitor's attention, very visually appealing, especially if it's high quality, it's relevant to your business. However, from the SEO side of it, if it's slow loading, if it's pixelated, if it's causing any bogged down of your site load, it can be a hindrance on your SEO.

So, I know I've gotten in trouble with slow loading times by having a big video or big image on that first initial load screen. So if you are going to be using a large image or video right there or anywhere on your site for that matter, just having compression plugin like Imagify or ShortPixel, and then you can also use a browser compression tool like TinyPNG, and it basically just shrinks the size of the video or photo without losing quality. Sometimes it might lose a little quality, but if it's not loading, Google has said many times that page speed is such a huge factor in your rank. So having a fast loading page is super, super important. It's why I wanted to start with this first one, just because it's such a huge SEO factor, is that page insight.

Jesse Dolan: And I think in addition to SEO, you mentioned earlier just like the loading speed too, which Googlebot, this is important for ranking, but also as a human being, if you visit a website and you're just not exactly line by line seeing it paint that image, but if you know it's trying to load this big old image, sometimes people aren't going to wait three or four seconds for that.

Taylor Horn: Exactly.

Jesse Dolan: You just don't want that experience, period. I'm wondering, so you gave people some tips on some good plugins and ways, so if you have an extra large image or whatever and you just have to use it, these tools can help. Are there things people can do? I'm a little bit antiquated on my photoshopping here, especially as you're part of the team doing all this for our clients, but isn't there something where the composition of that image, if it's tons of colors, it's taken a lot more pixels, a lot larger size, maybe if you need a big old high quality image that you can't compress, try some different images and see which ones load faster too as an option. So, you're definitely saying for people don't skip a big hero image and be still visual, but you have to pay attention to how this is loading really at the end of the day is the big part?

Taylor Horn: Absolutely, right, and another huge thing is having your call to action above the fold. This is something as far as conversions, converting leads, if it's just a giant image and there's not a lot of context behind it, having a call to action somewhere, whether it be on top or right next to can help that user journey. If they're waiting for something to load, they can see, "This is your anthem video for your business, so keeping that in mind too, and of course alt text, make sure you got your alt text on there

Jesse Dolan: For your images, yep.

Taylor Horn: Yep.

Jesse Dolan: I'm curious, when you say the text on top, are you talking actually overlaying the image or above it?

Taylor Horn: Definitely above it. Don't try to paste like a text on an image. We definitely want the heading there right there in a text box or however you want to do it, but not in a photo necessarily, but text over your image.

Jesse Dolan: So just so everybody's clear, if you're going to load that image in, you don't want in Photoshop or whatever your editor is, you don't want to be adding text in that, and then having your text in the image. You want the text on the web builder as something that can do then read by Google and things like that. So that's awesome, and for sure, this is a huge impact for people and I'm glad you started here number one because it's going to slow your pages down. It's the first thing you see when you load a page. Usually we're talking about the homepage here, so great one to start with. What do you have for the next thing to watch out for?

Taylor Horn: Great, and starting from the top and working down, another huge one that I've been seeing a lot, one of the newer trends I would say is having a non-traditional navigation. So, moving away from the conventional logo on the left, menu pages on the right, I think a lot of designers are getting bored with it, so they're trying out these new tactics, whether it just be icons as menu items or even just a little hamburger menu, whether you're on desktop or mobile, slide out menus, menu on the right or the left, and it's really cool, and I love the innovation, but I do sometimes wonder if it could be impacting your visitor.

This is definitely one to take into account your audience, like who's coming to this page? Will they innately know to click on this hamburger menu or do they need those navigation items listed out? And in that same vein, staying away from technical jargon or complex terms. You definitely want it to be pretty straight up front, like this is our about page, this is the contact page. You want it easily accessible because if people can't find what they're looking for on your site, they're going to leave and your bounce rate's going to just go through the roof if people aren't able to navigate your site correctly.

Jesse Dolan: I've been working in SEO marketing websites basically since 2000, and this is an interesting topic for me because I feel like this is one of those, what's old is new again. You see this going in cycles every number of years where we get these menus that are just crazy complex and it almost seems every time there's a new design trick or ability, whether it be in builders or whatever, people just latch onto it. It's the cool new thing, but it's always for me so tricky. Actually, we were just talking about this book, Don't Make Me Think, and for me, that's what always resonates is those things are cool and all, but if somebody has to stop and think for a minute on, how do I actually navigate this website or find the thing I'm looking for, does it matter how cool your design was if you now made it unusable for your users?

It's counterintuitive, so I really like this topic too, and I don't know, regular text menus load super quick. If your menu is based on icons and widgets and all these other things from the web design and build standpoint, I have to imagine that's a lot more code, assets, things like that, weight you're putting in for these things versus a traditional menu, but that aside the whole making somebody think and the user experience I think is pretty critical. And Taylor, I forgot to mention everybody, let us know too, whoever's listening right now, catching us on the podcast, if you want to see examples of these as we're going through, Taylor's showing screens, maybe injecting some screenshots in post-production here, but check us out on our YouTube channel, Local SEO Tactics, and you can see what we're talking about here as well with some examples. As we're going along, we're not going to reference them or do a tutorial for everybody who is listening.

You'll still be able to listen just fine, but if you want to see some examples of what we're talking here, check it out on YouTube as well. And if you can't navigate to that, just go to localseotactics.com, find this episode and there'll be a link to the YouTube video within that as well, but complex and non-intuitive navigation. We always say Taylor, and I think I mentioned this before in the show, if everybody doesn't know Intrycks, the name of our agency and firm that we work at, it's Swedish, loosely based on Swedish, for the word impression, and we chose that name for the company because you want to get ranked in SEO to be found, but also what's extremely important is that first impression clients and prospects have every website. And for me, that's one you have right here, Taylor, the complex, non-intuitive navigation.

I just get stymied, how could you spend all this money maybe getting ranked or investing into your website and then just make it hard for people to use? We think it's cool and innovative to your point, but do some AB testing. Grab some people who aren't familiar with your business. If you have a website like Taylor's talking and it's cool widgets and gidgets to navigate, tell somebody, "Hey, go find blank function on my website," and if they can't do it real quick, maybe you want to rethink how cool your website looks, maybe a little more traditional. So, those are the first two. What's the next one on the list, Taylor?

Taylor Horn: So, in that same new on the scene 2023, we're seeing a lot more movement and animations, and this could be in introduction animations to when you first go to a site to even you can hover over an element on the site and it's interactive animation. And in that same topic, I will loop in pop-ups even, which can be really cool and it can be your sign up for our newsletter, but in that same vein, I would definitely be careful if you are using any animation or pop-up, it can be a hindrance on your site, it can slow down your site and it can disrupt your user's journey and it can look a little spammy as a matter of fact. I think you might lose a little cred or lose a little bit of trustworthiness if you go to a website and it's just like, look here, look here.

And I definitely don't want to discredit. There are some benefits to having a sale pop-up or something, just make sure there's like a close intention readily available for your users, so they're not getting stuck and make sure it looks okay on mobile as well because I think a lot of animations, while they might look cool on desktop, as soon as you get to mobile, it might not be the same experience. So people might get frustrated, they might leave your site and if Google detects those bouncing people, they might demote your page a little bit. So, definitely beware of any animation, any pop-up, and again, it's definitely heavily reliant on your audience and who's coming to your site.

Jesse Dolan: I think if you're going to do that stuff, it has to help further your message and that it can't just be cool for the sake of being cool, and I really like what you said to everybody there, Taylor, about checking out on mobile basically. We've mentioned that before for SEO and other design related things. We design on desktop or laptop, big screens, so to speak. Owners, marketing managers, everybody listening and watching, if you're having your meeting about redesigning your website and looking at these cool animations like Taylor's talking about, I bet you all this is always happening on these large screens.

How does that translate to mobile, which is probably where the majority of your prospects and clients are engaging with you is on that mobile? So, Taylor is making a great point here. Definitely check those things on a mobile and see if they translate well or if they don't even show up or act as planned, you might want to just ditch them all together. And then that being said, Taylor, I know you do incorporate transitions, animation, a lot of designs, so all these things have a place, it's just you don't want to overdo it.

Taylor Horn: Exactly, so definitely not overdoing it, making sure there's not too much movement, and there might even be in your web builder the ability to turn off those animations on specific devices. So keep that in mind, if it's not translating well on phone, then maybe just disclude the animation overall, but I do think there is a time and a place for it. It can really catch your viewer's eye and enhance your message with these cool trendy pop-ups, so I love it.

Jesse Dolan: It can look professional and classy when done the right way and not, like you said, gimmicky and whatnot if you do it wrong. All right, so far we've talked over-reliance on the large hero images and videos top of the page, pitfalls of that. We've talked about bad, complex, non-intuitive navigation. Here we're talking about pop-ups, advertisements, animations, things like that, all really good. All things I think that people can maybe gravitate towards when they want a new website, something that looks better. My old art teacher I remember from high school, too much, too much was his phrase always when you overdid it, and I think those three things definitely fit in that category. I know we've got a few more on the list here. What's the next thing to avoid?

Hey, everyone, just a quick message about our free SEO audit tool on localseotactics.com and we'll get right back to the show. If you haven't taken advantage of it yet, go on out to localseotactics.com/freeseoaudit or look for the yellow button up in the top right corner. Click that and it's going to take just a couple seconds. You enter in the page that you want to optimize what you're looking for the audit to score against. Enter in that page, enter in the keyword you're looking to get optimized for and enter in your email address, click the button and it's going to take a few seconds and then it's going to send you off a PDF report via email. It's a great report. It's going to give you an overall score of some vital SEO areas for that page and for your website at large.

Even though it's auditing this page, that's going to tell you some of the good things that are happening, some of the bad things that are happening too, and give you basically a checklist of some things that you need to shore up and what you can do to improve your SEO for that page, for that keyword that you're auditing. Now, you can use this as many times as you want. You can do multiple keywords, multiple pages, multiple keywords on the same page. You can even use this to check against your competitors. If you want to do a little reverse engineering, see how they're scoring for a certain keyword, what they may be doing good that you're not, and some things to improve there. So, lots of different ways to use it completely free. Again, go on at the localseotactics.com/freeseoaudit or look for the yellow button in the top right corner of the website.

Taylor Horn: So, this is one of emerging web trend that gained some popularity, but I haven't seen it too much lately, but it's the dark mode. So, instead of black text on white background, it's black background with white text and this had a resurgence and it was very techy. A lot of these darker themed websites had this dark background and we weren't really used to seeing it, and while it can be cool and visually striking, this modern aesthetic, it's important to consider that impact of SEO, that user experience. It could be hard to read, it could be a little straining on the eyes, and then there's an accessibility concern. So if you are going to have any sort of dark mode, it might be worth it to look into an accessibility plugin, which would basically be like a toggle.

So, if somebody doesn't want to view your site with this dark background, they could switch it with this toggle. There are many WordPress plugins out there, and then keeping that accessibility in mind. So if you are going to have a dark background, make sure the text is bright and has a decent contrast. Make sure that people can read it essentially, because again, if people can't see your site, if they're having issues reading your content, you risk that bounce rate. You're risking people leaving your site and obviously make sure it looks classy. You don't want a dark website that doesn't have that moderny feel and the new age looking website.

Jesse Dolan: I think that's a very good one. I've seen a lot of sites, like you said, where it's kind of hard to read. I've got a large monitor, just again, back to if it's mobile or smaller, whatever it is, if you're starting off with it, making it maybe a little bit of difficult experience for the average user, what's it like for the people even more in the fringe? I think it's a really good one. What do you got next?

Taylor Horn: Not as common, but definitely one to keep in mind, and then the next one is another more common one that we've seen a lot lately in the past few years, and it's that parallax scrolling and taking it to another level, 2023 is full horizontal scrolling or fixed text and one side of the page, this asymmetrical is scrolling while one side is fixed, so definitely cool, visually stunning in a lot of cases, but again, it's keep it simple, don't overuse it. It can confuse or disorient people if you've got parallax on parallax. It can be a challenge for users sometimes trying to navigate if there's too many scrolling elements on the site. It might not translate well on mobile devices. This is another one to keep in mind if it might look good on desktop, maybe not on mobile so much. And then you want to make sure that your content hierarchy is not affected with this digital flow. So if people have to scroll a lot, it can be annoying frankly. So, just make sure that the user experience is still smooth with these modern background image, scrolling texts, things like that.

Jesse Dolan: I think this one is particularly applicable for the everyday main street business too. I don't know if you're a record company or something that's very visual or pop culture or whatever, I think these things maybe are more down your alley, but if you're the local business, the kind of people that are listening right now to this are watching this on YouTube, the people we help, and the reason this show exists, I've got to imagine this is an area where you don't need a whole lot of that. I think the parallax stuff looks cool. Again, all these things that you're bringing up here, you use these all the time in your designs and recommendations, but as accent, not as the main function that the site revolves around. That's a good one, parallax can be really cool, but can really be a little mind-numbingly confusing if you have too much going on there.

Taylor Horn: And this whole, instead of a website scrolling vertically, it's scrolling horizontally, which can be cool, and then this also brings up, if you do go off the norm, you have this horizontal scrolling site, it might take some custom coding, it might require a specific plugin or something, again, can maybe affecting that load time if you're adding all these additional elements to your page.

Jesse Dolan: Another layer here, we haven't really brought up, Taylor, but it's coming to mind as you're saying that, if again, you're a business owner, marketing manager listening, the more of the stuff you incorporate in your website, especially if you're paying somebody to do this, the more time there is for cost, for development, for labor, for those assets. If it's more complex on the page, it costs more and it took longer to build too, so same thing here if you don't need an excessive amount of these things, hopefully your website cost, if you're designing a new website or redesigning your current site should be a little bit less as well if you can lay off the excessiveness of these things. That one's really good. We have one more. Before we get to that one last one, Taylor, is there any other thoughts bringing all these other ones together or do we want to hit this last one for everybody and then tie a bow on the episode?

Taylor Horn: I guess the biggest thing that I can... Just design with people in mind, design with your audience in mind. I'm definitely... Again, I'm a huge design nerd. I love branding and new, innovative design. So, I definitely am not trying to be a stick in the mud about it, but it's just something to keep in mind. I definitely love when everything meshes together nicely. Which brings me to the next topic, and this is definitely one that is probably the most common trendy design and it's that asymmetrical, broken grid layout.

And this is very much like a Y2LK, it's pixely text with these old school graphics and it might look really cool, but it's definitely not the norm. It's an irregular arrangement of the elements. It might challenge your user's visual expectation of the page. It might be harder for them to locate certain items. Basically, website design principle, there's like a grid principle and it's to keep the same margins, the same column layout, this golden rule principle, and obviously make sure it looks good on mobile as well, but that broken grid, that asymmetrical, it's a little crazy, wacky, but it's cool if it's done right, but just make sure, can people navigate your site? Can they find what they're looking for? How does it look on a phone?

Jesse Dolan: I like what you just said there, again, about can people navigate your site. I mentioned that earlier and I think that's something that applies to a lot of this, and if anybody out there is going through a design or redesign or if you're listening to Taylor's ideas and you're like, "Oh crap, that's me. We've done that on our site," and grab some people and like we're saying, just look over their shoulder. There's a bunch of AB testing stuff you can find online if you just google it. Actually that book we talked, Don't Make Me Think, Steven Krug, he talks a lot about AB testing and has some great ideas and resources on how to quickly do this stuff, but that's really a great test at the end of the day is, can people navigate your site and can they find what you're looking for?

I'm sorry, can they find what they're looking for? And we've talked about this internally, Taylor, your website, every page of your website as a business, and then as a designer, you should have an intention on where you want the user to go. Maybe that call to action, like you mentioned, or clicking a phone number, whatever it is, there should be a very clear purpose for each page, but then there's also these other things that can be found and explored and challenging people to do those things on your site. Are they looking for the thing and they missed it?

They scrolled all the way to the bottom of the page because it wasn't evident because it was a bad design, like you're saying, that should be a red flag and maybe you need to simplify, but that's I think where the rubber can meet the road is, can people use your site and can they accomplish what you're hoping they can accomplish or can they find what they're looking for? Those are the two different ways to come at it, and if yes, then you're good. And if not, I'd say play this episode back, listen to Taylor's... What do we got, one, two, three, four, five, six points? See which of these six might be causing you some problem and give it another redo. Any other tidbits you want to share with everybody, Taylor, before we wrap it up?

Taylor Horn: No, just find the right balance between design and optimization and you'll create a great user experience for your audience.

Jesse Dolan: That's awesome. I think we should give ourselves a shameless plug. Let everybody know, yes, like we said on the front side, Taylor is part of our team. This is what we do. We don't just do SEO for clients, we do web redesign, branding, brand guidelines, logos, all of that. And if you engage with us on those things, you're going to be engaging with Taylor and her team for this. If you need help in these areas, maybe you just want some consultation, whatever it is, you can reach out to us either through localseotactics.com or intrycks.com, which is our web design SEO firm.

And we are happy to help with these topics, in addition to talking to them here on the show, and this will not be the last time for everybody listening that Taylor's on. Taylor's going to be coming on talking more about design UX related things for your website as we move forward in the future because like we said, this is a big part of SEO at the end of the day and we need to talk more about it. So Taylor, I appreciate you coming on, sharing your insights with everybody.

Taylor Horn: Thanks for having me.

Jesse Dolan: Absolutely, getting introduced to everybody and I'm looking forward to future episodes as well.

Taylor Horn: Me too.

Jesse Dolan: All right, with that, we can wrap it up. I hope everybody listening pulled at least one or two nuggets, probably more out of this episode. Taylor, thanks again for sharing everything, everybody listening, you can check this out. Again, if you want to see some of the visuals and examples of what Taylor's talking about, go to localseotactics.com. Find this episode and you can watch the YouTube video or just search for us on YouTube, Local SEO Tactics to find the channel. Thanks again, Taylor. We'll see you again. Everybody listening, we'll catch up next episode. Take care.

To share your thoughts:

To help out the show:

Your ratings and reviews really help and we read each one.

LINKS

MP3 Audio DOWNLOAD THE MP3 AUDIO FILE

Listen to the episode however you like with the audio file.

RESOURCES