Everything in the correct order – the logical structure of a webpage

What are websites made of?

Websites are files in HTML. While you see interface elements, texts, images, or videos in the foreground, everything in the background is code. “The HTML“ (actually “the Hypertext Markup Language“) provides the structure and content of the page; it forms the framework and the foundation.

To make the page look good, HTML is complemented with CSS (Cascading Style Sheets), which define the appearance of individual HTML elements. For functions and dynamic effects, JavaScript is additionally added.

Imagine the browser as a slide projector into which you insert the website code like a slide. It interprets HTML, CSS, and JavaScript and displays the website according to the specifications.

In theory, a website made of purely HTML – completely without CSS and JavaScript – would already work. It would be readable, containing text formatting, images, and links. But it would be 'completely bare' and unstyled. We would definitely perceive such a pure website today as amateurish and ugly. In the early 90s, such pure websites were still common. Often, the code was even typed character for character into text editors before HTML editors became available. These first pure websites already served the purpose of providing information in a reasonably readable format (albeit not very appealing) and linking to other pages via hyperlinks. The aesthetic standards of graphical design were much lower back then. For a long time, there were even enthusiasts who insisted that it’s only about the content and not about the 'cinema' in the web. Even long after the advent of graphical HTML editors, these purists held on to their beloved minimalism.

There is a world of difference between those early standards and today’s expectations. Today, especially the 'look and feel' of a website counts; the stylish and appropriate design across various devices. This makes the technical complexity enormous, so that hardly any websites are handwritten by themselves anymore; instead, ready-made components, frameworks, and libraries are used.

Nevertheless, the clean structure of your website's HTML code still counts! That’s why you cannot afford to give up 'inner logic'.

How are websites structured?

The proper structure of a website includes logically appropriate markup for content. These describe the structural meaning, also called the semantics of a website. Browsers respond to this with standard formats. That’s why even the unstyled pure websites of the 90s had some form of design, because browsers rendered the code according to a general standard.

Standards for interpreting pure HTML in browsers:

• A heading is highlighted because it is more important than normal text.
• A first-level heading (H1) is larger than second, third, or fourth level headings. These decrease in size according to their importance.
• Bold text indicates importance and is therefore emphasized.
• Quotes are italicized and thus recognizable as quotations.
• Lists have indentation with list points or numbers.
• Links are blue and underlined; visited links turn violet.

This is still the standard today, although this is not seen in this pure form anymore. It is overlaid by a more elaborate, elaborately designed facade. But the facade is not everything!

Why is it important to adhere to correct semantics?

Search engines are not interested in the superficial facade of a website! They look inside the HTML and try to understand the meaning of the components and the logic of the content. A correctly structured website allows the search engine to recognize what it is about and what is important by analyzing the HTML structure.

What does the inner logic mean for the maintenance and layout of a website?

Our clients have editing rights only for the content area of the website. This part is part of the HTML framework. The remaining parts are only editable by the web designer. This way, our clients cannot accidentally break anything.

We recommend our clients to pay attention to correct logic when building content:

If you follow these guidelines, you can relax. We will take care of the rest. We ensure that an attractive facade is visible and that all formatting is appealing, without you having to worry about it. You simply choose the correct HTML element – the right layout, font, color, and font size are already included! Thus, we help you create logically structured, search engine-friendly content in a stylish layout for your website!

Erstveröffentlichung am 25.04.2020