How to Design an SEO Friendly Website That Ranks Well with Google
I’m here to walk you through all the aspects of what an SEO-friendly website should include. We'll cover a variety of topics, including how to create a website structure with the proper header hierarchy, mobile friendliness, accessibility, and much more.
A great design is null and void if your target audience can’t find you. Make sure you’re providing your clients with the best possible website you can create by ensuring you follow the key SEO aspects of your website!
Below is a simple checklist with 10 SEO recommendations for great website design that you may use the next time you start a design job.
1 - Heading Hierarchy
It’s super important for you to make sure that every single one of your web pages begins with a “Heading One". Make sure to include your keyword phrases within the heading. Now the heading that comes after a “Heading One” should always be a “Heading Two.”
If your web design has subheadings above “Heading One” or "Heading Two,”, then a little trick is to format the subheadings as paragraphs. This way, you won’t be messing with the expected heading hierarchy.
It’s best practise to now make sure the rest of your headings on your web page, go down the scale of ‘Heading Three', 'Heading Four', etc.
2 - Wordcount
How much content is on each page of the web pages you have designed?
I've seen websites with a large, beautiful hero image or video, but when you scroll down, there's almost no content and only a few headings.
In reality, your user has not been given enough information and value to progress through your website's customer journey. Google and other browsers realise this too, so you’ll need to make sure you are providing enough valuable content with keywords included so that browsers can show your website to the correct users.
There isn’t a set word count to stick to, but I would aim for at least 500 words.
3 - Social Sharing Icons
I want to point out that having social sharing icons included in your web designs is not going to directly affect your search engine ranking, but it is going to build brand authority and trust.
When someone visits your website, reads your blog post, finds it educational and interesting, and then reshares it to their account, you’re going to be utilising their audience. People are going to be clicking on that link and not visiting your website.
The extra traffic and time spent reading that blog is going to directly affect your SEO score. Next time you are designing blog post pages, make sure to include social sharing icons for your users.
I use AddThis to easily add social sharing icons to my blog posts—it's free and easy to use!
4 - Mobile Friendly Design
Your mobile-friendly design has a HUGE impact on your organic ranking online. The reason is that Google and other browsers are fully aware that a large percentage of people these days actually use their mobiles to search the internet.
Your website isn’t going to rank well if your design provides a crap mobile experience.
Things to remember when designing the mobile version of your website:
Clickable elements are not too close together.
Your text is not too small.
None of the content is wider than the screen.
5 - Accessibility
Accessibility is about how usable your website is for people of all abilities and levels of education. To make sure your website is as usable as possible, you need to ask yourself, "How can I design my website so that people can navigate their way around it without really needing to think about it too much?".
There are a lot of rules that us UX and web designers follow, so I recommend looking more into accessible design to ensure you are following the conventions that your users would expect.
6 - Fonts
I see websites that have 5+ different font families loaded. Fonts take time to load, so if you have an unnecessary number of font types, your website is taking longer to load than needed.
Page loading time has a direct effect on your organic search ranking. Scale your font choices down to 3, maximum 4 fonts. Simplicity is key, so don’t provide browsers with many fonts to load before your user has even had a chance to view your pages.
7 - Custom 404 page
A 404 page is the page your users will be directed to when they click on a broken link. The reason it’s a good idea to make a custom version of this page, is because you get the opportunity to turn it into a more positive experience.
You can create an engaging, eye-catching design that puts across your brand, and also redirect your users back to your homepage and give your users more information on what’s happened.
This overall creates a much better user experience, and in the long run, will have an effect on your search engine optimisation.
8 - Videos and GIFs
Videos are a great tool to use within your web designs because they have proven to engage your users for a longer period of time than photography or content.
Nevertheless, we have to find a happy balance here because GIFs take the longest time to load, videos are second, and then images. As page loading does have a direct effect on your search engine ranking, we want to ensure your page loading times are as fast as possible.
Don’t get me wrong; I’m absolutely not saying you shouldn’t include videos in your designs; they are an effective tool. Just keep them to a minimum.
9 - JavaScript Libraries
but we’re going to keep it real simple. When you’re designing your website, I’m sure you have lots of cool creative ideas, like animation, which will need some JavaScript to create.
Now that’s fabulous! The issue I am seeing is that designers are loading multiple different libraries in the backend that are totally unnecessary. Sometimes, I can see duplicates of the same JavaScript library.
As mentioned before, page loading time is key when building a positive search engine ranking score, and multiple JavaScript libraries are taking up a lot of that time.
Be careful, don’t duplicate your libraries, and use advanced CSS where possible.
10 - Image Size
I see this mistake so often. An image takes a very long time to load—more than 10,000 lines of code!
You need to make sure that they are already optimised for web use before you upload them to your websites.
That includes:
Decreasing the size
Updating the name
Make sure you are writing an ALT description for each image.
This process will have a huge impact on your search engine ranking and will provide a much better experience for your users.
I hope you found some helpful hints to incorporate into your design process here. When your designs are being developed, there are more SEO best practises to follow, so if you don’t develop your website yourself, make sure your web developer is implementing on-site SEO to provide your client with the very best website possible.
