HTML

HTML – Das Skelett deiner Website

Wenn wir über Websites sprechen, fallen oft Begriffe wie CSS, JavaScript oder PHP. Aber die absolute Basis, ohne die im Browser rein gar nichts angezeigt würde, ist HTML (Hypertext Markup Language). Stell es dir vor wie den Rohbau eines Hauses: HTML zieht die Wände hoch und definiert die Räume, bevor der Maler (CSS) oder der Elektriker (JavaScript) kommt.

Warum du HTML verstehen solltest

Auch wenn du heute moderne CMS-Lösungen wie WordPress nutzt und selten direkten Code schreibst, hilft ein Grundverständnis enorm. Manchmal zerschießt es dir das Layout, oder du willst ein externes Tool (z.B. für eMail-Marketing) einbinden. Da hilft es, wenn du nicht blind im Editor stocherst, sondern den Code lesen kannst. Es geht nicht darum, alles auswendig zu lernen, sondern Zusammenhänge zu erkennen.

So funktioniert die Sprache

HTML basiert auf sogenannten Tags. Das sind Befehle, die in spitzen Klammern stehen. Sie sagen dem Browser, was Text, was Bild und was Überschrift ist.

  • Start- und End-Tags: Ein Element beginnt meist mit <tag> und endet mit </tag>. Alles dazwischen wird vom Tag beeinflusst.
  • Verschachtelung: Du kannst Elemente ineinander packen. Ein Link kann zum Beispiel in einem Absatz stehen. Wichtig ist nur, dass du die Tags in der richtigen Reihenfolge wieder schließt, damit die Struktur sauber bleibt.
  • Attribute: Tags können Zusatzinfos haben. Ein Link-Tag <a> braucht zum Beispiel das Ziel href="...", damit der Browser weiß, wohin die Reise geht.

Die wichtigsten Tags für den Alltag

Selbst im Gutenberg-Editor rutscht man manchmal in die HTML-Ansicht, um Fehler zu beheben. Diese Tags begegnen dir dabei ständig:

  • h1 bis h6: Das sind deine Überschriften. <h1> ist die wichtigste (meist der Seitentitel), <h6> die kleinste. Für SEO ist eine saubere Hierarchie hier Gold wert.
  • p: Der klassische Absatz (Paragraph). Hier steht dein Fließtext.
  • a: Der Anker (Anchor) für Links. Ohne den wäre das Web keine Vernetzung.
  • img: Bindet Bilder ein. Wichtig hierbei ist das alt-Attribut, damit Google weiß, was auf dem Bild zu sehen ist.
  • ul, ol und li: Damit baust du Listen. ul für Aufzählungen, ol für nummerierte Listen, und li ist der jeweilige Listenpunkt.

Fazit für deine Website

Du musst kein Entwickler werden, um deine Seite sauber aufzusetzen. Aber zu wissen, dass hinter deinem visuellen Editor HTML werkelt, gibt dir Sicherheit. Wenn mal ein Absatz komisch aussieht oder ein Link nicht greift: Ein Blick in den Code-Editor (in WordPress oben rechts über die drei Punkte -> Code-Editor) löst das Problem oft in Sekunden.