Dies ist eine alte Version des Dokuments!

HTML - eine Beschreibungssprache für Dokumente im Web

HTML (Hyper Text Markup Language) ist also eine Art Sprache, mit welcher einfache Webseiten erstellen und in einem Browser angezeigt werden können. Diese Sprache ist eine Beschreibungssprache (WYSIWYM = What you see is what you mean), um Inhalte fürs Web darzustellen. Aber HTML ist keine Programmiersprache, denn HTML hat keine Befehle, es werden auch keine Schleifen oder Bedingungen, sprich kein Algorithmus programmiert. Dies ist ein erheblicher Unterschied.

Typisch an HTML ist, dass sogenannte Tags (sprich «täg», englisch für Etiketten) verwendet werden, um die Inhalte einer Webseite zu kennzeichnen, sodass der Browser weiss, wie diese dargestellt werden sollten. Dies bedeutet, dass die darzustellende Seite strukturiert wird in header, navigation, main, footer etc. und in diesen Strukturelementen unter anderem noch mit Tags der Inhalt der Website dargestellt werden kann. Ein Tag hat immer einen Namen (zum Beispiel p für Paragraph) und wird in spitzen Klammern (< und >) dargestellt. Einige Tags fungieren als eine Art Behälter, die Elemente enthalten. Jeder Tag hat ein Anfangselement (beispielsweise <p>) und dann beginnt der Absatz (Paragraph), danach wird der Inhalt des Abschnitts dargestellt und darauf folgt zwingend ein Endelement, welches mit einem Schrägstrich gekennzeichnet ist (beispielsweise </p>) und das Ende des Abschnitt kennzeichnet. Im folgenden Beispiel wird der Tag <p> eingesetzt, um dem Browser mitzuteilen, dass alles zwischen dem öffnenden Tag <p> und dem schliessenden Tag </p> zum selben Paragraphen gehört:

<p> Hier steht ein Absatz (paragraph), der immer auf einer neuen Zeile beginnt. </p>

Grundstruktur eines HTML Dokuments

  Repl.it
  Grundgerüst von HTML
  Die wichtigsten HTML-Tags
  Grundgerüst von HTML
  Überschriften
  Textabsätze (Paragraphen)
  Zeilenumbrüche
  Aufzählungen
  Nummerierungen
  Horizontale Linie
  Tabellen
  Links
  Bilder
  Textdekorationen
  Div-Elemente
  Cheatsheet
  HTML für den Inhalt und CSS für das Design
  Einbinden einer CSS-Datei
  CSS-Referenz
  Texte formatieren
  Farben
  ID- und Class-Attribute
  Position

  Projekt:
  Bootstrap
  Projektrahmen
  Beispiel