What Is HyperText Markup Language (HTML)?

Every web page is created using HTML code, and usually also CSS and JavaScript code. That makes HTML very important for all websites. We said earlier that HTML stands for ‘HyperText Markup Language’. Let’s break that down: HyperText means that you can add links to your web pages. These links can take you to related pages on your own website or other websites. They also let you jump from one part of the current page to another. Markup refers to special codes or tags that you can use to describe or define different parts of your document. They give instructions on how the text should be displayed or the type of content it is. In short, HTML is a language used to create the basic structure of a webpage.

Do You Need to Understand HTML to Create a WordPress Website?

In the early days of the internet, it was common to create static websites using HTML code. But that’s no longer the case. Most websites today are built using a website builder without needing to understand HTML code. WordPress is the most popular website builder and powers 43% of all websites. Instead of forcing you to use complex HTML tags to create paragraphs, headings, and more, WordPress provides an easy-to-use block editor. This allows you to build a web page by dragging blocks into the content area. For example, there are blocks for paragraphs, headings, lists, images, and much more. Another way to create web pages in WordPress is by using a drag-and-drop page builder plugin. These tools let you create custom WordPress website designs without writing any code. SeedProd is the best page builder plugin on the market, and it lets you easily create custom pages like landing pages, coming soon pages, and even complete custom WordPress themes. Whether you use the WordPress block editor or a page builder plugin, the HTML code needed for your website is created for you automatically behind the scenes. You can learn more about website builders vs. coding a website from scratch in our guide on how to code a website (complete beginner’s guide).

What Is the Difference Between HTML and CSS?

We mentioned that modern web browsers allow you to inspect the HTML and CSS code behind any web page. You may be wondering about the difference between the two types of code. HTML defines the structure and content of a web page but not how those elements look. That is the job of CSS, which stands for ‘Cascading Style Sheets’. CSS is a language that helps you style your website. For example, it will let the user’s web browser know the background color of the page, the color and size to display the headings and paragraph text, how to align the text, and much more. The WordPress theme you choose will define the CSS used for your website. However, you can change the appearance of your website by customizing the CSS code. You can learn more in our guide on how to easily add custom CSS to your WordPress site.

Was ist HTML?

Was ist: HTML

Hinweis der Redaktion: Wir erhalten eine Provision für Partnerlinks auf WPBeginner. Die Provisionen haben keinen Einfluss auf die Meinung oder Bewertung unserer Redakteure. Erfahre mehr über Redaktioneller Prozess.

HTML steht für „HyperText Markup Language“ und ist der Code, der zur Definition aller Seiten im World Wide Web verwendet wird. Er teilt Webbrowsern mit, wie der Inhalt von Webseiten angezeigt werden soll.

HTML-Kenntnisse sind zwar nützlich, aber für die Erstellung einer WordPress-Website nicht erforderlich.

Für fortgeschrittene Anpassungen und die Behebung von Problemen kann es jedoch hilfreich sein, zu wissen, wie man HTML bearbeitet.

Was ist HyperText Markup Language (HTML)?

Jede Webseite wird mit HTML-Code und in der Regel auch mit CSS- und JavaScript-Code erstellt. Das macht HTML sehr wichtig für alle Webseiten.

Wir haben bereits erwähnt, dass HTML für „HyperText Markup Language“ steht. Lassen Sie uns das aufschlüsseln:

HyperText bedeutet, dass Sie Links zu Ihren Webseiten hinzufügen können. Diese Links können Sie zu verwandten Seiten auf Ihrer eigenen Website oder anderen Websites führen. Sie ermöglichen es Ihnen auch, von einem Teil der aktuellen Seite zu einem anderen zu springen.
Markup bezieht sich auf spezielle Codes oder Tags, die Sie zur Beschreibung oder Definition verschiedener Teile Ihres Dokuments verwenden können. Sie geben Anweisungen, wie der Text angezeigt werden soll oder um welche Art von Inhalt es sich handelt.

Kurz gesagt, HTML ist eine Sprache, mit der die Grundstruktur einer Webseite erstellt wird.

Beispiele für HTML-Code

HTML verwendet ein System von Tags, die in spitzen Klammern eingeschlossen sind. Diese Tags definieren verschiedene Elemente, wie Absätze, Überschriften, Links, Bilder und mehr.

Hier sind einige Beispiele.

Jeder Absatz auf einer Webseite ist von Absatz-Tags wie diesem umgeben:

<p>This is a paragraph of text in HTML.</p>

Sie können auch HTML-Tags verwenden, um bis zu 6 Ebenen von Überschriften auf Ihrer Website zu erstellen:

<h1>This Is a Main Heading</h1>
<h2>This Is a Subheading</h2>

Sie können Links in HTML mit Hilfe von Anker-Tags wie diesem erstellen:

<a href="https://www.example.com">click on this anchor text</a>

Sie können einer Webseite auch Bilder mit HTML hinzufügen, indem Sie die URL des Bildes und eine Beschreibung wie diese angeben:

<img src="image.jpg" alt="A description of the image">

HTML-Markup kann für einen Anfänger schwierig aussehen. Sie fragen sich vielleicht, ob Sie HTML verstehen müssen, bevor Sie eine Website erstellen können.

Brauchen Sie HTML-Kenntnisse, um eine WordPress-Website zu erstellen?

In den Anfängen des Internets war es üblich, statische Websites mit HTML-Code zu erstellen. Aber das ist nicht mehr der Fall.

Die meisten Websites werden heute mit einem Website-Builder erstellt, ohne dass man HTML-Code verstehen muss. WordPress ist der beliebteste Website-Builder und macht 43 % aller Websites aus.

Anstatt Sie zu zwingen, komplexe HTML-Tags zu verwenden, um Absätze, Überschriften und mehr zu erstellen, bietet WordPress einen einfach zu bedienenden Block-Editor.

Damit können Sie eine Webseite erstellen, indem Sie Blöcke in den Inhaltsbereich ziehen. Es gibt zum Beispiel Blöcke für Absätze, Überschriften, Listen, Bilder und vieles mehr.

Eine weitere Möglichkeit, Webseiten in WordPress zu erstellen, ist die Verwendung eines Drag-and-Drop-Seitenerstellungs-Plugins. Mit diesen Tools können Sie individuelle WordPress-Website-Designs erstellen, ohne Code zu schreiben.

SeedProd ist das beste Seitenerstellungs-Plugin auf dem Markt. Mit ihm können Sie ganz einfach benutzerdefinierte Seiten wie Landing Pages, Coming Soon Pages und sogar komplette benutzerdefinierte WordPress-Themes erstellen.

Adding a headline to a custom landing page

Unabhängig davon, ob Sie den WordPress-Block-Editor oder ein Seitenerstellungs-Plugin verwenden, wird der für Ihre Website benötigte HTML-Code automatisch im Hintergrund erstellt.

Mehr über Website-Builder im Vergleich zur Programmierung einer Website von Grund auf erfahren Sie in unserem Leitfaden zur Programmierung einer Website (vollständiger Leitfaden für Einsteiger).

Hinzufügen oder Bearbeiten von HTML-Code in WordPress

Sie brauchen zwar keine HTML-Kenntnisse, um eine Website zu erstellen, aber einige HTML-Kenntnisse können bei der Behebung von Problemen auf Ihrer Website oder bei fortgeschrittenen Anpassungen sehr nützlich sein.

Wenn Sie den WordPress-Block-Editor verwenden, können Sie den HTML-Code für einen bestimmten Block anzeigen und bearbeiten, indem Sie „Als HTML bearbeiten“ aus dem Drei-Punkte-Menü auswählen.

Choose the edit as HTML option from the Options dropdown menu in the block toolbar

Es ist auch einfach, neuen HTML-Code zu einem Beitrag oder einer Seite hinzuzufügen.

Ziehen Sie einfach einen benutzerdefinierten HTML-Block auf den Inhaltsbereich und fügen Sie dann Ihren HTML-Code ein.

Paste the discord widget shortcode into the HTML block

Mehr dazu erfahren Sie in unserer Anleitung zum Bearbeiten von HTML im WordPress-Code-Editor.

Eine weitere Möglichkeit, HTML-Code auf Ihrer Website zu verwenden, ist das Hinzufügen von Sonderzeichen wie dem Copyright- oder Markensymbol.

In unserer Anleitung zum Hinzufügen von Sonderzeichen in WordPress-Beiträgen erfahren Sie mehr.

Vielleicht interessieren Sie sich auch für den HTML-Code, der auf anderen Websites verwendet wird. Moderne Webbrowser wie Google Chrome und Mozilla Firefox verfügen über integrierte Tools, mit denen Sie den HTML- und CSS-Code hinter einer Webseite überprüfen können.

Dies kann nützlich sein, wenn Sie nach Anregungen für Ihre eigene Website suchen. Sie können auch gefahrlos mit der Bearbeitung des Codes experimentieren, da sich dies nur darauf auswirkt, wie die Website in Ihrem eigenen Webbrowser erscheint.

Weitere Informationen finden Sie in unserem Leitfaden zu den Grundlagen des Inspect-Elements.

Was ist der Unterschied zwischen HTML und CSS?

Wir haben bereits erwähnt, dass moderne Webbrowser die Möglichkeit bieten, den HTML- und CSS-Code hinter jeder Webseite einzusehen. Vielleicht fragen Sie sich, worin der Unterschied zwischen den beiden Arten von Code besteht.

HTML definiert die Struktur und den Inhalt einer Webseite, aber nicht, wie diese Elemente aussehen. Das ist die Aufgabe von CSS, was für „Cascading Style Sheets“ steht.

CSS ist eine Sprache, mit der Sie Ihre Website gestalten können. Sie teilt dem Webbrowser des Benutzers zum Beispiel die Hintergrundfarbe der Seite mit, die Farbe und Größe der Überschriften und des Absatztextes, die Ausrichtung des Textes und vieles mehr.

Das von Ihnen gewählte WordPress-Theme definiert die für Ihre Website verwendeten CSS. Sie können jedoch das Aussehen Ihrer Website ändern, indem Sie den CSS-Code anpassen.

Weitere Informationen finden Sie in unserem Leitfaden zum einfachen Hinzufügen von benutzerdefiniertem CSS zu Ihrer WordPress-Website.

Wir hoffen, dass dieser Artikel Ihnen geholfen hat, mehr über HTML in WordPress zu erfahren. Vielleicht möchten Sie auch unsere Liste mit weiterführenden Artikeln über nützliche WordPress-Tipps, -Tricks und -Ideen lesen, die Sie weiter unten finden.

Wenn Ihnen dieser Artikel gefallen hat, dann abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Videotutorials. Sie können uns auch auf Twitter und Facebook finden.