<q>

Zuletzt aktualisiert am 4. Februar 2026

Das <q>-Element kennzeichnet ein kurzes Inline-Zitat im Fließtext. Browser fügen automatisch die passenden Anführungszeichen ein — du musst sie also nicht selbst in den Text schreiben. Im Deutschen werden typischerweise „…” (Anführungszeichen unten/oben) verwendet. Das ist der entscheidende Unterschied zu <blockquote>: Während <blockquote> für längere, eigenständige Zitate gedacht ist (als eigener Block), ist <q> für kurze Zitate innerhalb eines Satzes. Auf dieser Seite lernst du, wann <q> die richtige Wahl ist, wie das cite-Attribut funktioniert und worauf du bei verschachtelten Zitaten achten solltest.

Grundlagen

Wenn du im Fließtext jemanden zitierst — einen kurzen Satz, eine Phrase oder ein paar Wörter — ist <q> das richtige Element. Es macht den Text semantisch als Zitat erkennbar und sorgt dafür, dass Browser die sprachlich korrekten Anführungszeichen einfügen.

• <q> ist ein Inline-Element: Es fließt im Text mit und erzeugt keinen Zeilenumbruch
• Browser fügen automatisch Anführungszeichen ein — du schreibst sie nicht selbst in den HTML-Code
• Die Anführungszeichen richten sich nach der Sprache des Dokuments (lang-Attribut): Im Deutschen „…”, im Englischen ”…”
• Bei verschachtelten Zitaten wechseln die Anführungszeichen: außen „…”, innen ‚…’
• Das optionale cite-Attribut nimmt eine URL als Quellenangabe auf — die URL ist nicht sichtbar, aber maschinenlesbar
• Für längere, eigenständige Zitate (die als eigener Block dargestellt werden) verwende <blockquote> statt <q>

Syntax

<p>Goethe schrieb: <q>Auch aus Steinen, die einem in den Weg
gelegt werden, kann man etwas Schönes bauen.</q></p>

Attribute

Beispiele

Zitat mit Quellenangabe

Wenn du die Quelle eines Zitats angeben möchtest, kannst du das cite-Attribut verwenden. Die URL ist nicht sichtbar, aber Suchmaschinen und andere Tools können sie auslesen:

<p>
  Laut dem MDN Web Docs:
  <q cite="https://developer.mozilla.org">
    Das q-Element kennzeichnet kurze Inline-Zitate.
  </q>
</p>

Verschachtelte Zitate

Wenn innerhalb eines Zitats ein weiteres Zitat vorkommt, wechseln die Anführungszeichen automatisch. Im Deutschen: außen „…”, innen ‚…’. Das passiert ganz von selbst, wenn du <q>-Elemente verschachtelst:

<p>
  Sie erzählte mir:
  <q>Er hat gesagt: <q>Ich komme morgen.</q>
  Aber er kam nicht.</q>
</p>

q vs. blockquote

<q> ist für kurze Zitate im Fließtext, <blockquote> für längere, eigenständige Zitate. Hier der Unterschied:

<!-- q: Kurzes Zitat im Fließtext -->
<p>
  Einstein sagte einmal:
  <q>Fantasie ist wichtiger als Wissen.</q>
  Dieses Zitat wird oft in Vorträgen verwendet.
</p>

<!-- blockquote: Längeres, eigenständiges Zitat -->
<blockquote>
  <p>Die Definition von Wahnsinn ist, immer wieder das Gleiche
  zu tun und andere Ergebnisse zu erwarten.</p>
</blockquote>
<p>— Dieses Zitat wird oft Einstein zugeschrieben, ist aber nicht belegt.</p>

Barrierefreiheit

• Screenreader-Verhalten: Die meisten Screenreader erkennen <q> und kündigen den Beginn und das Ende eines Zitats an — z.B. “Zitat” vor dem Text und “Ende Zitat” danach. Das hilft Screenreader-Nutzern, Zitate vom umliegenden Text zu unterscheiden.
• Anführungszeichen nicht doppeln: Da Browser automatisch Anführungszeichen einfügen, schreibe keine zusätzlichen Anführungszeichen in den HTML-Code. Sonst erscheinen sie doppelt: „„Zitat"".
• cite-Attribut nutzen: Auch wenn das cite-Attribut für Nutzer nicht sichtbar ist, hilft es Suchmaschinen und assistiven Technologien, die Quelle eines Zitats zu identifizieren.

Häufige Fehler

• Manuelle Anführungszeichen mit q kombinieren: Der häufigste Fehler: <q>"Zitat"</q> erzeugt doppelte Anführungszeichen, weil der Browser seine eigenen hinzufügt. Schreibe einfach <q>Zitat</q> — die Anführungszeichen kommen automatisch.

• q für längere Zitate verwenden: <q> ist für kurze Zitate im Fließtext gedacht — ein Satz, eine Phrase. Für längere Zitate, die als eigener Absatz stehen sollen, verwende <blockquote>.

• cite-Attribut mit Autorenname statt URL füllen: Das cite-Attribut erwartet eine URL, keinen Autorennamen. Schreibe cite="https://example.com/quelle", nicht cite="Goethe". Für die sichtbare Quellenangabe verwende das <cite>-Element.

Browser-Kompatibilität

Das q-Element wird von allen modernen Browsern unterstützt. Die automatischen Anführungszeichen richten sich nach dem lang-Attribut des Dokuments.

Email-Kompatibilität

Die Unterstützung von q in Email-Clients ist eingeschränkt. Nicht alle Clients fügen automatische Anführungszeichen ein.

Verwandte Elemente