Überlegungen zur Verwendung von Markdown-Schreib-Apps auf statischen Websites

Avatar of Leon Barnard
Leon Barnard am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Wenn Sie einen Static Site Generator betreiben oder kürzlich darauf umgestiegen sind, werden Sie wahrscheinlich viel Markdown schreiben. Und je mehr Sie schreiben, desto mehr wünschen Sie sich, dass die Werkzeugerfahrung verschwindet, damit der Inhalt im Fokus steht.

Ich werde Ihnen einige Optionen geben (einschließlich meiner Favoriten), aber wichtiger ist, dass ich die Funktionen durchgehen werde, die diese Apps besonders relevant machen, wenn Sie eine Auswahl treffen. Hier sind einige wichtige Überlegungen für Markdown-Editor-Apps, die Ihnen helfen, Ihre Worte fließen zu lassen.

Überlegung Nr. 1: Getrennte Schreib- und Lesemodi

UX-Prinzipien sagen uns, dass Modi problematisch sind. Aber vielleicht gibt es eine Ausnahme für Textbearbeitungssoftware. Von vi(m) bis Google Docs scheinen separate Modi zum Schreiben und Lesen Autoren anzusprechen. Ebenso haben viele Markdown-Editoren separate Modi oder Ansichten zum Schreiben, Bearbeiten und Lesen.

Ich mag Markdown-Editoren, die ein nebeneinanderliegendes oder geteiltes Design bieten, bei dem ich beides gleichzeitig sehen kann. Markdown zu schreiben ist nicht dasselbe wie Code zu schreiben. Wie es aussieht, ist wichtig, und eine Vorschau kann Ihnen ein Gefühl dafür geben. Es ist ein bisschen so wie bei Static Site Generatoren, die automatisch neu laden, damit Sie Ihre Änderungen sehen können, während Sie sie vornehmen.

Wenn sowohl der Bearbeitungs- als auch der Vorschau-Modus gleichzeitig aktiv sind, können Sie sich stärker mit dem fertigen Produkt verbunden fühlen.

Im Gegensatz dazu bin ich kein Fan des Designs „ein Modus für alle“, bei dem die Markdown-Formatierung automatisch in formatierten Text umgewandelt wird und der formatierte Code verborgen wird (in irgendeiner Form implementiert von Dropbox Paper, Typora, Ulysses und Bear). Ich kann die Arbeit nicht ertragen, mit der App herumzufummeln, um beispielsweise eine Überschriftenebene zu ändern. Klicke ich darauf, doppelklicke ich, dreifach klicke ich? Was ist, wenn ich nur die Tastatur benutze?

Es ist nicht so sehr, dass diese Funktionen nicht nützlich sind, sondern dass sie meinen Fluss unterbrechen.

Ich möchte den gesamten Markdown sehen, den ich geschrieben habe, auch wenn der Endbenutzer ihn nicht sehen wird. Das ist eine Sache, die ich von Code-Editoren gerne in einen Markdown-Editor übernehmen würde.

Überlegung Nr. 2: Gute Themes

Einige Markdown-Editoren ermöglichen die vollständige Anpassung von Editor-Themes, während andere direkt schöne Themes mitliefern. Unabhängig davon denke ich, dass ein guter Editor genau das richtige Maß an Formatierung haben sollte, um normalen Text von formatiertem Text zu unterscheiden, aber nicht so viel, dass es Sie vom Lesen und Konzentrieren auf den Inhalt ablenkt. Selbst mit geöffnetem Vorschaufenster verbringe ich normalerweise die meiste Zeit mit der Ansicht des Editors.

Unterschiedliche Farben für jeden Stil

Da der meiste Text im Editor nicht so gerendert wird, wie er im Browser aussehen würde, ist es schön, schnell zu sehen, welcher Text mit Markdown formatiert wurde. Dies hilft Ihnen beispielsweise festzustellen, ob eine URL tatsächlich im Text aufgeschrieben ist oder ob sie innerhalb eines Hyperlinks verwendet wird. Daher mag ich es, für jeden Markdown-Stil eine andere Farbe zu haben (Überschriften, Links, Fett, Kursiv, Zitate, Bilder, Code, Aufzählungszeichen usw.).

Farben zeigen Ihnen, auf welchen Text eine Markdown-Formatierung angewendet wurde.

Auch Fett- und Kursivstile anwenden

Ich ziehe es vor, überall dort, wo ich kann, Sternchen für die Markdown-Formatierung zu verwenden (z. B. für Fett, Kursiv und unsortierte Listen). Daher ist es für mich hilfreich, über die Farbe hinaus zusätzliche Formatierungen zu haben, um Fett, Kursiv und Fett+Kursiv zu unterscheiden. Beim Überfliegen kann es schwierig sein, zwischen **dies ist wichtig** und *dies ist wichtig* zu unterscheiden, während **dies ist wichtig** und *dies ist wichtig* leichter zu trennen sind. Es hilft mir auch zu sehen, ob ich versehentlich Sternchen falsch kombiniert habe (z. B. **ist das wichtig?*).

Unterschiedliche Schriftgrößen für jede Überschriftenebene

Das mag etwas kontrovers sein und die Gemüter spalten. Code-Editoren zeigen keine unterschiedlichen Schriftgrößen innerhalb einer Datei an. Farben und Stile, sicher, aber keine Größen. Aber für mich hilft es.

Beim Schreiben ist Hierarchie der Schlüssel zur Organisation. Mit unterschiedlichen Schriftgrößen für jede Überschrift können Sie den Umriss dessen, was Sie schreiben, sehen, indem Sie ihn einfach überfliegen.

Das Anzeigen von Überschriften in unterschiedlichen Schriftgrößen ist eine subtile Möglichkeit, die Struktur zu visualisieren. Dies ist besonders hilfreich für lange Inhalte.

Tastenkombinationen und intelligente Tastaturverhalten

Ich erwarte, dass alle Standard-Tastenkombinationen, die in einem Texteditor funktionieren, auch hier funktionieren. STRG/CMD + B für Fett, I für Kursiv usw., sowie einige, die beim Schreiben von Artikeln nützlich sind, insbesondere STRG/CMD + (Zahl) für Überschriften. STRG/CMD + 1 für H1 usw.

Etwas zu einer Überschrift zu machen, sollte eine einfache Tastenkombination sein.

Aber es gibt auch einige Tastaturverhalten, die ich aus Code-Editoren mag. Wenn ich zum Beispiel Text auswähle und [ oder ( drücke, wird dieser Text nicht überschrieben, sondern mit dem öffnenden und schließenden Zeichen umschlossen. Gleiches gilt für die Verwendung von Textformatierungszeichen wie *, ` und _.

Ein guter Markdown-Editor überschreibt Ihren Text nicht, wenn Sie ihn auswählen und ein gültiges Markdown-Formatierungszeichen drücken.

Ich verlasse mich auch auf Tastenkombinationen, um Links und Bilder zu erstellen. Selbst nach mehr als fünf Jahren regelmäßigen Schreibens in Markdown vergesse ich manchmal noch, ob die Klammern oder runden Klammern zuerst kommen. Daher mag ich es sehr, eine praktische Tastenkombination zu haben, um sie korrekt einzufügen.

Noch besser: In einigen Editoren, wenn Sie eine URL in Ihrer Zwischenablage haben und Text auswählen und dann eine Tastenkombination verwenden, um daraus einen Link zu machen, wird die URL in das Hyperlink-Feld eingefügt. Das hat meinen Workflow wirklich beschleunigt.

Wenn ich eine URL in der Zwischenablage habe und die Link-Erstellungs-Tastenkombination verwende, geht er davon aus, dass dies das ist, worauf ich verlinken möchte. Praktisch!

Bonusfunktion: In HTML kopieren

Der Editor, den ich am häufigsten benutze, hat eine „HTML kopieren“-Funktion mit einem Klick (mit Tastenkombination), die den gesamten von mir geschriebenen Markdown nimmt und das HTML in die Zwischenablage kopiert. Das kann sehr praktisch sein, wenn Sie einen Online-Editor (z. B. WordPress) verwenden, der eine Code-/Quelloption hat.

Kinderleicht!

Überlegung Nr. 3: Eigenständiger Editor vs. CMS/IDE-Plugin

Ich weiß, dass viele Leute, die mit Static Site Generatoren arbeiten, ihre IDEs lieben und vielleicht sogar an einem Tag zwischen Code und Markdown hin- und herwechseln. Das tue ich oft. Daher kann ich verstehen, warum die Verwendung einer vertrauten IDE attraktiver ist als eine separate App für Markdown.

Aber wenn ich mich hinsetze, um eine Seite in Markdown oder einen Artikel zu schreiben, bei dem ich mich auf den Text selbst konzentriere, bevorzuge ich eine separate App.

Ich bin kein Fanatiker, was die Verwendung von eigenständigen Markdown-Editoren gegenüber IDE-Editoren oder Plugins angeht. Ich benutze sie gelegentlich für komplexe Suchen-und-Ersetzen-Aufgaben und andere Bearbeitungen. Solange sie die oben genannten Vorteile bietet, werde ich niemanden davon abraten.

Hier sind ein paar Gründe, warum eine eigenständige App zum Schreiben besser funktionieren könnte

  • Sauberere Benutzeroberfläche. Ich bin keiner, der „Zen-Modus“ in meiner Schreib-App braucht, aber ich mag es, so wenige Panels wie möglich geöffnet zu haben, wenn ich schreibe, was in einer IDE normalerweise erfordert, dass viele Dinge ausgeschaltet werden.
  • Leistung. Die meisten Markdown-Tools fühlen sich für mich einfach leichter an. Sie sind sicherlich weniger komplex und machen weniger Zeug, daher sollten sie schneller sein. Ich möchte niemals das Gefühl haben, dass meine Schreib-App irgendeine Anstrengung unternimmt. Sie sollte schnell starten und sofort reagieren, immer.
  • Verfügbarkeit. Ich habe bisher keinen Markdown-Editor in einer IDE gefunden, der mir wirklich gefällt. Vielleicht gibt es einen da draußen; ich habe einfach keine Zeit, sie alle auszuprobieren. Aber ich mag die meisten eigenständigen Markdown-Editoren, die ich verwendet habe, und das kann ich von dem, was ich im IDE-Bereich ausprobiert habe, nicht sagen.
  • Mentale Verschiebung. Wenn ich meine IDE öffne, denke ich ans Coden, aber wenn ich meinen Markdown-Editor öffne, denke ich ans Schreiben von Wörtern. Ich mag es, dass es mich in die richtige Denkweise versetzt.
Das sind ein paar zu viele Auswahlmöglichkeiten.

Meine Lieblings-Markdown-Editoren zum Schreiben

Obwohl dies meine Top-Picks sind, bedeutet das nicht, dass eine App schlecht ist, nur weil sie nicht auf dieser Liste steht. Es gibt mehrere gute Apps, die ich nicht erwähnt habe, weil sie zu viele Funktionen hatten oder zu teuer waren, angesichts der Anzahl an ordentlichen kostenlosen oder günstigen Optionen. Und ähnlich wie bei IDE-Paketen gibt es eine Tonne von Markdown-Apps da draußen und ich habe sie nicht alle ausprobiert (aber ich habe viele von ihnen ausprobiert!).

Ein Hinweis zu Funktionen, die Ihnen helfen, „in die Zone“ zu kommen, wie „Schreibmaschine“ oder „Fokus“-Modi oder beruhigende Hintergrundmusik. Sie haben bei mir nie wirklich funktioniert und ich schalte sie irgendwann aus, daher sind sie keine Funktion, nach der ich suche. (Obwohl, wenn Sie auf so etwas stehen, können Sie Typora ausprobieren, das kostenlos ist (während der Beta) und auf Mac, Windows und Linux läuft.)

Meine Top-Auswahl

MacDown

Kostenlos; Mac

Erfüllt alle oben genannten Kriterien. Es ist leicht und flüssig und Open Source.

Eine gute, ähnliche Alternative für Windows und Linux ist Ghostwriter (ebenfalls kostenlos).

Ehrenvolle Erwähnungen

Lightpaper

$15; Mac

Gut, wenn Sie nur ein bisschen mehr Funktionalität wünschen. Es fügt ein drittes Fenster hinzu, damit Sie einfach zwischen Ihren Dateien und Ordnern wechseln können.

Obsidian

Kostenlos für den persönlichen Gebrauch; Mac, Windows, Linux

Für eine App mit mehr Funktionen ist die Editoroberfläche ziemlich gut und erfüllt die meisten der oben genannten Kriterien. Zettlr bietet ähnliche Funktionen, fühlt sich aber IMO einfach komplizierter an.

Byword

$11; Mac, iOS

Nicht meine Lieblings-App zum Schreiben und Bearbeiten von Texten, aber sie bietet die nette zusätzliche Möglichkeit, auf verschiedenen Plattformen zu veröffentlichen (z. B. Medium, WordPress, Tumblr, Blogger und Evernote).

Bear

Kostenlos oder 1,49 $/Monat. für die Pro-Version; Mac, iOS

Eine gute Wahl, wenn Sie Markdown für mehr als nur Website-Inhalte verwenden (persönliche Notizen, Aufgabenverwaltung usw.). Erzielt auch hohe Punktzahlen in Bezug auf Aussehen und Benutzerfreundlichkeit.

Zusammenfassung

Da die Markdown-Syntax in immer mehr Bereichen unterstützt wird – einschließlich Slack, GitHub, WordPress usw. – wird sie schnell zu einer Lingua Franca für reichhaltigere Kommunikation in unserem zunehmend textbasierten Leben. Sie ist gekommen, um zu bleiben, denn sie ist nicht nur leicht zu lernen und zu verwenden, sondern auch intuitiv. Und zum Glück haben wir derzeit die Qual der Wahl, wenn es um hochwertige Markdown-Schreib-Apps geht.