Web design and SEO go hand-in-hand!
I know you’re doing great website design work for your clients, and by focusing on SEO, you can create an amazing website that also ranks well in Google, which will help your clients’ business grow. You’re probably already doing a lot of these things anyway, but focusing on SEO when you design can benefit your clients and it can help you upsell your services, too. So if you’re looking to combine web design and SEO to create awesome websites that will rank well in Google, I have 8 tips for you! (And if this just seems like too much work to add onto your packages, check out my SEO partnerships page to see how we can collaborate)
8 web design and SEO tips
Focus on a great user experience
I know you’re creating beautiful websites, but make sure they’re set up with user experience in mind, too!
I have a whole blog post with UX tips, and UX is important for SEO because the longer people stay on the site and the more pages they visit, it signals to Google that it’s a quality site that people are interested in and it can help increase rankings. You only have a few seconds to capture someone’s attention and keep them interested, so even focusing on the smallest things with UX can help people find what they’re looking for and staying on the site longer.
So with UX, make sure the site speed is as fast as possible (you can test it in Pagespeed Insights or GTmetrix for free), all of the photos and videos are compressed, there are clear calls-to-action throughout pages to lead people around the site, and the menu bar is clear and easy to navigate.
I know it can add more personality to name the about page something like “Behind the Scenes,” but it can actually confuse people and they might not click on it if they’re scanning the menu bar specifically for “About.” Also, keep the menu bar options minimal so you don’t overwhelm people. I’ve seen menu bars with 20+ options and people just don’t know where they’re supposed to go with too many options to choose from.
So UX is important for SEO, and it’s also important for conversions! The easier it is for people to find the information about services or products, the higher the chance they will convert, which will help your clients grow their businesses!
Design for mobile
Since more people are using their phones, Google is focusing more on mobile site design as a ranking metric. Site speed is super important for mobile sites because they can be so much slower with large images or videos, so compressing everything is really important for web design and SEO!
I know some platforms aren’t the best for designing on mobile (I really love Showit because you can design the mobile site separately if you want to test out a new platform), but as best you can, make sure that text and images don’t get cut off weirdly, that there’s a footer with navigation (that way people don’t have to manually scroll all the way to the top of the page to click on the menu again), that the menu is easy to open and close, that the text is big enough to read on phones, and that any buttons or hyperlinks are big enough to click on small phone screens.
And one of my biggest pet peeves- if there are any pop-ups, make sure there is a clear X to get out of it since people can’t hit the escape key like they can on their computers. I can’t tell you how many websites I’ve just left if I can’t close out of their pop-up quickly!
If the text is too small or people get frustrated with not being able to click on something, they’re not going to stick around, which can hurt the website’s rankings in Google over time. And I know you don’t want to be designing a website that annoys people, anyway!
Keep the heading hierarchy
I’m sure you’ve seen that text can have different headings (h1, h2, h3, etc.), and this is important both for design and also for the structure of the page. But I want you to focus on the heading hierarchy over how each of the headings look (and I messed this up at first when I was designing my site on Showit, so it can happen to anyone!).
The h1 heading should only ever be used for the title of the page so there should only be one h1 on each page, but I see DIY websites all the time with multiple h1’s on a page because someone liked the design of that heading over the others. If there are multiple h1’s, you can confused Google about what the title of the page is, and it might think that something like “Check this out!” on the page is the more important title than “Interior Design Services.”
So make sure that there is only a single h1 on each page and follow the hierarchy where h2 is the most important topics, h3 are the subtopics, etc. If you flip around h2’s and h3’s occasionally, it’s not the end of the world, but overall, try to keep that hierarchy!
And one last note, make sure that paragraph text is labeled as paragraph text and not a heading. I’ve worked on websites where the entire page is labeled as headings, which means it won’t be clear to Google what the main topics of the page are.
Focus on accessibility
Web design and SEO go hand-in-hand with accessibility! Erin from Mabely Q is an amazing accessibility expert with lots of helpful resources, and I’m always learning something new from her so I recommend following her.
Accessibility for your website design means making it as usable as possible for everyone, including people who are visually and hearing impaired. For website design, this includes making your text big enough for everyone to read and not using really scripty fonts everywhere (even I have a hard time reading people’s small or scripty text), having alt tags on all of your images, and choosing colors that are easy to see and read.
I know you aren’t going to put yellow text on a white background or anything like that, but definitely consider the colors that you’re using for your clients’ website design and make sure there’s enough contrast between them. People who are visually impaired or color blind could have a hard time reading things if there’s not enough color contrast.
Erin has a whole course on making websites (and social media) accessible, and I highly recommend it if you want to learn more about accessibility for your clients’ websites!
Add image alt tags
Image alt tags can also be called alt text or SEO description, depending on the platform, and Squarespace usually uses the file names as the alt text (which can be edited after the image is uploaded to the site). They describe what is in the image for anyone using a screen reader and for Google to rank the photos in Google Images.
So image alt tags are important for both accessibility and SEO, especially if it’s for a product business or a visual business like photography where it’s really important to have the images rank well. You can incorporate keywords if it’s relevant, but above all, focus on describing what’s in the image.
To write a good alt tag, describe your image in a short phrase and don’t include a ton of commas, hyphens, or random keywords. For example, if the image is of a kitchen for your interior design client, write something like “Kitchen designed with teal backsplash, quartz counter tops, and white cabinets with silver accents in Philadelphia” and not something like “kitchen, kitchen design, interior design, Philadelphia, Pennsylvania designer, blue blacksplash, teal backsplash, green backsplash, white, white counters, white countertops.”
Mark pages as noindex
Alright, we’re getting into some more technical things now! This may sound counterintuitive, but you should mark some pages as noindex so Google doesn’t try to index and rank them.
Yep, you read that right! But I’ll explain why this is important. Most platforms for shops already mark pages like “Account” and “Cart” as noindex because they don’t need to rank. And if someone searches the name of a website, you want Google to show the most important pages first. So I recommend marking pages that you don’t want Google ranking or you don’t necessarily want people to see first as noindex.
It’s also personal preference, but I have the pages with my call calendar and freebies to sign up for my email list marked as noindex because I don’t want just anyone to sign up for a call with me, and I want people to get to know my site at least a little before they decide to sign up for my email list. For pages like that, you might want to check with your clients before preventing them from ranking in Google.
To mark a page as noindex, it’s going to vary with every platform. On Squarespace, there’s a little toggle under the SEO options, for WordPress you can use a plugin like Yoast that has a little checkbox, and for Showit, you can add this code to the head html under Advanced Settings: <meta name=”robots” content=”noindex”>
Just look up the noindex process for each platform or contact me if you need more help!
Make sure the link structure stays the same (or set up redirects)
The last thing you want to happen when you launch your client’s new website is for it to have a bunch of broken links and 404 errors that could affect the site’s rankings.
So when you’re setting up new pages, make sure you keep the link structure the same (like keep it example.com/contact and don’t change it to example.com/contact-me). If there is a page that’s completely changing and the link structure doesn’t make sense anymore or if the client wants the link structure to change, make sure you set up redirects from the old link to the new one!
Connect Google Analytics and Google Search Console
Launching a new site with Google Analytics and Google Search Console connected will help your clients start tracking data immediately, and Google Search Console will show them if there are any issues with pages not being able to rank.
It’s typically easiest if the client has the accounts created and just shares the tracking code for you to put it on the site, and then that’s it!
If combining web design and SEO just sounds like too much work on top of what you’re already doing for your clients or if you just aren’t interested in SEO, I can take it off your hands! I team up with website designers so you can get your clients’ websites optimized without having to do extra work. Check out my SEO collaboration page to get more information on how we can work together 🙂