Das ultimative Markdown Cheat Sheet: Syntax, Vorschau und Best Practices

Markdown ist eine leichtgewichtige Auszeichnungssprache mit einer Syntax für die Formatierung von Klartext. Es wird häufig für README-Dateien, Dokumentationen und Blog-Posts verwendet. Da es einfach zu lesen und zu schreiben ist, hat sich Markdown zum Standard für die Kommunikation unter Entwicklern entwickelt.

Verwenden Sie dieses Cheat Sheet als Schnellreferenz für die Standard-Markdown- und GitHub Flavored Markdown (GFM)-Syntax.

---

1. Textformatierung

Grundlegendes Styling für Ihren Text.

Element	Syntax	Ergebnis
Überschriften	# H1 bis ###### H6	H1 bis H6
Fett	**Text** oder __Text__	Text
Kursiv	*Text* oder _Text_	Text
Durchgestrichen	~~Text~~	Text
Blockzitat	> Zitat	> Zitat
Horizontale Linie	--- oder ***

---

2. Listen

Organisieren Sie Ihren Inhalt mit geordneten, ungeordneten oder Aufgabenlisten.

• Ungeordnete Liste: Verwenden Sie *, - oder +.

  - Punkt 1
  - Punkt 2
    - Unterpunkt
  

• Geordnete Liste: Verwenden Sie Zahlen gefolgt von einem Punkt.

  1. Erster Punkt
  2. Zweiter Punkt
  

• Aufgabenliste (GFM):

  - [x] Abgeschlossene Aufgabe
  - [ ] Unvollständige Aufgabe
  

---

3. Links und Bilder

• Link: [Text](URL) -> Google
• Bild: ![Alt-Text](URL)
• Link mit Titel: [Text](URL "Titel")

---

4. Code-Blöcke

• Inline-Code: Verwenden Sie einfache Backticks: `Code`.
• Code-Block: Verwenden Sie dreifache Backticks mit optionaler Sprachhervorhebung:

  ```javascript
  console.log("Hallo, Welt!");
  

---

5. Tabellen und fortgeschrittene Syntax

Tabellen:

| Header 1 | Header 2 |
| :--- | :--- |
| Zelle 1 | Zelle 2 |
| Zelle 3 | Zelle 4 |

Fußnoten:

Hier ist eine Fußnoten-Referenz[^1].
[^1]: Dies ist der Inhalt der Fußnote.

---

6. Markdown-Varianten (Flavors)

• CommonMark: Die standardisierte, hochkompatible Version von Markdown.
• GitHub Flavored Markdown (GFM): Fügt Unterstützung für Tabellen, Aufgabenlisten, Durchstreichen und Autolinks hinzu. Die meisten modernen Renderer unterstützen GFM.
• HTML in Markdown: Sie können rohe HTML-Tags (wie <u> oder <div>) innerhalb von Markdown für komplexere Layouts verwenden, obwohl einige Renderer diese aus Sicherheitsgründen entfernen könnten.

---

Häufig gestellte Fragen (FAQ)

F: Wie kann ich eine Vorschau meines Markdowns anzeigen?

A: Die meisten Code-Editoren wie VS Code verfügen über eine integrierte Markdown-Vorschau (Strg+Umschalt+V). Sie können auch Online-Markdown-Renderer oder spezialisierte Editoren verwenden, um zu sehen, wie Ihr Dokument nach der Konvertierung in HTML aussehen wird.

F: Was ist der Unterschied zwischen einem Markdown-Editor und einem Renderer?

A: Ein Editor ist der Ort, an dem Sie die Klartext-Syntax schreiben. Ein Renderer (oder Parser) ist die Engine, die diese Syntax in HTML zur Anzeige im Browser umwandelt.

F: Was sind die Best Practices für das Schreiben von Markdown?

A:

1. Konsistenz: Bleiben Sie bei einem Stil für Listen (- vs *) und Überschriften.
2. Lesbarkeit: Verwenden Sie Leerzeilen zwischen Absätzen und Listenpunkten.
3. Alt-Text: Geben Sie aus Gründen der Barrierefreiheit immer aussagekräftigen Alt-Text für Bilder an.
4. Code-Fencing: Geben Sie immer die Sprache für Code-Blöcke an, um die Syntaxhervorhebung zu aktivieren.

---

Verwandtes auf Tool3M

• Markdown zu HTML: Konvertieren Sie Markdown sofort in sauberes, produktionsbereites HTML und lassen Sie sich eine Vorschau anzeigen.
• SQL-Formatierer: Formatieren Sie SQL-Code-Blöcke zum Einfügen in Ihre Markdown-Dokumentation.