Vorheriger Artikel Nächster Artikel

Markdown: Simple Markup-Sprache für sauberes HTML und mehr

Im Gegensatz zu proprietären Formaten wie oder Pages hat schlichter Plaintext diverse Vorteile: Plaintext wird in jedem Editor, jedem Post, jeder und mit jedem Betriebssystem gleich gut dargestellt. Allerdings ist formatierter Plaintext wie z.B. XHTML im Quellcode oft ziemlich unübersichtlich. Hier kommt als einfache Auszeichnungssprache ins Spiel. Wie und warum Markdown eine flexible Alternative für strukturierte Texte sein kann, stellen wir euch im Folgenden kurz vor.

Markdown: Simple Markup-Sprache für sauberes HTML und mehr
Markdown-Editor für Mac: Mou

Flexibler Plaintext leicht zu lesen und zu schreiben

Markdown ist eine vereinfachte Auszeichnungssprache von John Gruber und Aaron Swartz unter BSD-Lizenz, die ähnlich einer Wiki-Syntax leicht zu lesen und zu schreiben ist. Vor allem im Web wird Markdown oft verwendet von z.B. Content Management Systemen wie Drupal oder in Blogs wie Posterous, WordPress und Tumblr. Auch GitHub nutzt einen Markdown-Dialekt.

Ein Ziel von Markdown ist, dass schon der Quellcode überall ohne weitere Tools als Plaintext leicht lesbar ist. Daher verwendet Markdown für die Auszeichnung seiner Elemente vor allem Auszeichnungsarten, die aus Plaintext und E-Mails bekannt sind. Auch andere ähnliche leichte Auszeichnungssprachen wie reStructuredText oder Textile hatten Einfluss auf die Markdown-Syntax.

Markdown Syntax Cheatsheet

Wer schon mal versucht hat, mit Word HTML-Seiten zu exportieren, weiß sicher einen weiteren großen Vorteil von Markdown zu schätzen: Aus Markdown ist es leicht möglich, sehr sauberes ohne überflüssig verschachtelte und ungeschlossene HTML-Tags zu generieren. Über Markdown-Erweiterungen wie MultiMarkdown sind auch andere Ausgabeformate wie PDF oder LaTex möglich. PHP Markdown Extra erweitert den Umfang von Markdown noch um zusätzliche Inline-HTML-Elemente.

Hier die Vorteile von Markdown auf einen Blick:

  • Einfache Syntax für Formatierung und beschleunigter Workflow über Plaintext.
  • Schnelle Formatierung ohne Overhead wie z.B. bei manuell gecodetem oder in WYSIWYG-Editoren erstelltem HTML.
  • Sauberes und schnell erzeugtes HTML.
  • Portable Cross-Plattform Dokumente mit kleiner Dateigröße, die in jedem Texteditor angezeigt und editiert werden können.
  • Flexible Ausgabeformate über HTML, Webposts, Richtext in E-Mails oder Textverarbeitungsprogrammen sowie Konvertierung in weitere proprietäre Formate wie PDF.

Tools für Markdown

Markdown ist eine generische Syntax für Plaintext und es bedarf eigentlich keines besonderen Tools für Markdown-Texte. Jeder normale Texteditor kann für Markdown-Syntax verwendet werden. Wenn man Markdown gern einfach in HTML konvertieren möchte, bietet sich die Referenzimplementierung als Perl-Skript an, die den Plaintext in HTML konvertiert. Außerdem gibt es einige extra Markdown-Texteditoren wie z.B. MarkdownPad für Windows oder Mou für Mac. Weitere Implementierungen sind in allen möglichen Programmiersprachen verfügbar wie z.B. WMD in JavaScript,  PHP Markdown oder BlueCloth in Ruby.

Markdown-Editor für Windows: MarkdownPad

Online kann man Markdown auf der Entwicklerwebsite von John Gruber als Markdown Dingus ausprobieren.

Markdown Online-Editor Dingus

Als Plugin für jeden Mac-Editor kann Markdown mit Multi-Markdown-Unterstützung über die Marked App für 3,99 US-Dollar installiert werden. Mit den Markdown Service Tools für Mac kann man sich Markdown Helferlein als OS X Services für alle Cocoa-basierten Anwendungen installieren. Für den Schnellzugriff auf die Markdown-Services lassen sich auch Tastaturkürzel konfigurieren.

Auszeichnungsbeispiele mit Markdown

Markdown verwendet für die Textauszeichnung überwiegend Satzzeichen. Übliche Formatbefehle werden mit einem Backslash maskiert. Das Sternsymbol (Asterisk oder *) am Zeilenanfang wird z.B. als Aufzählungszeichen interpretiert. Will man wirklich ein Sternchen schreiben, schreibt man einen Backslash davor: \*. Bei Bedarf an komplexeren Auszeichnungen kann man Markdown auch beliebig mit XHTML-Elementen mischen. Hier ein paar einfache Beispiele für die Formatierung mit Markdown:

Normaler Text wird dargestellt wie eingegeben.

Eine Leerzeile erzeugt einen Absatz.

*Kursiv*, **Fett** und ***Fett kursiv***

Markiert Text als `Quelltext`

# Überschrift in Ebene 1

#### Überschrift in Ebene 4

[t3n](http://t3n.de/ "t3n")

Alternativen und Erweiterungen zu Markdown

Markdown ist zurzeit sicherlich die am meisten verbreitete vereinfachte Auszeichnungssprache im Web. Aber es gibt noch ein paar ähnliche Alternativen und Erweiterungen:

  • reStructuredText: eine ähnliche vereinfachte Markup-Sprache.
  • Textile: eine weitere ähnliche vereinfachte Markup-Sprache.
  • Markdown Extra: erweitertes Markdown mit mehr Funktionalitäten.
  • MultiMarkdown: weiteres erweitertes Markdown mit mehr Syntax-Features und Exportoptionen.
  • Asciidoc: eine weitere vereinfachte Markup-Sprache die viele Dokumenttypen unterstützt.

Weiterführende Links:

Bildnachweis für die Newsübersicht: pippoapg / flickr.com, Lizenz: CC-BY

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
4 Antworten
  1. von Alex am 30.01.2012 (15:23Uhr)

    Das kommt ja wie gerufen. Schreibe gerade an einem Projekt indem Markdown zum Einsatz kommt. Und die JS Lösung kannte ich noch gar nicht.

    Antworten Teilen
  2. von Monika Steinberg am 30.01.2012 (15:24Uhr)

    @Alex Das freut uns! Weitere Tipps sind auch immer gern willkommen ;)

    Antworten Teilen
  3. von Alex am 30.01.2012 (15:36Uhr)

    Jetzt hab ich's! Auf webkrauts gab es auch einen Artikel zum Thema:
    Konzentriert und strukturiert Texten

    Antworten Teilen
  4. von Monika Steinberg am 30.01.2012 (15:38Uhr)

    @Alex Danke! Eine schöne Ergänzung! :)

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema E-Mail
Ink: Responsive E-Mail-Framework von den Foundation-Machern
Ink: Responsive E-Mail-Framework von den Foundation-Machern

Ink ist ein Open-Source-Framework, das dir dabei helfen soll responsive HTML-E-Mails für alle Clients zu erstellen und soll dabei selbst stets problematische Software wie Outlook 2000 versorgen. » weiterlesen

Canvas: Mächtiger Baukasten für schöne E-Mails
Canvas: Mächtiger Baukasten für schöne E-Mails

Canvas ist ein einfacher aber mächtiger Baukasten für responsive E-Mail-Kampagnen. E-Mails werden per Drag-and-Drop zusammengeklickt und können dennoch genau an die Empfänger angepasst werden. » weiterlesen

Mehr Produktivität, weniger Windows: Microsoft-CEO veröffentlicht internes Memo
Mehr Produktivität, weniger Windows: Microsoft-CEO veröffentlicht internes Memo

Der neue Konzernchef wechselt den Fokus von Devices und Services auf Produktivität für das Mobile- und Cloud-Zeitalter. In einer E-Mail lässt Nadella auch strukturelle Änderungen bei Microsoft … » weiterlesen

Kennst Du schon unser t3n Magazin?

t3n-Newsletter t3n-Newsletter
Top-Themen der Woche für Web-Pioniere
Jetzt kostenlos
anmelden
Diesen Hinweis verbergen