HTML Kommentare

HTML-Kommentare sind Textabschnitte im HTML-Code, die vom Browser ignoriert werden und somit nicht auf der Webseite angezeigt werden. Sie dienen hauptsächlich dazu, den HTML-Code zu dokumentieren oder vorübergehenden Code zu deaktivieren, ohne ihn zu löschen. Kommentare sind nützlich, um den Quellcode für andere Entwickler*innen oder für sich selbst verständlicher zu machen.

1. Syntax von HTML-Kommentaren

HTML-Kommentare werden mit folgenden Zeichen eingefasst:

<!-- Kommentartext -->

Alles, was sich innerhalb von <!-- und --> befindet, wird als Kommentar behandelt und nicht im Browser angezeigt.

Beispiel:

<!-- Dies ist ein einfacher HTML-Kommentar -->
<p>Dies ist ein Absatz.</p>
<!-- Dieser Absatz ist sichtbar, der Kommentar nicht -->

In diesem Beispiel wird der Kommentar im HTML-Code ignoriert und nicht auf der Webseite angezeigt.

2. Verwendung von HTML-Kommentaren

2.1. Code dokumentieren

Kommentare sind ideal, um den Zweck bestimmter Abschnitte im HTML-Code zu erklären, insbesondere in größeren Projekten. Sie können beschreiben, warum ein bestimmter Code verwendet wird oder was ein bestimmter Abschnitt tut.

<!-- Navigation der Webseite -->
<nav>
    <ul>
        <li><a href="index.html">Startseite</a></li>
        <li><a href="about.html">Über uns</a></li>
        <li><a href="contact.html">Kontakt</a></li>
    </ul>
</nav>

Hier hilft der Kommentar, den Code zu strukturieren und anderen Entwickler*innen zu erklären, dass dieser Abschnitt für die Navigation der Webseite zuständig ist.

2.2. Code vorübergehend deaktivieren

Sie können HTML-Kommentare auch verwenden, um Teile des Codes vorübergehend zu deaktivieren, ohne ihn zu löschen. Dies ist besonders nützlich, wenn Sie Änderungen testen oder fehlerhaften Code debuggen.

<!-- <p>Dieser Absatz wird derzeit nicht angezeigt.</p> -->
<p>Dieser Absatz wird angezeigt.</p>

Im obigen Beispiel wird der erste Absatz aufgrund der Kommentierung nicht angezeigt, während der zweite Absatz sichtbar bleibt.

3. HTML-Kommentare und Browser

• HTML-Kommentare sind nicht sichtbar, weder im sichtbaren Teil der Webseite noch im Quellcode, den der Browser rendert.
• Kommentare beeinflussen nicht die Ladezeit oder Leistung der Webseite, da sie vom Browser ignoriert werden.

4. Best Practices für HTML-Kommentare

• Kurze, prägnante Kommentare: Halten Sie Ihre Kommentare so kurz wie möglich, aber dennoch verständlich. Lange Kommentare können den Code unübersichtlich machen.

  <!-- Hauptinhalt der Seite -->
  <main>
      <h1>Willkommen</h1>
      <p>Dies ist der Hauptinhalt der Webseite.</p>
  </main>

• Wichtige Informationen festhalten: Verwenden Sie Kommentare, um zu erklären, warum bestimmte Entscheidungen im Code getroffen wurden, insbesondere wenn sie nicht sofort verständlich sind.

  <!-- Dies ist ein Fallback für alte Browser -->
  <p>Your browser is outdated. Please update to a modern browser.</p>

• Nicht überkommentieren: Kommentieren Sie nicht jede einzelne Zeile, sondern nur komplexere oder wichtige Teile des Codes, die zusätzliche Erläuterungen erfordern.
• Sichtbarkeit von Kommentaren in Quellcode-Betrachtern: Beachten Sie, dass HTML-Kommentare im Quellcode der Webseite sichtbar sind, wenn Benutzer*innen die „Seitenquelltext anzeigen“-Funktion in ihrem Browser verwenden. Vermeiden Sie deshalb, sensible Informationen wie Passwörter oder API-Schlüssel in Kommentaren zu hinterlegen.

5. HTML-Kommentare innerhalb von Tags

Es ist nicht möglich, HTML-Kommentare innerhalb eines Tags zu verwenden, zum Beispiel innerhalb eines Attributs oder eines einzelnen Elements. Kommentare dürfen nur zwischen den HTML-Tags stehen.

Falsch:

<p <!-- Kommentar --> >Dies wird nicht funktionieren.</p>

Richtig:

<!-- Dieser Kommentar steht außerhalb des Absatz-Tags -->
<p>Dies ist ein korrekter Absatz ohne Kommentar im Tag.</p>

Häufige Fragen zu HTML-Kommentaren