Zitate in HTML: Das umstrittene Q-Element
Dienstag, 22 Januar 2008 19:55 MET
Zitate im Fließtext
Zur Auszeichnung von Zitaten existiert neben dem Block-Element blockquote, welches oft missbräuchlich einfach für eingerückten Text verwendet wird, das Inline-Element q.
Das Q steht für quote
und sollte – im Gegensatz zu blockquote – im Fließtext für kurze Zitate verwendet werden.
Im Gegensatz zu blockquote ist das Inline-Element q allerdings nicht unumstritten.
Beispiel:
<p>Nebenbei wurde auch erwähnt, dass <q>der Abend sehr schön war</q> (<cite>Max Muster</cite>).</p>
Trifft ein Ausgabegerät auf dieses Element, sollte es damit ein Zitat kennzeichnen. Bei Browsern findet das durch automatisches Einfügen von An- und Abführungszeichen statt. Bei sprachlichen Ausgaberäten etwa durch spezielle Betonung. Andere Programme könnten aus Zitatauszeichnung auch Nutzen ziehen.
Da ich hier nun keine Einführung in HTML (Hypertext Markup Language) veranstalte, verweise ich im Quellenverzeichnis auf Artikel, die dieses Element sachgemäß erklären.
Das Element q ist nicht unumstritten
Hauptsächlich deswegen, weil der Internet Explorer bis einschließlich Version 7 nicht in der Lage ist, dieses Element wie vorgesehen darzustellen.
Der Internet Explorer erkennt zwar q als Element, stellt aber keine An- und Abführungszeichen hinzu. Das ist ihm auch nicht per CSS (Cascading Style Sheets) beizubringen, weil das Ding weder die Pseudo-Elemente :before und :after, noch das Attribut quotes kennt. Ansonsten lässt sich q allerdings durchaus mit allen anderen Möglichkeiten per CSS gestalten, also etwa in anderer Farbe oder anderem Schriftstil.
In den letzten Jahren wurden darüber viele Diskussionen geführt, Workarounds erfunden und Empfehlungen abgegeben.
Ein kurzer Überblick:
Mit oder ohne Q? Das ist hier die Frage.
Michael Jendryschik, dessen hervorragende Einführung in XHTML, CSS und Webdesign (auch als Buch erhältlich) ich sehr schätze und nur empfehlen kann, nimmt dort im Artikel zu Zitaten 1 eine interessante und sehr eindeutige Stellungnahme:
Die korrekte Kennzeichnung von Zitaten ist Semantik auf Zeichenebene und gehört damit zu den Aufgaben der Typografie, nicht der Textauszeichnung. Fragen werden ja auch mit einem Fragezeichen gekennzeichnet […] Michael Jendryschik 1
Diese Argumentation ist nicht von der Hand zu weisen und ich fühle mich für die Interpretation solcher Detail-Definitionen nicht berufen. Aber im konsequenten Schluss wäre das Element blockquote dann zur Auszeichnung von Zitaten auch nicht korrekt.
Jendryschik empfiehlt, vor allem im Hinblick auf die nicht vorhandene Unterstützung des Internet Explorers bis Version 7, auf den Einsatz dieses Inline-Elementes komplett zu verzichten und Anführungszeichen für Zitate manuell in den Fließtext zu integrieren.
Den Hinweis, dass das Element q im Arbeitsentwurf von XHTML2 auch nicht mehr auftaucht, kann ich allerdings nicht nachvollziehen. In den derzeitigen (Stand vom Datum dieses Beitrages) Arbeitsentwürfen für HTML5 und XHTML2 2 ist das Element weiter Bestandteil der Sprache.
Element einsetzen und manuell auszeichnen
Stacey Cordoni empfiehlt in einem vielbeachteten Artikel 3 auf A List Apart im September 2006 das q Element zwar einzusetzen, aber per CSS alle Anführungszeichen abzuschalten. Quasi Gleichstand mit dem IE (Internet Explorer) herzustellen. Zusätzlich sollte dann jeweils vor und nach dem Element manuell das An- beziehungsweise Abführungszeichen gesetzt werden.
Hier geht es also nur darum, das semantische Element korrekt einzusetzen und die Anführungszeichen dann manuell hinzuzufügen. Ich habe das damals schon für Unfug gehalten und bin immer noch davon überzeugt.
Eine durchaus zielführendere – mir aber auch wenig sinnvolle und praxisnahe – Methode wäre, innerhalb des q Elementes das Zitat noch zusätzlich in ein i Element zu betten. Damit wäre der IE auch ohne CSS mit unterscheidbarem schräggestelltem Zitattext bedient. Diese Methode kann auch im genannten Artikel bei Jendryschik 1 genau nachgelesen werden und wird auch dort als wenig sinnvoller Workaround kommentiert.
Nur per CSS für IE formatieren
Eine ganz radikale
Methode habe ich bis jetzt auf einigen Sites angewendet: Ich habe in der sowieso vorhandenen IE-Quarantäne-Datei, also per Conditional Comment nur vom IE geladen, das Element q per CSS mit schräggestellter oder weiter gestellter Schrift formatiert.
Altbewährt: Macken des IE mit Java-Script austreiben
Um dem Internet Explorer die Anführungszeichen beizubringen, gibt es bereits einige Scripts mit vielen Varianten und Unterschieden.
Hier zwei Lösungsansätze:
Gleich im Paket
Eine sehr elegante Lösung, die gleich andere Mängel des leidigen Internet Explorer mit anpackt, ist das IE7 (beziehungsweise jetzt auch IE8) Script von Dean Edwards 4. Dieser hat schon vor längerer Zeit damit begonnen, dem mangelhaften IE6 mit einer Art zentralen Java-Script-Bibliothek unter die Arme zu greifen.
Mittlerweile ist die Sache so ausgereift, dass diese Bibliothek gleich per Hotlinking – muss also nicht auf dem eigenen Server installiert werden – abgerufen werden kann. Damit kann der IE anschließend per CSS so angesprochen werden, als wenn er seine ganzen Bugs nicht hätte.
Angefangen von der richtigen Kombination von mehreren CSS-Klassen, bis zu den Pseudo-Elementen :before und :after und damit auch der korrekten Umsetzung des Elementes q, verhält sich der Internet Explorer dann ziemlich standardkonform. Natürlich nur mit eingeschaltetem Java-Script.
Einzellösung
Meistens werden die Unzulänglichkeiten des IE – vor allem der Version 6 und darunter – jedoch mit speziellen CSS-Dateien ausgeglichen oder umgangen. Die oben genannte Paketlösung
ist dann natürlich nicht angebracht, wenn nur das Q-Problem
gelöst werden soll. Hier bietet sich dann ein kleines Script für diesen speziellen Fall an.
Da der Mangel auch den IE7 betrifft und ich das Element q konsequent anwende dachte ich mir, dass ich für die Anwender dieses Programmes die elegantere Lösung per Java-Script zusätzlich einfüge.
Ich verwende ein bereits im August 2006 veröffentlichtes Script in einem Artikel von Gez Lemon auf Juicy Studio: Fixing Quotes in Internet Explorer.
Die Methode ist relativ simpel: Das Script wird per Conditional-Comment nur vom IE geladen, sucht nach q-tags und fügt dann sichtbare An- und Abführungszeichen hinzu. In den Kommentaren des genannten Artikels 5 findet sich auch noch eine Lösung für mehrsprachliche Auszeichnungen.
Fallback inkludiert
Zusätzlich lasse ich die CSS-Anweisungen im speziellen Stylesheet für IE – q {font-style: italic} – bestehen. Ist also Java-Script im Browser nicht aktiv, dann greift die Fallback-Variante, welche Zitate per CSS zumindest in schräggestellter Schrift anzeigt.
Die Wahrscheinlichkeit, dass ein IE-Benutzer sowohl Java-Script, als auch CSS ausgeschaltet hat und somit Zitate optisch vom Fließtext nicht mehr unterscheiden kann, halte ich für extrem niedrig.
Zurück zum richtigen
Leben
In der Web-Praxis bleibt das Besprochene so gut wie bedeutungslos und wird wohl nur von Geeks beachtet und umgesetzt. Aus zwei Gründen:
-
Wer oder welches Programm kennt das Element
qschon? Ich bitte um Hinweis, wenn Sie ein Texteditor-Programm kennen, das Anwender mit dem Inline-Zitat aktiv unterstützt. (siehe auch Textauszeichnungen in HTML mit Texteditoren.) -
Machen Sie mal einer Redakteurin oder einem Textverfasser – die nichts mit HTML oder Typo am Hut haben – klar, dass Zitate im Fließtext extra ausgezeichnet werden sollten. Das höchste der Gefühle ist das bekannte Zollzeichen. Mit einem guten Script, kann das dann zumindest in korrekte An- und Abführungszeichen umgewandelt werden.
Ich habe diesen Beitrag auch jetzt nur geschrieben, weil ich gerade die oben genannte Java-Script Lösung in dieses Blog implementiert hatte.
- Abschnitt 1 von 1
Quellenverzeichnis
- Zitate – Einführung in XHTML, CSS und Webdesign [jendryschik.de]
- HTML Elements Index [meiert.com] – auch Arbeitsentwürfe zu HTML5 und XHTML2
- Long Live the Q Tag – [Stacey Cordoni on alistapart.com]
- /IE7/ [dean.edwards.name] – Java-Script Bibliothek, um Internet Explorer Standardkompatibel zu machen
- Fixing Quotes in Internet Explorer [juicystudio.com]
Externe Verweise dieses Artikels wurden zuletzt am 22. Januar 2008 auf Relevanz geprüft.
- Datum:
- veröffentlicht am 22 Januar 2008, 19:55 MET.
- Artikel:
- Zitate in HTML: Das umstrittene Q-Element [hyperkontext | Weblog]
- Kurz-URL:
- http://hyperkontext.at/s/112
- Thema:
- Webgestaltung
- Stichworte:
- Browser, IE, IE6, IE7, CSS, HTML
Dieser Eintrag kann nicht mehr kommentiert werden.
Mögliche themenverwandte Artikel aus dem Weblog
Blättern (chronologisch)
- « neuerer Artikel
- Rezension: Little Boxes, Teil 2
- älterer Artikel »
- Mit FeedDemon kostenlos auf dem Laufenden bleiben
Angriff auf die Freiheit 