TLDR; The website is built and designed with SEO in mind, and Atlas gives the content editor tools to edit the relevant parts of their page to optimise their website for search engines.
What is SEO?
SEO stands for ‘Search Engine optimisation’. SEO is the act of attempting to improve your search engine (Such as ‘Google’) rankings.
There are many different things that are involved when trying to improve your search engine rank, many of which are a service we do not provide. We do however, build websites that are SEO ready.
So, what does SEO ready mean then?
We ensure that the code behind the website is optimised for search engines. This means that when a search engine like Google looks are your site, it will pass any technical specification that is required.
What do you do to ensure the site is SEO ready?
Many things, ranging from design all the way through to development.
The most basic thing we do is ensure you, or an SEO specialist, can log into our own CMS(Content Management System) and start editing the relevant things to perform SEO on the website. Remember how we talked about SEO meaning attempting to increase your search engine rankings? We give you the tools to do that.
Some of these tools may sound confusing at first, but in this post, I’m going to explain exactly what we’ve done to make your site SEO ready, and how you can use these tools.
1. Design for SEO
Asides from making your site look and feel great, they also look out for some important aspects of SEO.
A few years ago, search engines didn’t even care about what the website looked like, but the game’s changed, and even designers need to be aware of SEO.
1.1 Font size, colour, and legibility
This comes down to the user experience of the site. Within SEO there’s a thing called ‘bounce rate’, which simply means when someone leaves your site without interacting with it. Having a high bounce rate typically means that search engines will not favor your site over a site with a lower bounce rate.
If your website’s text is illeggibile, then it’s very likely that your potential customers aren’t going to attempt to try and use the site, and move to a different one that’s easy to read. This is why it’s important that designers are very aware of font size, colour, and legibility.
1.2 Link spacing
Another point that is often overlooked. This relates back to the previous point, but touches more on the user interaction.
I can bet that almost everyone has experienced frustration with trying to click a link, then accidentally clicking the wrong one. Good news, this probably isn’t your fault, rather, the design’s!
If links are too close together, and you are on a low accuracy device, such as a mobile phone, then it’s very likely you are going to tap the wrong link. Which then causes you to use the back button immediately, which of course, is a bounce. Bad news for your SEO.
1.3 Internal linking
You know when you see things like ‘Other products you may enjoy’, or ‘related posts’? These aren’t just to get to to buy or read more, but are an important part of SEO. Links have a lot to do with how your site is ranked, and we ensure that any time another page is relevant to another, there is a dedicated place within the design for that to exist.
1.4 Duplicate content
Search engines HATE duplicate content. I’m sure your users do to. Although it’s up to the content creator/editor to minimise duplicate content, we do our best at the design and development stage to make sure this doesn’t happen.
Not everything is done because we have to
In our opinion, a lot of these things aren’t just for SEO, but for accessibility too. We would still do everything here even if it wasn’t required for SEO.
2. Meta - scary word
Within our CMS, you’ll find a tab on every page called ‘meta’. This is where all the hidden information about your site will go. Search engines use this metadata to help rank your site appropriately. Each bit of metadata is commonly known as a ‘meta tag’
The two meta tags that are most commonly used are ‘meta title’ and ‘meta description’.
The meta description is a very short summary of that page’s content. There’s much debate about how many exact characters this description should be. The correct answer is that there is none.
Google actually looks at each character’s physical width on the page and decides when to truncate the text so that it will fit on two lines within google search results. This is because each character has a different width, for example an ‘i’ is much shorter than a ‘W’. To ensure every single description for each of your search results fit on two lines, you’d need to make a defined character limit that could end up being much smaller to accommodate for a description of only “W’s”. We do not recommend doing this.
To see it in action search for anything on google and you’ll see that none of the descriptions of each result goes over two lines.
As a generic guideline, we recommend aiming for 150-160 characters.
Within our CMS (Atlas), we use the meta title to generate the title of your page. Probably not the title you’re thinking of, this is the title of the tab within the browser. This can be entirely separate to the heading of your page, or the same, it’s up to you or your SEO specialist to decide.
The meta title length uses the same technique as the meta description to decide it’s length, but this time so it fits on one line.
We recommend no more than 60 characters for this.
3. Alt tags
Again, not scary at all. This is used on image, and it simply means ‘alternate text’. Although computers are getting a whole lot better at recognising images there are currently no search engines that we know of that will do this for you. You need to tell the search engine what is in each image. This is extremely easy to do, and is often overlooked by most people who populate a website.
Not only is this important for SEO, but it’s even more important to ensure your site is accessible to everyone that visits it. For example, a person who is visually impaired may not be able to see that image clearly, or at all. In this case they will usually have some sort of software that will read the text on a website, and the best way that you can help with that, is to tell that software what to do when it comes to an image, which is read the alt tag.
To make this easier for our users of Alas, we’ve named this section ‘image description’.
H1 means the most important heading of your page.
In most cases when you use Atlas, you do not need to worry about this, since the developers will make the element with the highest visual hierarchy the H1, and in most cases this is what you want. If you have an SEO specialist involved, we will make sure they know which field in the CMS will be the H1 tag.
Not only is this important for semantic reasons, but sometimes search engines will not use your meta title tag for the title of the search result, but use the H1 if it deems it more applicable to that user’s search query.
5. Semantic markup
This relates back to the previous point. Alongside H1, there are also tags such as H2, H3 etc…
You can think of these as ‘main title’, ‘second title’, ‘sub title’, etc...
These need to follow a logical structure so that search engines can more easily understand the content on each page. Without a structure, it’s a lot harder to figure out the intention of each page. You want search engines to easily know what’s on your page so they can rank you higher for relevant search queries.
This is a similar thing to semantic markup. The URL(the bit at the top in the address bar), tells you a lot about the page.
It’s no good to have a URL that looks like https://example.com/blog/index?i=242
It’s much better to have a URL like https://example.com/blog/24-ways-to-do-a-thing
In our CMS you have the option to change the URI of each page, but usually the one that’s auto-generated when you create the page will be fine. Speak to your SEO specialist if you have any doubts.
7. Mobile friendly
We’ve reached a point where over 50% of users are using their mobile device to browse the web. That’s why it’s extremely important to make sure your website’s content is easily readable for people on mobile devices. Google has also started penalising search rankings if the site is not mobile friendly (commonly referred to as ‘responsive’; which is a method of creating a mobile friendly website, and is the technique we use).
6. Website load performance
Not only will a slow loading site frustrate your users, and potentially cause them to ‘bounce’(leave the site without performing any action), search engines are now taking this into account when ranking your site.
We do many things to ensure that your site loads as quickly as possible, these include but are not limited to:
- Script concatenation
- Script/style minification
- Image optimisation
- Even if you upload a massive image, we will ensure that it’s cropped and formatted correctly to reduce load times.
Website performance is also of huge importance because many users on a mobile device will be using a mobile data connection, which means it actually costs them to visit your site. On average 1MB of data will cost your user 1p. So if on page of your site consists of a large image slider, with lots of other images (like products etc.) without proper optimisation each of those images could be well over 2MB each! Which means if you have 20 images on your page, to load the images alone will cost your users 40p each just to see them! We try our best to keep the overall page weight to under 2MB for everything, although sometimes this can’t be helped. When using our CMS (Atlas), you don’t need to worry about this, since this will be done for you automatically.