Textformatierung (Markup) (UNB2)

Letzte Aktualisierung: 2007-02-23

Oft wird in Webforen und Weblogs ein reduzierter Umfang der auf Webseiten gebräuchlichen HTML oder eine eigene Formatierungssprache (häufig BBCode oder ähnlich genannt), die sich im Grunde daran anlehnt, verwendet. Diese Sprachen zeichnen sich oft besonders dadurch aus, universell und eindeutig zu sein, d. h. sie verwenden bestimmte Steuerzeichen von besonderer Bedeutung. In HTML sind das <, >, und &; in BBCode sind es v. a. [ und ]. Diese Steuerzeichen markieren Steuerwörter, die die eigentliche Funktion beschreiben. Um einen Text im Fettdruck hervorzuheben, wird z. B. die Notation <b>Text</b> bzw. [b]Text[/b] verwendet, Weblinks werden durch [url=http://google.de]Such mich[/url] dargestellt und für Aufzählungen sind oft gar so komplexe Ausdrücke wie [list][*]Erster Punkt [*]Zweiter Punkt[/list] nötig. Während diese Darstellung leicht zu parsen und wenig fehleranfällig gegenüber unbeabsichtigter Verwendung der Steuerzeichen ist, so ist sie doch für den Anwender nicht intuitiv zu verstehen und unübersichtlich zu lesen.

Einfacher wäre eine Textdarstellung, die stattdessen wenige Steuerzeichen aber keine Steuerwörter verwendet. Durch geeignete Wahl dieser Zeichen und deren Anordnung lässt sich eine Notation entwickeln, die dem beabsichtigten Formatierungseffekt bereits sehr nahe kommt und so auch in ihrer Rohform einfach zu lesen ist. Solche Formatierungen werden bereits in E-Mails und Newsgroups verwendet, in denen HTML-formatierte Inhalte oft nicht erwünscht sind, allerdings trotzdem der Bedarf nach einer einfachen „Textformatierung“ besteht, um z. B. Zitate abzugrenzen oder Begriffe hervorzuheben. Des Weiteren besteht in einer Anwendung wie Kommunikationsinhalten wohl auch kaum der Bedarf nach ausgeklügelten und absolut perfekten und universellen Design-Möglichkeiten, wie sie eher bei umfangreichen Webseiten mit einem gewissen künstlerischen Anspruch vonnöten sind. Hier geht es vielmehr darum, Grundstrukturierungen wie Hervorhebung, Verlinkung, einfache Aufzählungen und semantische Notationen wie Zitate oder Quelltextabschnitte anzubieten. Dabei sollen dem Benutzer die umfangreichen Möglichkeiten von CSS weder angeboten noch abverlangt, sondern statt dessen „Zitate“ und „Auflistungen“ bereits sinnvoll und einheitlich vorgestaltet werden.

Schaut man sich die Textauszeichnung in verbreiteten Wiki-Systemen an, sieht diese teilweise bereits relativ einfach aus. Weblinks werden durch das bloße Schreiben der URL gesetzt, Aufzählungen erhält man durch der Zeile vorangestellte * und eingerückte Textabschnitte schiebt man einfach ein paar Leerzeichen nach rechts. Um Text im Kursiv- oder Fettdruck zu formatieren, sind keine aus dem Englischen abgekürzten Steuerwörter („i“ für „italic“, „b“ für „bold“) nötig, sondern es werden eigene Zeichen verwendet, die im übrigen Text normalerweise nicht vorkommen.

Und so habe ich an folgende Steuerzeichen zur grundlegenden Textformatierung gedacht:

  • Weblinks werden generell ohne weitere Maßnahmen mit ihrer URL notiert. Das Protokoll entscheidet dabei über den Linktyp (http:, mailto:, xmpp:). Weblinks können auch ohne das Protokoll angegeben werden, sofern die Erkennung eindeutig ist (www.google.de). Bei Sonderzeichen im Link, z. B. Punkten, die sonst als Linkende erkannt würden, kann man die URL in [[...]] einfassen. Auf diese Weile kann Links auch ein anderer sichtbarer Text zugewiesen werden, hier habe ich die übliche Wiki-Schreibweise übernommen: [[www.google.de Such mich]]. Um Verweise auf Inhaltsseiten anzulegen, die durch einen eindeutigen Namen identifiziert sind, kann man auch diesen Namen als Linkziel verwenden: [[Hilfeseite]]. In diesem Fall kann auch ein Teil eines im Text vorkommenden Worts als Linkziel verwendet werden, wobei trotzdem das gesamte Wort als Linktitel verwendet wird: [[Hilfeseite]]n.
  • Grafiken und Bilder werden prinzipiell genauso eingefügt wie Weblinks, nur dass das Programm hier an der Dateiendung (z. B. „.jpg“) erkennt, dass es sich um ein Bild handelt, und es entsprechend darstellt. Es wäre auch denkbar, diese Links direkt nach dem Verfassen zu analysieren und anhand des vom entfernten Webserver zurückgegebenen Dokumenttyps eine Entscheidung über die Darstellung zu treffen und bei dieser Gelegenheit ggf. auch gleich eine verkleinerte Vorschauversion vorzuhalten und einen Weblink auf das Originalbild zu setzen. Mittels [[http://link/zum/bild Text]] kann zusätzlich ein Alternativtext oder ein Bilduntertitel angegeben werden.
  • Kursivdruck als einfache Hervorhebung wird mit //Text//, Fettdruck als stärkere Hervorhebung mit **Text** dargestellt. Diese Schreibweise lehnt sich an die bereits häufig gebräuchliche Notation mit *...* und /.../ an, ist durch die Verdoppelung der Steuerzeichen allerdings stabiler gegen unbeabsichtigte Verwendung, wie sie mit *g* oft bei Anmerkungen und mit / bei Verzeichnisangaben auftritt. Textunterstreichung ist aufgrund der häufigen Verwechslung mit Links nicht vorgesehen.
  • Festbreite wird mit {{Text}} dargestellt. Diese Formatierung kann beliebig mit den oben genannten kombiniert werden. Wird dies nicht gewünscht, weil im Text z. B. die dabei verwendeten Steuerzeichen vorkommen, kann man unformatierten Text mit {{{...}}} einfassen. URLs werden dann auch nicht mehr automatisch in Hyperlinks umgewandelt. Im Fall von Quelltexten ließe sich an dieser Stelle vielleicht auch eine sprachabhängige Syntaxhervorhebung anwenden.
  • Eingerückte Absätze erfordern gar keine spezielle Notation, sie werden einfach um eine bestimmte Anzahl Leerzeichen nach rechts verschoben. Um eine einheitliche und saubere Darstellung zu erzielen, wird pro 4 Leerzeichen oder einem Tabulator um eine logische Ebene eingerückt. Die Anzahl der Leerzeichen wird dabei auf die nächste 4 gerundet.
  • Tabellen sehen fast genauso aus, wie im formatierten Zustand: Eine Tabellenzeile wird in einer Zeile des Textes gehalten, ihre Spalten werden durch | getrennt. Dabei muss am Anfang und Ende der Zeile ebenfalls ein | stehen: |Erste Spalte|Zweite Spalte|Dritte Spalte|. Ein Tabellenkopf wird durch Abtrennen der ersten Tabellenzeile durch eine horizontale Linie, einer Reihe von mindestens vier Bindestrichen (----) allein in einer Zeile, erreicht.
  • Aufzählungen werden, wie bereits oft verwendet aber nicht überall unterstützt, durch *-Zeichen am Zeilenanfang eingeleitet. Ein * steht dabei für eine ungeordnete Liste, # wird für geordnete (nummerierte) Listen verwendet. Mehrere Listen können durch Aneinanderfügen mehrerer Listensymbole formuliert werden. Listeneinträge, die über mehrere Zeilen gehen, müssen in den Folgezeilen mit mindestens einem Leerzeichen oder Tabulator beginnen. So sehen diese Listen aus:
    * Erster Eintrag
    *# Erster nummerierter Untereintrag
    *# Zweiter nummerierter Untereintrag
    * Zweiter Eintrag
      über mehrere Zeilen
    Normaler Text nach der Liste
  • Da Dateianhänge nicht fest einem Beitrag zugeordnet, sondern mehr oder weniger unabhängig gespeichert werden sollen, lassen sich auch Verweise auf solche vom Benutzer hinzugefügten Dateien an beliebiger Stelle im Beitrag einfügen. Diese sehen zuerst so aus wie Weblinks, müssen jedoch immer in [[...]] eingefasst sein und mit „File:“ beginnen, um sie als Verweis auf eine lokale Datei zu markieren. Die systemweit eindeutigen Dateinamen werden dabei beim Hochladen der Datei automatisch vergeben. Ein Dateilink sieht z. B. so aus: [[File:MeinBild3.jpg Mein Bild]]

TODO:
• Zitate und Text-/Hintergrundfarbe sowie Schriftart/-größe fehlen noch
• Bildausrichtung am Rand: [[http://link/to/image rightalign Text]]

Um auch den weitergehenden Ansprüchen von Inhaltsseiten, wie sie in Wikis üblich sind, gerecht zu werden, lassen sich zusätzlich folgende Formatierungen verwenden:

  • Überschriften verschiedener Ebenen werden in ==...== eingefasst. Überschriften erster (höchster) Ebene erhalten 2 =, solche zweiter Ebene 3, usw. Eine Überschrift dritter Ebene sieht z. B. so aus: ====Überschrift====
  • Ein hierarchisches Inhaltsverzeichnis der auf einer Seite vorkommenden Überschriften der verschiedenen Ebenen lässt sich mit [[TOC]] (für Table Of Contents) einfügen. Eine geeignete Position für ein Inhaltsverzeichnis ist am Anfang der Seite oder nach einem einführenden Absatz, vor der ersten Überschrift. Von technischer Seite wird diese Position allerdings nicht eingeschränkt.
  • Weiterleitungen von einer Seite auf eine andere, wie sie z. B. in Lexika bei mehreren äquivalenten Begriffen verwendet werden, werden eingerichtet, indem der ganze Seiteninhalt nur aus einem Link auf die Zielseite besteht. Das kann ein Verweis auf eine interne Seite, angegeben durch deren Seitenname ([[Zielseite]]), oder auf eine externe Web-Adresse ([[http://zielseite.de]]) sein.
  • Seitenanker werden mit der Schreibweise [[=Ankername]] innerhalb einer Seite, bevorzugt direkt vor Überschriften, angelegt und ähnlich den Web-URLs innerhalb der Seite mit [[#Ankername]] und von anderen Seiten aus mit [[Seitenname#Ankername]] referenziert.

TODO:
• Read-More-Tag: „++++“ allein in einer Zeile. Gut für Ankündigungen, weiterer Text zum Aufklappen/Weiterklicken.
• Wie können diese Steuercodes im Inhalt verwendet werden? Nur mit {{{...}}}?
• Link auf Datei-Seite: [[:File:filename.ext]]
• Tabelle mit Beispielen als Schnellüberblick der Schreibweisen

Um die hier beschriebenen Textformatierungen so robust wie möglich zu machen und unter manchen Bedingungen die Lesbarkeit zu verbessern, wird über zusätzliche Leerzeichen innerhalb und um diese Steuerzeichen hinweggesehen. So dürfen vor und nach Anweisungen, die allein in einer Zeile stehen müssen, Leerzeichen vorkommen und auch [[ http://seite.de ]] ist zulässig.

Einsatz eines Vorschaueditors

Alternativ kann ich mir auch die Verwendung eines einfachen Vorschaueditors vorstellen. Die Unterstützung durch Browser wird immer besser und ein Konzept finde ich besonders interessant: Anstatt die visuelle Formatierung im Beitrag komplett dem Autor zu überlassen, auf dass jedes Mal ein neues Kunstwerk entstehe, kann man dem Autor auch nur semantische Markierungen ermöglichen, mit denen er Überschriften, Zitate, Hervorhebungen und eben auch abstrakte Strukturierungen wie Aufzählungen ausschließlich in ihrer Bedeutung, nicht ihrem Aussehen angeben kann. Die eigentliche visuelle Darstellung wird vollständig erst durch das Design festgelegt und ist somit einfach an verschiedene Verwendungszwecke anpassbar. Dafür gibt es bereits einen verwendbaren Editor (hier gefunden).