Endlich Durchblick: HTML-Tags richtig einbauen

Bestimmt habt ihr es schon bemerkt: Manche Kunden möchten, dass ein Text mit HTML-Tags versehen wird. Aber was bedeuten Abkürzungen wie <h1>,<strong> oder <p> und welchen Vorteil bieten sie? Wir erklären euch die wichtigsten HTML-Basics.

Was ist HTML?

Die Abkürzung HTML steht für Hypertext Markup Language, zu Deutsch Hypertext Auszeichnungssprache. HTML sorgt dafür, dass Texte im Internet strukturiert angezeigt werden und nicht wie unübersichtliche, scheinbar endlose Fließtexte aussehen. Das funktioniert mit sogenannten Tags (Kürzeln), die in spitzen Klammern eingefasst werden. Es gibt in der Regel einen öffnendes und einen schließendes Tag. Das sieht so aus: <Befehl>Beispieltext</Befehl>

Die verschiedenen Tags können von Internetbrowsern gelesen werden und zeigen einen Text auf leserfreundliche Weise an.

Überschriften

Die Überschrift gibt dem Leser einen ersten Eindruck vom Text während Zwischenüberschriften meist einen Überblick über den nachfolgenden Abschnitt bieten.

Hauptüberschrift 1:<h1>Beispiel</h1>
So sieht es umgewandelt aus:

Beispiel

Zwischenüberschrift 1: <h2>Beispiel</h2>
So sieht die 2. Überschrift aus:

Beispiel

Absätze

Es gibt zwei Arten von Absätzen, mit denen ihr Textteile voneinander abgrenzen könnt. Absätze helfen dabei, dass Texte gegliedert werden und somit übersichtlicher wirken.

<p>: Dieses Tag sorgt dafür, dass ein neuer Absatz beginnt.

Beispiel in ausformulierter Form:

<p>Das ist der erste Absatz. Oft gibt der erste Absatz eine Einführung in das Thema.</p>

<p>Hier beginnt der zweite Absatz. Er geht meist mehr ins Detail.</p>

So sieht der Text mit Absätzen aus:

Das ist der erste Absatz. Oft gibt der erste Absatz eine Einführung in das Thema.

Hier beginnt der zweite Absatz. Er geht meist mehr ins Detail.

Zeilenumbruch

Möchtet ihr keinen Absatz machen, sondern nur einen Zeilenumbruch hervorrufen, benutzt ihr offiziell das Tag <br>Beispiel</br>. In verkürzer Form sieht das so aus: <br />

Beispiel in ausformulierter Form:

Manchmal will man, dass ein Satz oder ein Satzteil <br>erst in der nächsten Zeile beginnt.</br>

Hinterher sieht das so aus:

Manchmal will man, dass ein Satz oder ein Satzteil
erst in der nächsten Zeile beginnt.

Textstellen hervorheben

In HTML hat man verschiedene Möglichkeiten, Worte oder ganze Sätze hervorzuheben. Einige davon seht ihr hier:

Kursiv: Der Text wird schräg geneigt und damit auffälliger <i>Beispieltext</i>
Das ist der kursive Text: Beispieltext

Unterstrichen: Das Tag <u> unterstreicht den Text <u>Beispieltext</u>
In umgewandelter Form sieht der Text so aus: Beispieltext

Fett: Mit dem Tag <strong>Beispieltext</strong>sorgt ihr für einen dick gedruckten Text.
So sieht der fett gedruckte Text aus: Beispieltext

Aufzählungen

Es kommt vor, dass der Kunde Informationen kurz und knapp oder einfach in Stichpunkten ausgedrückt haben möchte. In HTML gibt es die Möglichkeit, Listen zu erstellen. In der Regel funktioniert das mit den Tags <ul> in welche die Tags<li>integriert werden. So entsteht eine Aufzählung mit Punkten. Ein weiterer Fall sind geordnete Listen mit Zahlen oder Buchstaben. Hier werden
<ol type="Zahl/Buchstabe">, und <li> verwendet.

Links

In manchen Texten soll auf eine andere Internetseite verwiesen werden. Dafür verwendet ihr den Tag <a href="Link">Text </a>. Achtung: Hier gehören unbedingt die Anführungszeichen hin!

Beispiel in ausformulierter Form: Auf <a href="//www.clickworker.com/">Clickworker</a> findet ihr verschiedene Aufträge.

So wird ein Link dann aussehen: Auf Clickworker findet ihr verschiedene Aufträge.

Ihr seht noch nicht klar im Buchstabendschungel? Hier geht’s zum Trainingslager!