How much is a website worth that does not attract visitors?
Nothing, I would say.

Of course, there is paid advertising, with which you can constantly bring users to your site or app — but it can also go much easier — with search engine optimization.

Ultimately, SEO is no substitute for paid advertising, as both are very different forms of marketing, but it is always a good idea to optimize your site a bit for Google and co.
Exactly this is not witchcraft and not only left to the content team behind a website; web developers should also know a few basics about SEO.

What is SEO? And what is it not?

SEO stands for Search Engine Optimization. So it is all about ranking your own website better on Google and co. If we enter something into a search engine, it will spit out heaps of results. But the order is not arbitrary; it is based on many factors that should be covered by a qualitative website.

SEO is pull-marketing. This is precisely why it is no substitute for paid advertising — because the latter is push marketing. With an improved ranking, we can better reach the people looking for us or our topic. So if we have a website that offers cosmetic products, our goal with good optimization should be that our website is displayed high up when people are looking for it.

This is incredibly powerful — after all, it allows us to reach people who are already willing to buy our product or use our website — what’s more, SEO does not usually cause running costs but is a one-time optimization.

On the other hand, Push-marketing means that we push something under the nose of people we assume are interested in it.

Types of SEO

The ranking of a website is defined by two factors — the optimization on the website itself and the optimization outside the website.

The former is called on-page SEO, the latter off-page SEO.

Optimizing our rankings in the search engines is outside of our own site; for example, it is about building referral links. These links then point to our site from other websites and make our site's credibility appear higher.

in this article, we only cover on-page SEO. This section can be broken down again into two areas, which I like to call as follows:

• Content SEO — that means adjusting the length of the content, keyword density, choosing good images, writing headlines that ensure a long reading time on the site.
• Technical SEO — this is about making the site technically clean so that it works well & fast and seems trustworthy for the search engines.

Structuring content, copywriting, and selecting images is not the job of a web developer — that’s why I explain in this article everything that belongs to technical SEO.

1. The correct use of heading-tags

h1, h2, and so on should be known to everyone — they serve as headings. Visually, they only differ in their font size — which can be adjusted with CSS anyway.
So it happens that web developers use h1 tags to define headlines — but that is an absolute nogo when it comes to search engine optimization.

h1 is the heading for the whole document. h2 and so on are subheadings — you should use them the same way.

• So an h1 tag should only occur once per page.
• h2, h3, h4, and so on may also appear several times.
• Note the arrangement. If an h1 and several h3 occur, there must be an h2 too — otherwise, the structuring makes no sense; it is incomplete.
• The next lower headline(s) should, of course, refer to the higher headline. You can subordinate several h2 to one h1, several h3, and so on.

So it’s not only about the visual appearance — make sure to use the headings in a meaningful structure.

2. Avoid trailing slashes

A very clear task for a web developer. The so-called trailing slash is a slash at the end of a URL resource, which is actually no longer necessary there.

Here is an example: codingcheats.io/javascript/ so the slash on the far right is the trailing slash. If we leave it out and open the page, we get to the same page — if everything is ok, the trailing slash should be redirected when calling the domain, so we get the URL without this slash. Here is an example of this:

Source: the author

I had exactly this problem with my page — whether with or without trailing-slash, the same page appeared — and according to some SEO tools, this is considered duplicate content.

Make sure that your web server removes trailing slashes — in Express.js; there is middleware for this; in PHP, you can use a trim function for this. If you are using a hosting service like Firebase or Netlify, this can usually be configured there or done by itself.

3. A good page structure

As a rule of thumb, all content on a website should be no more than two clicks away from the home page.

Again and again, it is also said that search engines also include the structure of a website, including the subpages in their evaluation. But even without the direct rating, a good, clear, and flat structure makes sense so that the user can find his way around and does not jump off again immediately.

4. A good link structure

We already had the structure of the individual pages; now it’s about the structure of the links and the structure of the URLs.

Basically, URLs should be human readable, contain keywords, but still be as short as possible.

A broad-based study shows this well — the best-ranked websites on google usually have very short URLs:

Source: Neil Patel

When I looked for this examination, I tested it myself. These are the URLs of the first two places in the ranking:

/de/blog/seo-urls//learn/seo/url

They are readable for humans, contain the keywords, are not long, but still, it is understandable what the articles are about.

5. Optimization for mobile devices

The outstanding part of the traffic that google gets comes from mobile devices. That’s why Google has officially announced that it prefers sites that are optimized for mobile devices — understandably, of course.

To offer a mobile site, there are different approaches — working with device-queries is one of them — but also here the loading time has to be considered because google tests the site also for mobile devices.

To achieve this, there is, for example, the mobile-first approach, in which the media-queries serve to provide a good experience for desktop devices.

But how this is implemented for a website should depend on the traffic and the device types of most users. Of course, it is important to offer the best possible experience for the majority of users.

6. Alt-tags und link titles

The alt attribute of an image tag should be known to most people — but it is not often used. It is a best practice because it helps search engines understand what your image is about. That this can only have a positive effect when you call up the first results for any keyword in the google image search — all top-ranking images have alt tags.

<img src="" alt="description of your image" />

even rarer than an alt-tag is the title-tag used for the description from the left — until a few weeks ago, I didn’t even know it existed.

Then I saw a warning in an SEO-tool that I should definitely use it. It can also be useful to provide search engines with more information about your content — because, besides a good ranking per se, we want to rank for the things that are really relevant for us.

<a href="" title="description of your link" />

As a web developer, you should make sure that both tags can be used — the concrete content is not really your task. If it is, make sure to write a short, readable description that includes the keywords.

7. Subdomain vs. Subdirectory

When you expand your website, you often come across this age-old conflict — should you use a subdomain or a subdirectory to add content to your website? If you are not quite sure what both are, here is an example — on my own site, I wanted to add a blog. There are two possibilities:

Subdomain: blog.codingcheats.io
Subdirectory: codingcheats.io/blog

From a technical point of view, a subdomain can be tempting since it is usually available for free and has its own DNS entries.

From Google’s side, it is said that both are treated the same. Nevertheless, there is always speculation.
Again and again, you read reports that your own site's ranking has shot up after switching from a subdomain to a subdirectory — but you have to be careful with such studies.

Surely most companies did not move their content from a subdomain without further changes — so I could imagine that such a move was made with a complete update of the site. So the other changes could be the real reason for the improved ranking.

One assumption that is still valid is that subdomains have their own domain-authority. So if you have content under your subdomain, it will not benefit from your primary domain's authority.

On the other hand, if your subdomain offers content on a completely different topic, this may be an advantage, at least that’s the assumption. How the truth is that only the search engine operators know, if at all.

It is good practice to have everything that belongs to the website's topic under the primary domain.

Amazon uses this principle — its cloud service AWS does not belong thematically to the purchase platform Amazon.com. Therefore it has the subdomain aws.amazon.com.

8. Make the page fast

In today’s internet, everything goes much faster than in the past — that’s why users are much more impatient than in the past — it’s about seconds, sometimes less.

The speed of the site can be included in your own ranking for two reasons:

• When the search engine searches your site for the first time to list it in its index, it can measure the loading time — and of course, it prefers sites with fast loading times.
• The bounce rate is the rate of users who leave the site after opening it with the search engine. Of course, everyone leaves a page at some point, so this is a matter of time — if the user finds your page via Google, opens it, and there is nothing to see yet due to the high loading time, he or she leaves immediately.
  Now that he’s back on the search results page, Google (or any other search engine) may find that the user has dropped out very quickly, i.e., is dissatisfied with the page — this will affect the ranking.

So the goal is that the page has visible content as quickly as possible — and that’s exactly what you can achieve with a few optimization tips:

• Make everything that is not above-the-fold secondary. This is about loading JavaScript, CSS, and also images. Everything that does not directly influence the first thing the user sees on the website is only secondary.
• This can be achieved, e.g., by using Async and Defer, which can drastically reduce the website's initial loading time.
• Also, CSS can be lazy-loaded or split up so well that no unused CSS is loaded on a page.
• Images are often unnecessarily large and can, therefore, still be compressed. Besides classical formats like PNG or JPEG, there are also new formats that are especially useful for the web.
• Use client-side caching to store resources that are loaded over and over again.
• Server-side caching. You can, e.g., design a cache for an API to save yourself the way from the app server to the API server. Also, in server-side-rendering, caching can be done so that the page does not have to be reassembled on the server for every request.
• Use a CDN. This can be used to distribute static content such as images or JavaScript libraries worldwide, thus keeping the loading time for each region as short as possible. A complete website can also be delivered via a CDN if it is static.
• Covering different client locations around the world can also work for more complex, non-static websites. With services such as Route 53 from AWS, users accessing a domain can be redirected to the nearest server depending on their location, keeping loading time to a minimum.
• Use server-side-rendering or static-generators instead of client-site-rendering. CSR has long been considered bad for SEO — but it’s not because of Google and co. CSR pages cannot be read — this used to be the case, but apparently no longer applies. Nevertheless, the first-contentful-paint for many CSR pages is much later than if you would use SSR or static conversion.
• Rethink the use of your libraries. Often unnecessarily large code heaps are used by third-party developers — in this case, a separate implementation, or at least a less complex alternative, would be much more reasonable.

This is what a web developer and anyone else who comes into contact with their website's technology should know about SEO.

Thank you for reading & good luck with your ranking!