Markdown チートシート

Markdown 構文のクイックリファレンス — 見出し、リスト、リンク、コードブロック、テーブルなど、ライブレンダリングプレビュー付き。

Markdown
プレビュー

使い方

  1. 左側の目次から構文カテゴリーに直接ジャンプできます。
  2. 各カードの左側に生の Markdown 構文、右側にレンダリング結果が表示されます。
  3. コピーボタンをクリックして Markdown スニペットをクリップボードにコピーできます。
  4. GitHub、Notion、VS Code、Obsidian などの Markdown エディターで直接使用できます。

よくある質問

  • Markdown とは何ですか?

    Markdown は、John Gruber が 2004 年に作成した軽量マークアップ言語です。** でテキストを囲むと太字になるなど、プレーンテキストの記号を使って書式を表現できます。Markdown ファイルは GitHub、ブログプラットフォーム、ドキュメントツール、ノートアプリなどのレンダラーによって HTML に変換されます。

  • Markdown の構文はどのプラットフォームでも同じですか?

    基本構文はほぼ共通ですが、プラットフォームによってサポートする拡張が異なります。GitHub Flavored Markdown(GFM)はタスクリスト、取り消し線、テーブルを追加しています。Obsidian はウィキリンクをサポートしています。一部のプラットフォームは CommonMark を標準として採用しています。このチートシートでは最も広くサポートされている機能に焦点を当てています。

  • Markdown で改行するにはどうすればよいですか?

    行末にスペースを 2 つ入れて Enter を押すと、ソフト改行になります。段落の区切りには、2 つの行の間に空行を入れてください。多くのレンダラーでは、末尾にスペースのない単純な改行はスペースとして扱われ、改行にはなりません。

  • Markdown の中で HTML を使えますか?

    ほとんどの Markdown レンダラーはインライン HTML を許可しています。たとえば、改行に <br>、下線に <u>テキスト</u>、折りたたみセクションに <details> が使えます。ただし、セキュリティを重視するレンダラーは HTML を完全にフィルタリングします。

Markdown とは?

Markdown は HTML に変換できるプレーンテキスト形式の構文です。John Gruber が 2004 年に作成し、レンダリングなしでも読みやすいテキストを目指して設計されました。現在は GitHub の README、技術ドキュメント、ブログプラットフォーム、Obsidian や Notion などのノートアプリ、Slack や Discord などのチャットツールで広く使われています。

基本的なアイデアはシンプルです。通常の文字で書式を表します。行の先頭に # を置くと見出しになり、** でテキストを囲むと太字になり、4 つのスペースでインデントするとコードブロックになります。これらの規則は直感的で、ほとんどの開発者は改めて学習しなくても習得できます。

Markdown チートシートの活用

経験豊富なライターでも、テーブルのアライメント、ネストされたリスト、言語指定のフェンスコードブロックの正確な構文を忘れることがあります。チートシートは素早い参照ツールです — 生の構文とレンダリング結果を並べて表示するので、出力を推測する必要がありません。

このチートシートが対象とする内容:

  • 見出し — h1 から h4 までの 4 レベル
  • テキスト書式 — 太字、斜体、取り消し線、インラインコード、ハイパーリンク
  • リスト — 順序あり、順序なし、ネスト、タスクリスト
  • リンクと画像 — インラインリンク、タイトル付きリンク、画像
  • 引用ブロック — 単一および入れ子の引用
  • コードブロック — 言語指定可能なフェンスコードブロック
  • テーブル — 列の揃え位置オプション付き
  • 水平線 — 視覚的な区切りとして使用

Markdown の方言

基本的な Markdown 仕様は意図的にミニマルに設計されています。様々なツールがその拡張版を提供しています。

CommonMark は原仕様の曖昧さを解消した標準化された仕様で、GitHub、GitLab、Discourse などのプラットフォームが採用しています。

GitHub Flavored Markdown(GFM) はタスクリスト(- [x])、取り消し線(~~テキスト~~)、テーブル、オートリンクを追加しています。多くのコードプラットフォームが GFM またはそのスーパーセットをサポートしています。

日常的な技術文書作成 — README、ドキュメント、ブログ、ノート — には、標準 CommonMark と GFM 拡張で事実上すべてのニーズに対応できます。

良い Markdown を書くためのヒント

リストマーカーを統一する。 順序なしリストには -* を選んで統一してください。混在は文法的に正しいですが、ソースの可読性が下がります。

ブロック要素の間に空行を入れる。 見出し、コードブロック、引用ブロックの前後に空行を入れると、異なるパーサーでも正しくレンダリングされます。

フェンスコードブロックを優先する。 トリプルバックティックのコードブロックは言語指定でシンタックスハイライトが使えますし、ソースでも視覚的に明確です。

深くネストしたリストを避ける。 3 レベル以上のネストはソースでもレンダリング後でも読みにくくなります。見出しを使ったセクション構成への変更を検討してください。

説明的なリンクテキストを使う。 [こちらをクリック](url) より [Markdown 仕様](url) の方が可読性とアクセシビリティの面で優れています。