SEO For Web Designers : What you should know by Pawan Sahu #441

Ep. 44121 min2018-11-13

Web designers need core SEO knowledge including site structure, mobile-first design, image optimization, page speed, schema markup, crawlable URLs, and HTTPS to build websites that rank and convert.

Cover art for SEO For Web Designers : What you should know by Pawan Sahu #441
Key takeaways

About this episode

SEO For Web Designers : What you should knowWhether you're building a new site or revamping an existing one, these are the top SEO tips to keep in mind for web design.

Questions this episode answers

What SEO basics should every web designer know?

Web designers should understand site structure with pages no deeper than three to four clicks, mobile-first design, image optimization using correct file types, page speed, schema markup, crawlable and search engine-friendly URLs, HTTPS, and including title tags and meta descriptions on every page.

Why does mobile-first design matter for SEO?

Google uses mobile-first indexing, meaning it primarily crawls and ranks the mobile version of a site. The episode recommends mobile-first as the top priority, followed by mobile-friendly, then responsive, with responsive alone considered the bare minimum for any new website.

How does page speed affect SEO and user behavior?

A website taking two to three seconds to load faces higher abandonment rates. High bounce rates signal negatively to Google and can hurt search rankings. Tools like GTmetrix can help measure and diagnose speed issues, and techniques like gzip compression and reducing server requests improve load time.

What tools does the episode recommend for web design and SEO?

The episode recommends GTmetrix for measuring load speed, a responsive web design testing tool for checking sites across devices, and Screaming Frog SEO for site audits. These three tools were specifically cited as useful for web designers working with SEO.

In their words

A great website is a powerful combination of quality content, appropriate web design, ample SEO efforts, and marketing.

Host

Surely it should be mobile first. Failing that, go with mobile friendly. Failing that, go with responsive. Failing that, get a new designer.

Guest

If you're trying to rank for a certain keyword, have a page all about that keyword. That one keyword.

Matt Bertram
Terms defined in this episode
Mobile-first indexing
Google's approach of primarily using the mobile version of a website for crawling and ranking, making mobile design a top priority for SEO.
SRCSET
An HTML attribute that lets developers define multiple images at different dimensions and DPI so the browser loads the best version based on the user's device resolution.
CSS sprites
A technique where multiple images are combined into one image and referenced by section, reducing the total number of server requests and improving page load speed.
Schema markup
Structured data added to a website that should not be skipped because it is good for click-through rate in search engine results pages.
Read the full transcript (4,065 words · 20 min read)

Hi, and welcome to the SEO Podcast, Unknown Secrets of Internet Marketing. My name is Chris Burris, owner of eWebResults. My name is Matt Bertram, your digital marketing strategist. Strategist! Welcome back to another fun-filled edition of our podcast. This is podcast number 441. And as always, we have a... Well, let's see. Well, that review is... Oh, there we go. It's in the wrong spot. So we'll figure this out. We're live! As always, we have a tip from our previous podcast, and that tip is... There are special words for title tags that are associated with better rank. Learn them and use them. Yes, last time we covered words that you should use in your title tags that are associated with those sites that have better rank. Yeah. You should learn them. And you should use them. And you should use them. And you should put them at the front of your title tag. Yeah. And typically the first three to five words. Just an example. I don't know, like free, best. Those are a couple of examples. Best SEO Podcast. You need to say that at the beginning of the podcast. Of the podcast, yeah. Subscribe, follow, boom! All right. As always, we have a review. Also, as always, we have a review. This one is from Brian Goldsmith. Punch in the face to you. Yeah. He's actually a longtime client. He says, They are the best at what they do. E-Web has helped us from creating our website and building our SEO. To all our social media, Brian, punch in the face to you. Yeah. We really appreciate you as a customer and friend. Hey, if you've been to this podcast. Oh, wait. Please remember, we're filming live here in Houston, Texas. And Matt and I, we are your Results Rebels. And if you've returned, it's probably for tips and tricks that you can get. If you'd like more tips and tricks, you can get those. For example, five online marketing mistakes that can take your business. And how to avoid them, you can go to

ewebresults.com slash. SEO tip. SEO tips. Boom! That's nice and easy. If this is the first time you've listened to the podcast, howdy and welcome to the podcast. Again, if you've been here before, you know what we're about to skip. We run a contest each and every podcast. And the way the contest works is if we get ten shikos. A share, a like, or a follow. If we get ten of those, by the way, when you're doing them, you hear a sound in the back of your head. And it's like, shikow! If we get ten shikos and we get a review, then we move the information where we tell you how to connect with us and leave reviews to the end of the podcast. Boom! It's at the end of the podcast. Teaser article. This is going to be good. This article is SEO for web designers. Yes. What you should know. Web design is obviously incredibly important to having a presence on the internet. And SEO is an important part of being able to be found. And so those people who are doing the web design for you should have at least some fundamental understanding of SEO. And we're going to jump into that. Well, and I think it's important to know when you're talking to people in the industry, Chris, and you can kind of speak to this a little bit, is when you're building a new website for somebody or when you're looking for a new website, if you're out there searching for web design companies, taking your existing content and putting it in a new format is usually the standard option for web design. Adding content is kind of additional or extra or a bonus if you're paying more money for a website. And then SEO is typically not done on the back end of the website from filling out everything that's technical. And that's another kind of component. So it's important when you're looking or educating you on looking for a web design company, ask those questions. Ask the right questions.

Right. What are they doing? Are they just transferring the content into a better format and looks nice? Are they adding additional content for you or generating that content? And then are they doing the SEO on it? So those are kind of three different components. And I think it's really important to know when you're looking for websites to understand that. So and one of the things that we like to ask is absolutely true. And one of the things we like to ask is when it comes to kind of choosing who's going to design your website and maybe who's going to do your SEO. We asked this question. If you hire somebody to make a great website and they do. And in reality what that means is your friends, family, good customers, they like your website. Or designers. Fancy, fancy designers. Real pretty websites. So they say they create a website that you like. Right. And that's good. And you hire another company to send lots of traffic to that website. Be it SEO or PPC or maybe some social media traffic. And they actually send lots of traffic to your website. So you've got a great website. You've got lots of traffic to your website. But you're not getting any business. We ask this question. Who do you fire? Well, I think it's really important to understand the optimization, the conversion optimization when you're looking at a website. So web designers need to understand principles. And that's why I think this is what we're going to cover for SEO. Like as building out the right structure. Right. But also looking at high converting websites that it's not just a pretty business card or flyer online. It actually helps you transact business. And so those fundamental concepts need to be incorporated into it. You can still make the website look really pretty. But there's things you need to incorporate to make Google happy and to make the visitors happy and to make you happy ultimately to generate more leads online. I think that that component of the

conversion optimization, the usability of the website is a component that people forget about. Right. And SEO, you know, has a broad terminology, but they have to scoop into that. But then also the web designer has to kind of it's just like sales and marketing. Where do those points meet and cross over? Right. And if at any point, are they mutually exclusive? And so what we say is that a good web designer should listen to this podcast. They should, this specific podcast, they should understand the fundamentals that we're talking about. And at a very core level, they're at a disadvantage from a company like ours. Right. Because we're not just creating the website or the landing pages or optimizing the graphical user interface. We're also driving the traffic. And then more importantly, having conversations with our customers on a month over month or week over week basis. What that does is we've got a feedback loop. So you could listen to this podcast or read an article about great web design and it could say, hey, green is the right color to use for buttons. Well, okay, we're reading that same article. We're testing and measuring it. And because we have the feedback loop, not only with the traffic, but also with the customer, we actually know what works for delivering business. So what just one really real life example that I ran across yesterday. By the way, this is the longest segue into what we're about to talk about in history. But yes, go. And we have a deadline that we need to get to. So this is great. So essentially, we have a client. Okay. Just launched a new website. We designed it. Fully optimized, full package website. He went from no traffic to his website before to in SEMrush over 600, I think it's $600.7 or $6,700 per month. Of value. Of Google ad spend. Right. Equivalent. Equivalent. Because we know what we're doing. We built the website, optimized for SEO, and you can just see it. It's just like this huge boom,

this huge pop. And that's really the advantage of getting an SEO company that does web design to design your website. Yep. Or understand the concepts. That is exactly right. Hey, we have t-shirts available. You can get those at ewebresults.com slash swag. Woo. Swag. All right. Let's jump into this because we're running out of time. We're going to run out of time. We've got about less than 15 minutes. So SEO for web designers, what you should know. A great website is a powerful combination of quality content, appropriate web design, ample SEO efforts, and marketing. I would say that really those are kind of separate. They should be, I would say, internet marketing is a great website, appropriate web design, ample SEO efforts, and marketing. Like, that's great internet marketing. A web design is just a website. The Venn diagram analogy works here, too. Web design and SEO go hand in hand. Yeah, they do at our company. And both play a part in developing an SEO-optimized website. You can go hire people who just design websites. And that's really what I think, oh, well, that's what we're going to turn this article into. So here are things that really an SEO, a web designer should understand from an SEO perspective. And that's the structure. Now, there's two kinds of structure. There's the structure as it relates to the visitor to make sure it's easy for the visitor to find things. And then there's the structure as it relates to search engines. And really, they're pretty similar. You know, you just want to be able to get to the pages that are of importance really quickly and easily. In the case of SEO, you know, a sitemap helps take care of some of that. And he says, as a general rule, pages should be no deeper than four clicks from the whole page. Yeah. And I would just say, when you're looking at the SEO standpoint, think hyper-local SEO. Right. Think about like a water and a Coke. Yeah. Right, right. Coke, water, oil, vinegar, whatever. Right.

You mix them. Right. Right. It dilutes whatever the purity is. The flavor. Of what it is. So if you're trying to rank for a certain keyword, have a page all about that keyword. That one keyword. Right. So the more hyper-local, that's kind of the term that you can do, or the hyper-focused that you can do, the more benefit you're going to get from SEO standpoint. See, we just can't talk about web design without really incorporating how the content is going to affect your SEO and impact your internet marketing and your end results. The next thing is a compulsion of responsive, mobile-friendly web design. Mobile traffic, as a share of global traffic, is going to increase in 2017. It was 52%. That means every web designer needs to get to the fact that mobile-friendly websites is here. Not to mention the fact that there's mobile-first indexing now, which I'm surprised they didn't mention. I don't know when this article was written in October. So, yeah, there's actually one commenter on this article who was just a smidge critical. And I would say that one of the critical pieces that they left out is like, how come you didn't mention mobile-first indexing? And that's how important mobile design is. Yeah, I mean, you really got to look at on different devices. There's tools out there that help you to look at what it is. When it comes to mobile, I think it's really great above the fold. You have a call-to-action, lead capture, some trust-building, and maybe a statement that captures everything in the first five seconds that people know where they're at and why they're there. And to be able to easily get in contact. I love your analogy of, hey, you've got to pretend somebody's just dropped in the desert and they have no idea which direction to go, north, south, east, west, whatever. And you've got to have the right signs to get to the roadmap so that they can stay, that they go and stay on your contact. You definitely don't want them

hitting that back button, right? Even navigation-wise, you want them to hit the logo or the home button. Something. Because if they hit back, Google dings you every time they hit back. Yep. And they're gone. Yeah. Image optimization is crucial. So from a web design perspective, you've got the aesthetics associated with an image and what images are going to be engaging, what images are appropriate for your target market. So it's always important to understand your target market and what images are going to be. Clip art's not so good. Yeah. Yeah. Optimizing and choosing images is a must because large images can slow down. So, yeah, you need to optimize them because that will help your website. Well, site speed too, right? Go faster. Well, you can also have the recall rate on those images. Right. Recall stuff at the top first. Right. Or download it where it's kind of fuzzy. Yeah. Right? Before it makes it fully clear to have it download faster. And that's one of the, and we'll get into that. That's one of the critiques is like, hey, there's a big difference in terms of optimization speed of how quickly can you start interacting with the website versus the total load time. Yeah. Well, I mean, you want to shrink images too. So there's definitely, All of these are valuable. Yeah. For sure. Yeah. Speed optimization of the website. Web developers and designers are kind of always on call. Sometimes you've got to make some fast changes. And he says sometimes those website, and he may be kind of introspective on this one or she. Right? This is a pawana. Well, I think, A pawan. I think cache really important. Right? Even like, So the two, By the way, one time my brother, I said cache and my brother was, I know that, Excuse me. It's cache. That was my brother. I know. But he's at Red Hat and he doesn't even do web stuff. So, I can't get that word right. Cache.

Just think, Cache. Cache. Cache. Save you. Cache. Cache. Cache. Cache. Cache. Cache. Cache. Cache. So those web designers in the middle, because they're making changes, avoid the optimization process. A website that takes two or three seconds to load can face, and this is absolutely true, can face higher abandonment rates as compared to others. I think over three seconds is kind of the terminology I'm looking at. Right? 20% each second after that. Next, using the right tools. So he uses GT Metrics. That's actually really about load speed. So if you think these last three, image, site speed, and now tools includes GT Metrics. That's about site speed. He also gave responsive web design testing and Screaming Frog SEO, which is a spider tool. Yeah. It's a really great tool. So that was it. That's really quick. And now I want to talk about what Lyndon, so Lyndon, you know when you read comments sometimes, sometimes they're just so bad. You're like, who is this idiot? Right? Who is this moron? And I want to, This is Darth Vader. Yeah. This is Darth Vader. Then other times you're like, these comments are actually so smart. I want to figure out who this person is. This guy knows what he's talking about. Oh, yeah. This guy knows what he's talking about. I'm not saying the article is bad. Like, I really don't want to knock it and say the article is bad. But I actually think all the stuff is pretty, It is very salient, very good. Yeah. And then Lyndon really just goes in and says, look, you really missed a whole lot of stuff. And I start off, I want to give this, preface this with how brutal he is. He says, no offense, but I'm left with two distinct impressions. Number one, you don't build websites. And number two, you don't do much in regards to load speed. I think that's a little harsh. Yeah. I don't think he's meant to be a troll here.

Yeah. I think he just is passionate about it. And again, It has a lot to offer. Yeah. I mean, I think the article is okay. I mean, maybe not right up there on Search Engine Journal. Yeah. But you want to go into a little more detail. That was another comment that said, hey, this could be on a local blog. Maybe not Search Engine Journal. Oh, yeah, yeah, yeah. He says, so first, site structure. He's interested in the four clicks. He says he's only heard it referenced as three clicks, that all major pages should be accessible within three clicks. I think the shorter, the better, actually. He says something along the lines of images aren't render blocking. So, it's not that images stop you from being able to see stuff. Large images can result in longer page load times. That's true. But they should have little impact on perceived load or usable load in terms of when they can start interacting with the website. Yeah. This is, you kind of alluded to this. This is how you manage how the page loads. The recalls, yeah. Responsive and mobile friendly. I love this. He says, surely it should be mobile first. Failing that, go with mobile friendly. Failing that, go with responsive. Failing that, get a new designer. That's just how the simple truth is that as you're optimizing, especially if you're using responsive, as you're optimizing for mobile, it's also for desktops because most browsers just pull down all information. He talks about speed optimization. The two to three second things, again, is kind of overrated. Really, they're referencing a two to three seconds to get something loaded that the user can recognize and start interacting with. That's absolutely true. I still would optimize for overall page speed. Yes. But if you're able to have the user interact, I mean, the big thing to avoid, This guy's got a lot of comments. The big thing to avoid is that bounce rate that you mentioned earlier because that's going to ding you in

terms of the search results as Google sees those bounces. Next was SRC set, right? This bit lets you, so this is just one of the commands that you can use HTML. It lets you define multiple images of different dimensions in DPI so the browser can load the best one based on the resolution DPI of your current computer installation. So you might have images available at a much higher DPI and therefore a much higher download weight, if you will, and so you can have multiple versions. And if your computer recognizes, I don't know, that you're on an older iPad, then go ahead and pull down a lesser image. Take that span. It was like the phone that would go on the 2G versus the 5G. Yeah. Yeah. File types. So different types of images have file formats that may serve better. So a photo as a JPEG, a simple block, colors as a PNG, and then there's also a WebP for Chrome. And then label those properly, target keywords. Yep. As you know, I'm just going to insert a little SEO in there. He's got DAT URIs. You didn't, you mentioned, he's asking, why didn't you mention DAT URIs for certain images in the design CSS? Sure, they add a little bit of total file size, about 30%, but if you can incorporate them directly into that HTML file or the CSS file, then there's going to be some speed benefits because there's one less request. Anytime you're getting a lesser server request, it's going to be better. In fact, if you've ever run, hey, how do I speed up my website? One of the things they talk about is, hey, consolidate how many JavaScripts you have, consolidate how many images you have. And so one less request is better. CSS sprites, that's actually where you can take one image and you actually compose that image with multiple images, and then you reference the sections on that agglomerated image. And so what it does is it reduces the number of requests. Yep. And

then he also talks about images as fonts, icon fonts, and then SVGs, scalable vector graphics, which are really simple graphics that when you make them bigger and smaller, they're scalable. And then he jumps into compression. I didn't want to get into all of this, but he talked about GZIP and how you could compress all your text, you can compress, compress your images as well as possible. And then in hindsight, as I was going through this, yeah, they didn't mention titles and descriptions. If you're doing web design, at least throw in a title and description, right? Even if you aren't highly qualified to identify the right keywords and then put in the title and description that's going to be best for, from an SEO perspective, at least get them in there. And we'll kind of flow through this really quick. Schema markups. Yes. You don't have to do it, but it's good for your click-through rate and SERPs. Socialization. Like, as you're designing, you should make it easy for people to interact with you socially. Social shares. How about search engine-friendly URLs? Duh. Accessible and crawlable. Does he say that? Yeah. He says, possibly one of the most talked about on-site factors for SEO, you didn't even touch it. It's search engine-friendly URLs. I thought he said, duh. Oh, no. That was you. That was me. Okay. That was me. I kind of jumped on the- I was like, dang. Pile on. Pile on. No. I jumped on the Linden bag right in there. Right. Most important factors, you've got to be a crawlable and you probably have to have your robot text files. He talks about HTTP1, HTTP2, and HTTPS, of course. That's a little bump from search. Yeah. And then 404 resources, which is probably important to a lesser degree. I'm going to give a punch in the face to Pawan and to Linden, by the way, because that additional information is worth it. I thought it was good, yeah. Linden, if you connect with us, reach out to us. We'll send you a

t-shirt. We'll send you a free t-shirt. We've got a whole collection of t-shirts. You can find them at ewebresults.com slash swag. In fact, we should send him an email if we can figure out how to get a hold of him and let him know he can have a t-shirt. He needs the Dark Vader one, right? Oh, yeah. The rank be with you. May the rank be with you. All right. So, if you like this podcast, we're going to ask you to do one simple thing, and that is to share that with three people. You can do that later. We've got to go. If you want to grow your business with the largest business marketing tool on the planet, call eWebResults.com. It's driving me here. You're on a 713-592-717-4255. You're on a 713-592-717-4255. If you want to grow your business with the largest business marketing tool on the planet, call eWebResults.com. So, if you would like a transcript, audio, or video of this podcast, you can get it at eWebResults.com. We're the number one podcast because of all y'all. Thank you. Thank you. Punching the face to you. We really appreciate you. Punching the face. Until the next podcast, my name's Chris Burris. Matt Bertram. Bye-bye for now. Bye-bye for now.

This episode answers

Matthew Bertram, host of The Best SEO Podcast
Matthew Bertram
AI keynote speaker · Owner & CEO, EWR Digital · President, ModalPoint

Matthew Bertram is an AI keynote speaker, creator of DIG® (Digital Information Governance), and owner and CEO of EWR Digital. He helps energy and industrial leaders win visibility in AI search (GEO and AEO), is President of ModalPoint and CMO of the Oil & Gas Global Network, hosts The Best SEO Podcast, and has authored eight books including LLM Visibility. More about Matthew Bertram.

Related episodes

Ep. 534 · 29 min · Transcript

3 Ways To Optimize Internal Linking Ep. 534

3 Ways To Optimize Internal LinkingPoor internal link structure can end up harming your site's rankings. At SMX Next, Jonathan Epstein showed how…

Agency & Business Growth

The show explains it. EWR Digital does it.

The Best SEO Podcast breaks down SEO and AI search; EWR Digital, the agency behind the show, implements it for operators. Start with a free, no-pitch audit of where you stand in Google and in AI answers.

Get a free AI visibility audit