Aktuelle Version vom 26. September 2014, 21:58 Uhr

In diesem Artikel wird auf die in der mediaWiki Software möglichen Elemente der Textgestaltung bezug genommen. Zunächst werden die gängigsten Textgestaltungselemente vorgestellt und im weiteren Verlauf um spezifische Elemente ergänzt.

Die hier aufgeführten Befehle beziehen sich auf den Standardeditor und den WikiEditor, welche über keine oder nur eine rudimentäre WYSIWYG-Funktion verfügen. Bei WYSIWYG-Editoren (wie der VisualEditor) muss zunächst in die Quellcode- / Code-Ansicht gewechselt werden.

Textgestaltung

Formatierung

Zu Beginn werden hier die Elemente der Textformatierung ^[1] vorgestellt.

Text fett hervorheben

Um eine Textpassage fett hervorzuheben muss diese von drei einfachen Anführungszeichen ''' umschlossen werden. Dabei leiten die ersten drei einfachen Anführungszeichen die Hervorhebung ein und die letzten drei beenden diese.

Beispiel: In dieser Textpassage soll etwas fett hervorgeheben werden.

Code: In dieser Textpassage soll '''etwas fett hervorgeheben''' werden.

Text kursiv schreiben

Damit eine Textpassage kursiv dargestellt wird, wird diese in zwei einfache Anführungszeichen '' umschlossen. Wie bereits beim Text fett hervorheben leiten die ersten zwei einfachen Anführungszeichen die Kursiv-schreiben-Modus ein und die abschließenden zwei einfachen Anführungszeichen beenden den Modus.

Beispiel: Eine Textpassage dieses Satzes wird nun kursiv geschrieben und zwar solange bis dieser Modus beendet wurde.

Code: Eine Textpassage dieses Satzes wird nun ''kursiv geschrieben und zwar solange bis dieser Modus beendet'' wurde.

Text fett und kursiv darstellen

Beide zuvor vorgestellten Gestaltungselemente können auch kombiniert werden. Dabei wird die Textpassage von fünf einfache Anführungszeichen ''''' umschlossen.

Beispiel: Es folgt eine Textpassage, in der nun Text fett und kursiv hervorgehoben wird um dies ein mal zu demonstrieren.

Code: Es folgt eine Textpassage, '''''in der nun Text fett und kursiv hervorgehoben wird''''' um dies ein mal zu demonstrieren.

Text unterstrichen darstellen

Um Textstellen zu unterstreichen muss dieser mit den Befehlen <u> </u> umschlossen werden.

Beispiel: Hier soll das unterstreichen von Textkomponenten demonstriert werden.

Code: Hier soll das <u>unterstreichen von Textkomponenten</u> demonstriert werden.

Text durchgestrichen abbilden

Ebenso kann Text auch als durchgestrichen dargestellt werden. Dies geschieht, in dem der betreffende Text zwischen <s> </s> oder Alternativ auch <strike> </strike> gestellt wird und ist nützlich um veraltete Informationen als nicht mehr gültig hervorzuheben.

Beispiel: Nerd sind ausschließlich männliche Personen. Weibliche Personen können keine Computer programmieren.

Code: Nerd sind <s>ausschließlich</s> männliche Personen. Weibliche Personen können <strike>keine</strike> Computer programmieren.

Text hochstellen

Gelegentlich ist es von nöten Text hochgestellt darzustellen, beispielsweise weil Anmerkungen in einem noch nicht veröffentlichten Artikel getätigt werden sollen. Dies wird mit dem Tag ^[2]  erreicht.

Beispiel: Diese Aussage enthält keine Aussage.^{Ist dem tatsächlich so?}

Code: Diese Aussage enthält keine Aussage.^{Ist dem tatsächlich so?}

Text tiefstellen

Text lässt sich auch tief stellen und kann ebenso wie das hochstellen zum Hinzufügen von Anmerkungen genutzt werden. Genauso wie für das hochstellen ist auch für das tiefstellen von Texten der Befehl in der Tag Syntax und lautet .

Beispiel: Nachts sind alle _{Was ist mit schwarz?} Katzen grau.

Code: Nachts sind alle _{Was ist mit schwarz?} Katzen grau.

Text vergrößern

Gelegentlich ist es notwendig die Schrift in einer Textpassage vergrößert abzubilden und diesen somit vom restlichen Text abzuheben. Möglich ist dies über den Tag <big> </big>.

Beispiel: Wir schreiben heute das frei sein groß!

Code: Wir schreiben <big>heute das frei sein</big> groß!

Text verkleinern

Genauso wie manche Textpassagen vergrößert hervorgehoben werden soll können analog dazu Textpassagen auch kleiner als der Rest des Textes dargestellt werden. Der hierfür notwendige Tag lautet <small> </small> und muss ebenso die Textpassage umschließen.

Beispiel: Manchmal möchte man einfach nur klein sein um nicht gesehen zu werden.

Code: Manchmal möchte man <small>einfach nur klein sein um nicht</small> gesehen zu werden.

Farblicher Text

Um bestimmte Textabschnitte andersfarbig vom restlichen Text abzuheben muss auf den HTML-Tag <span style="color:<Name der Farbe in Englisch>;"> </span> zurückgegriffen werden. Der Tag <span> </span> an sich hat keinerlei Wirkung und dient eigentlich nur dazu vordefinierte Cascading Style Sheets (kurz CSS) auf den entsprechenden Text anzuwenden. Die Umfärbung des Textes wird durch die Definition des Aussehens (engl. style) im sogenannten Attribut style="" erzeugt. Die Angabe der zu verwendenden Farbe kann in Hexadezimal, RGB, RGBA, HSL, HSLA ^[3] oder als Name stattfinden und ist durch das W3C festgelegt.

Hinweis: Das Umfärben von Textabschnitten mit Zeilenumbrüchen ist über den Tag <span style="color:(Farbwert);"></span> nicht möglich. Stattdessen muss dies mittels <div style="color:(Farbwert);"></div> erzeugt werden.

Beispiel mit <span></span>: Wir können unter anderem Text rot oder auch blue oder eben grün oder auch knallig orange einfärben.

Code: Wir können unter anderem Text <span style="color:red;">rot</span> oder auch <span style="color:blue;">blue</span> oder eben <span style="color:green;">grün</span> oder auch knallig <span style="color:orange;">orange</span> einfärben.

Beispiel mit mehrzeiliger Umfärbung (<div></div>):

Code:

Text mit andere Schriftart anzeigen

Um Text in einer anderen Schriftart darzustellen wird ebenfalls der HTML-Tag <span> </span> zusammen mit dem Attribut style="" verwendet. Über den CSS Befehl font-family:<Schriftart> ^[4] können andere Schriftarten eingebunden werden. Vollständig sieht der Befehl so aus: <span style="font-family:serif;"> </span>.

Hinweis: Es sollte nur in Ausnahmesituationen auf andere Schriftarten zurückgegriffen werden, da einerseits die Artikel möglichst einheitlich aussehen sollen und anderseits manche Schriftarten nicht auf jeden Betriebssystem verfügbar sind.

Beispiel:
Text in Times New Roman,
Arial,
Verdana,
Courier und
Serif

Code:

Text ausrichten

In manchen Situationen soll ein Textabschnitt anders als der Rest am Anzeigebereich auszurichten sein. Die Ausrichtung wird über den HTML-Tag <div> </div> erreicht. Die Steuerung der Ausrichtung erfolgt wieder als CSS Befehl im style="" Attribut und wird über text-align:<Ausrichtung>; ^[5] definiert. Die Ausrichtung kann dabei links- oder rechtsbündig sowie zentriert sein oder als Blocksatz dargestellt werden. Komplett sieht der Befehl wie folgt aus: <div style="text-align:(Ausrichtung);"> </div>. Der <div> </div> Tag ist ein HTML-Blockelement, d.h. dessen Wirkung erstreckt sich über einen komletten Textblock und kann mehrzeilig sein.

Hinweis: Wird die Ausrichtung eine Passage mitten im Textfluss verändert wird auch automatisch ein Zeilenumbruch mit erzeugt.

Hinweis #2: Die Textausrichtung kann auch über <div align="(Ausrichtung)"> </div> und <center> </center> erzeugt werden. Letzter Befehl zentriert den umschlossenen Text. Von der Verwendung dieser wird jedoch abgeraten, da beide Befehle laut dem W3C nicht von HTML 5 unterstützt werden. ^{[6] [7]}

Text linksbündig ausrichten (ist voreingestellt)

Code:

Text zentriert ausrichten

Code:

Text rechtsbündig ausrichten

Code:

Text als Blocksatz ausrichten

Beispiel:

Horizontallinie zur Abgrenzung nutzen

Um Inhalte optisch abzugrenzen bietet sowohl der mediaWiki- als auch HTML-Befehlssatz eine Möglichkeit horizontale Linien einzubinden. Der mediaWiki-Befehl lautet recht simpel ----, die HTML-Variante ist <hr />. Die HTML-Variante bietet sich an, wenn die Horizontallinie über das bereits bekannte HTML-Attribut style="" optisch ^[8] angepasst werden soll.

Beispiele: Die Horizontallinie mittels dem mediaWiki Befehl:

abschließend eine eingefärbte Horizontallinie mittels HTML-Befehl (über den mediaWiki Befehl nicht möglich!)

Code:

Anmerkung: Um mit dem mediaWiki Befehl eine Horizontallinie zu erzeugen muss dieser zwingend alleine in einer Zeile stehen. Der HTML-Tag (bzw. der Webbrowser) hingegen erzeugt automatisch einen Zeilenumbruch.

Wiki-Syntax bei einer Textpassage deaktivieren

In manchen Situationen ist es gewünscht, dass der mediaWiki-Parser eine Zeichenfolge nicht als mediaWiki-Befehl auffasst. Dies trifft besonders dann zu, wenn die mediaWiki-Befehle als Textzeichen benutzt werden sollen. Ein vom mediaWiki-Parser ignorierter Textabschnitt wird über den mediaWiki-Befehl <nowiki> </nowiki> erzeugt. Alle Befehle innerhalb dieses Befehls werden als normale Textzeichen interpretiert und ausgegeben.

Beispiel: Damit die Hochkommata '' keinen kursiven Text einleiten wird dieser Befehl genutzt. Es handelt sich dann nicht um einen ''mediaWiki-Befehl''.

Code: Damit <nowiki>die Hochkommata '' keinen kursiven Text einleiten wird dieser Befehl genutzt. Es handelt sich dann nicht um einen ''mediaWiki-Befehl''</nowiki>.

Überschriften

Um längere Texte leichter in Sinnabschnitte unterteilen zu können bietet auch die mediaWiki Software die Möglichkeit an Überschriften ^[1] zu benutzen. In der Standardeinstellung wird bei längeren Texten durch das mediaWiki anhand dieser Überschriften ein Inhaltsverzeichnis generiert, wodurch die entsprechenden Textabschnitte auch direkt angesprungen werden können. Die Überschriften können in sechs Ebenen tief gestaffelt werden.

Der Befehl zum Erzeugen einer Überschrift ist in der ersten Ebene ein einfaches =, welches den Überschritstext entsprechend umschließt. Tiefere Überschriftsebenen werden praktischerweise ebenfalls mit = eingeleitet, wobei die gewünschte Tiefe der Überschriftsebene der Anzahl der = entspricht.

Beispiele:

Überschrift 1. Ebene

Code: = Überschrift 1. Ebene =

Überschrift 2. Ebene

Code: == Überschrift 2. Ebene ==

Überschrift 3. Ebene

Code: === Überschrift 3. Ebene ===

Überschrift 4. Ebene

Code: ==== Überschrift 4. Ebene ====

Überschrift 5. Ebene

Code: ===== Überschrift 5. Ebene =====

Überschrift 6. Ebene

Code: ====== Überschrift 6. Ebene ======

Listen

Der mediaWiki Software kennt drei verschiedene Formen von Listen, Aufzählungen, nummerierte Listen und Definitionslisten. Die Verwendung von Listen bietet sich immer dann an, wenn kurzer Text geordnet und vom restlichen Text etwas abgehoben werden soll.

Aufzählungen / Aufzählende Liste

Aufzählungen bzw. Aufzählende Listen werden immer dann verwendet, wenn in irgendeiner Form eine einfache Auflistung stattfinden soll.

Anmerkung: Doppelpunkten : und Semikola ; haben in aufzählenden Listen eine Steuerfunktion und führen einen Zeilenumbruch (via Doppelpunkt) herbei bzw. heben im Falle des Semikolon den Folgetext fett hervorheben (siehe Beispiel).

Beispiel:

• Ananas

  Apfel

• Birne

  Erdbeere

  Lecker

• Kiwi
• Zitrone

Code:

Nummierte Liste

Um bei einer Auflistung eine strengere Hi­e­r­ar­chie hervorzuheben ist eine aufzählende Liste nicht ausreichend. Für diese Fälle bietet das mediaWiki die Möglichkeit nummerierte Listen zu benutzen. Diese können beispielsweise Helfen eine algorithmisches Vorgehen zu verdeutlichen.

Anmerkung: Doppelpunkten : und Semikola ; haben in nummerierten Listen eine Steuerfunktion und führen einen Zeilenumbruch (via Doppelpunkt) herbei bzw. heben im Falle des Semikolon den Folgetext fett hervorheben (siehe Beispiel).

Beispiel:

1. Telefonhörer abnehmen.

   Bei neueren Mobilfunktelefonen: Tastensperre aufheben.

2. Telefonnummer wählen.
3. Warten bis die Gegenstelle das Gespräch annimmt.
4. Gespräch führen.
5. Zum beenden des Gespräches den Telefonhörer auflegen.

   Bei neueren Mobilfunktelefonen

   Entsprechende Taste betätigen.

Code:

Definitionsliste

Definitionslisten werden vor allem in wissenschaftlichen Texten benötigt. Mit deren Hilfe können Definitionen strukturiert dargestellt werden. Anders als bei wikipedia werden Definitionslistenelemente die auf einem Doppelpunkt : folgen nicht automatisch eingerückt.

Beispiel #1:

Definitionsliste

Lebewesen: Organisierte Einheiten, die unter anderem zu Stoffwechsel, Fortpflanzung, Reizbarkeit, Wachstum und Evolution fähig sind.

Biomasse: Stoffgemische, die in Lebewesen gebunden und/oder von ihnen erzeugt werden

Code:

Beispiel #2:

Definition des Begriffs "Lebewesen"

Organisierte Einheiten, die unter anderem zu Stoffwechsel, Fortpflanzung, Reizbarkeit, Wachstum und Evolution fähig

Code:

Weitere Formatierungen

Um das wissenschaftliche Arbeiten zu erleichtern gibt es noch weitere Möglichkeiten Texte entsprechend auszuformatieren. Dies ist besonders dann wichtig, wenn wörtliche Zitate Verwendung finden, Gedichte analysiert werden sollen oder um bestimmte Sachverhalte für eine Diskussion anderwertig vom normalen Text hervorzuheben.

Textblock

Textblöcke bieten sich in der Regel dann an, wenn bestimmte Informationen vom restlichen Text abgehoben dargestellt werden sollen und wofür die einfachen textgestalterischen Mittel nur unzureichend geeignet sind. Ein häufiger auftretendes Beispiel ist die Ankündigung einer Veranstaltung innerhalb eines Nachrichtentextes bei der man sicherstellen möchte, dass sie auf den ersten Blick wahrgenommen wird.

Der Textblock kann auf zweierlei Arten erzeugt werden. Eine etwas umständliche Möglichkeit ist das Einrücken des entsprechenden Textes mit vier Leerzeichen     Text. Diese Möglichkeit empfiehlt sich meist nur bei einzeiligen Text. Umfasst der hervorzuhebende Text mehrere Sätze empfiehlt sich die Möglichkeit mittels des <pre> </pre> Tags.

Zu beachten ist, dass der Textblock am Ende der Zeile nicht automatisch umgebrochen wird. Ist der Text also länger als der anzuzeigende Bereich wird unter dem Block ein horizontaler Scrollbalken eingeblendet. Besonders problematisch ist dies im Verbund mit Bildern, die auf der selben Höhe des Textblockes abgebildet werden und für die der Textflussmodus aktiviert sein soll.

Beispiel für einzeiliger Textblock:

   Erste Zeile

Code:

Beispiel für mehrzeiligen Textblock:

Ein ganz simpler Textblock,
der über mehrere Zeilen geht

Und wenn dieser Block sehr viele Zeilen umfasst,
könnte das echt anstrengend werden,
wenn man jede Zeile mit vier Leerzeichen
erst einrücken muss.

Code:

Beispiel für einzeiligen Textblock, welcher über den Anzeigebereich hinaus geht:

   Dies ist ein Satz der sehr lang ist und über den Anzeigebereich hinaus geht. Es wird der erwähnte Scrollbalken eingeblendet, welcher eventuell nicht ganz schön ist. Vor allem könnte er auf mobilen Geräten Probleme bei der Darstellung erzeugen und umständlich zu bedienen sein. Probleme treten auf jeden Fall auf, wenn rechts vom Textblock auf selber Höhe ein Bild eingeblendet wird.

Code:

Zitate

Die Verwendung von Zitaten gehört zur Grundausbildung von [angehenden] Akademikerinnen / Akademikern und aus Fremdtexten übernommene Passagen müssen dementsprechend gekennzeichnet werden (weitere Informationen zum wissenschaftlichen Arbeiten siehe den Artikel Allgemeine Hinweise zum wissenschaftlichen Arbeiten).

Es gibt zwei unterschiedliche Befehle für das zitieren deren Unterschiede darin bestehen, dass das Zitat endweder im Satz steht oder nicht.

Beispiel zu einem Zitat im Satz: Ein „kurzer zitierter Text“

, auch mitten im Satz. Stattdessen kann man die Anführungszeichen auch direkt eingeben.

Hinweis: Zitate dieser Form werden über die Vorlage:" realisiert. Vorlage arbeitet momentan fehlerhaft

Beispiele zu freistehenden Zitat:

Code:

Beispiel #2:

Code:

Hinweis: Zitate dieser Form werden über die Vorlage:Zitat realisiert.

Formatierung Gedichten und ähnlichen Textformen

Soll im Text die in Versform vorliegen, wie Gedichte oder Liedtexte, abgebildet werden, wird empfohlen den eigens dafür im Befehlssatz des mediaWikis vorhandenen Tag <poem> </poem> zu verwenden. Dieser Formatiert die entsprechenden Zeilen.

Beispiel: Erste Strophe und er Refrain der Deutsche Arbeiter-Marseillaise von Jacob Audorf ^[9]

Code:

Codeblock

Mittels eines Codeblocks (<code> </code>) kann Text in Schreibmaschinenschrift dargestellt werden. Eine Alternative zum Befehl <code> </code> ist der Befehl <tt> </tt>.

Anmerkung: Zu beachten ist, dass Leerzeichen das Aussehen verändern. Darüber hinaus ist die Darstellungsform für Quellcode ungünstig. Es empfiehlt sich stattdessen die Darstellung mittels Syntaxhighlighting, da diese unter anderem auch eine Nummerierung der Zeilen sowie die farbliche Hervorhebung (das sogenannte Syntaxhighlighting) unterstützt. Sowohl <code> </code> als auch <tt> </tt> werden mittlerweile als veraltet betrachtet und sollten nach Möglichkeit vermieden werden, da die Untersütztung für diese Befehle auf Dauer nicht garantiert ist.

Beispiele: Mehrzeiliger Codeblock ohne vorangehende Leerzeichen mittels <code></code>

Prozedure Kekse() { Ausgabe: Du wollen Kekse? }

Code:

Mehrzeiliger Codeblock mit vorangehende Leerzeichen <code></code>:

HTML Grundgerüst: Anfang

  
   
  
  
   Ein Körper!
  
 

Ende

Code:

Mehrzeiliger Codeblock ohne vorangehende Leerzeichen mittels <tt></tt>

Prozedure Kekse() { Ausgabe: Du wollen Kekse? }

Code:

Mehrzeiliger Codeblock mit vorangehende Leerzeichen <tt></tt>:

HTML Grundgerüst: Anfang

  
   
  
  
   Ein Körper!
  
 

Ende

Code:

Quellcode mit Syntaxhighlighting

Unter Syntaxhighlighting ^[10] wird das Hervorheben von Befehlen der jeweiligen Sprache durch farbliche oder textgestalterische Elemente bezeichnet. Es bietet sich vor allem dann an, wenn mit real existierenden Programmiersprachen gearbeitet wird und Erklärungen oder Beispiele in einer dieser Sprachen dargestellt werden soll.

HTML-spezifische Befehle

Es ist möglich einige HTML-Tags ^[2] innerhalb der Artikel zu verwenden. Die Verwendung hat Vor- und Nachteile. So erweitern sie die Gestaltungsmöglichkeiten von Texten, stellen aber für NutzerInnen ohne HTML-Kenntnisse aber eine Hürde da. Zudem können HTML-Tags die Les- und Wartbarkeit des Artikelcodes beeinträchtigen.

Erzwungene Zeilenumbrüche

Manchmal kann es nützlich sein einen Zeilenumbruch per Befehl zu erzwingen. Der dafür notwendige Befehl lautet <br> bzw. in der XHTML-Schreibweise <br /> und steht für break. Der Befehl ist ein strikter unary Tag, also ein alleinstehender Befehl ohne schließenden Tag! Die Verwendung von <br></br> führt zu einem Zeilenumbrüche nach dem <br>, aber das </br> wird als normaler Text aufgefasst und angezeigt.

Beispiel: Dieser Text
soll Umgebrochen
werden</br>.

Code:

Anhand des Beispiels kann folgendes erkannt werden:

1. Der Zeilenumbruch wird nach
   (XHTML bzw. HTML5 Variante) und
   (HTML4 Variante) erzwungen.
2. Der Zeilenumbruch nach soll im Wikicode wird ignoriert, der Text wird also nicht in einer neuen Zeile angezeigt.
3. Der Befehl </br> bleibt wirkungslos und wird als normaler Text interpretiert.

Geschützte Leerzeichen

Geschützte Leerzeichen finden immer dann Anwendung, wenn ein Leerzeichen erzwungen werden soll. Ebenfalls werden diese genutzt um zu vermeiden, dass zusammenhängende Textteile durch einen Zeilenumbruch getrennt werden. Der Steuerbefehl dafür lautet &nbsp;.

Beispiele:
Mehrere Leerzeichen erzwingen:     4    Leerzeichen    

Code:

Beispiele für zusammenhängende Textkomponenten: Ein Beispiel, um zu verdeutlichen, dass 10 kg oder 100 t auch Dr. med. Soundso ebenso wie die 1 . 000 . 000 kt zusammenhängend bleiben.

Code:

Hinweis: Das letzte Beispiel zeigt nur die Verwendung nicht aber den Effekt an. Das geschützte Leerzeichen würde aber dafür sorgen, dass die zusammenhängenden Komponenten automatisch zusammen in der nächsten Zeile ausgegeben werden. Der Effekt lässt sich wegen den unterschiedlichen Bildschirmgrößen und daraus resultierenden Anzeigeweiten nicht genau simulieren.

Kommentare im Text

HTML Kommentare werden vom mediaWiki Parser ignoriert und können verwendet werden, wenn bestimmte Textpassagen mit Kommentaren versehen werden sollen. Die Verwendung sollte nach Möglichkeit nur in Vorlagen oder Seiten mit strukturellen Aufgaben genutzt werden, da in HTML ungeübte BenutzerInnen sonst wohlmöglich damit nichts anfangen können.

Beispiel: In diesem Satz ist ein Kommentar enthalten.

Code:

Einzelnachweise / Quellen

1. ↑ ^{1,0 1,1} Möglichkeiten zur Formatierung von Wikipedia-Artikeln auf de.wikipedia.org
2. ↑ ^{2,0 2,1} Beschreibung zu den an HTML / XML angelehnten Tags in der mediaWiki Software auf de.wikipedia.org
3. ↑ Übersicht des W3C aller Methoden zur Angabe von Farben im Web
4. ↑ Tutorial zu CSS Font auf der Seite des W3C
5. ↑ Beschreibung zum CSS Befehl text-align auf der Website des W3C
6. ↑ Beschreibung des center Tags (W3C)
7. ↑ Beschreibung zum align Attribut (W3C)
8. ↑ Tutorial zur optischen Gestaltung der horizontal rule <hr /> (CSS4You.de)
9. ↑ Deutsche Arbeiter-Marseillaise von Jacob Audorf auf de.wikipedia.org
10. ↑ Hinweise zur Syntaxhighlighting Erweiterung des mediaWiki Projekts auf de.wikipedia.org