In the future, I will publish all posts not here, but on my "Panorama Perspectives" Blog! Make sure to check it out.

To my blog
SEO is an incredibly important topic in web development!
Being well-positioned on Google (or other search engines) is undeniably a crucial goal for a website. Improving your website's position from 8 to 4 in a Google search can lead to an average of four times more visitors, and if you reach position 1, it's an additional twelvefold increase! [1], [2]

In this series of posts, I want to show you what you can do to optimize your site for search engines.

Each post will explain a "to-do" for your website's SEO.

The prerequisite is always that the absolute basics of your website are in place! This means you have relevant content, well-written texts, appropriate keywords for your target audience in your texts, and a clear and appealing website design. This also includes a proper navigation system to make all content easily accessible. If these basics are not in place, further tricks won't do much for your SEO.

Let's start with To-Do #1 for your SEO - Naming Images & Alternative Texts!

Naming Images

When you use images on your website, search engines use the file name to understand the image's content.

So, avoid using generic file names like "image1.webp" and opt for descriptive file names like "red-sports-car-exterior.webp".

Alternative Texts

Just like file names, search engines also use alternative texts for images to understand the image's content.

Moreover, screen readers use the alternative text to read or explain the website to people with visual impairments, for example.

So, using alternative text for images has only advantages!

It should precisely and concisely describe the image, e.g. "Red sports car at sunset".

On web pages, images are embedded in HTML like this:

<img src='folder/to/image/image-name.webp'

You can add the alternative text through the "alt" attribute, and it looks like this:

<img src='folder/to/image/image-name.webp' alt='Alternative Text'

Caution

Overly long file names or alternative texts can be negatively evaluated by search engines. So, try to be precise and avoid using unnecessarily long names and texts, even if it means you could use more "keywords." Search engines don't like this "keyword stuffing" at all!

Example

Short, generic image naming without alternative text

Bad because: Generic file name, no alt text

Excessively long image naming and alternative text, keyword stuffing

Bad because: "Keyword stuffing," negatively evaluated

Optimal image naming and alternative text

Exactly right!

Markdown

Even if you don't write your web pages directly in HTML but use Markdown, you can still use alternative text!

(Markdown is a simple text formatting language used to structure text with formatting such as headings, lists, and links and can be automatically converted to HTML)

It looks like this:
Inserting images with alternative text in Markdown

Sources

[1] Granka, Joachims & Gay. Eye-Tracking Analysis of User Behavior in WWW Search. 2004.
[2] Beus. Click-through Rates in Google SERPs. 2015.

Updated: