GitHubのREADMEに表を追加しようとして、パイプ(|)の数を数えながら手打ちしていたら、 プレビューで見事に列がズレていた——という経験はないでしょうか。 列を1つ増やしただけで見出し行・区切り行・データ行すべてを直す羽目になり、直したつもりがまた1文字足りない。 Markdownのテーブルは記法自体はシンプルなのに、手作業だと驚くほど崩れやすい記法です。
この記事ではMarkdownテーブルのパイプ記法・列揃えの指定方法・崩れる原因と対処法を解説し、 さらにHTML・CSVといった別形式への変換が必要になる場面まで紹介します。
Markdownテーブルの基本構文(パイプ記法)
Markdownのテーブルは、標準のMarkdown仕様には含まれておらず、GFM(GitHub Flavored Markdown)と呼ばれる拡張仕様で定義されています。 現在ではGitHub・GitLab・Zenn・Qiita・Notion・VS Codeのプレビュー機能など、ほとんどの主要サービスがこの記法に対応しています。
書き方はシンプルで、パイプ記号(|)で列を区切った「見出し行」と、その直下に置く「区切り行」の2行が最低限必要です。
| 商品名 | 価格 | 在庫 |
| --- | --- | --- |
| りんご | 120円 | ◯ |
| みかん | 80円 | ✕ |
1行目が見出し行、2行目が区切り行(各セルに最低1文字のハイフンが必要。実務上は---のように3つ以上が定番)、 3行目以降がデータ行です。行頭・行末のパイプは省略できるパーサーもありますが、崩れを防ぐために付けておくのが安全です。
列の配置を指定する(左寄せ・中央寄せ・右寄せ)
区切り行のハイフンにコロン(:)を付けることで、列ごとに文字の揃え方を指定できます。
| 項目 | 数量 | 単価 |
| :--- | :---: | ---: |
| ノート | 3 | 150円 |
| ペン | 10 | 80円 |
:---— 左寄せ(コロンなしの---も同じく左寄せになる):---:— 中央寄せ(両端にコロン)---:— 右寄せ(右端だけにコロン)
金額・件数・パーセンテージなど数値を扱う列は右寄せにすると桁が揃い、一覧性が上がります。 文字列の項目名の列は左寄せ、短いラベルや記号(◯・✕など)は中央寄せにすると見やすくなります。
テーブルが崩れる・ズレるよくある失敗パターン
Markdownテーブルは記法自体はシンプルですが、次のようなミスで崩れることがよくあります。
1. 見出し行と区切り行の列数が合っていない
列を後から追加・削除したときに区切り行の更新を忘れると、列数が一致せずテーブルとして認識されないか、レンダリングが崩れます。 見出し行・区切り行・すべてのデータ行の列数は常に一致させる必要があります。
2. セル内のパイプ記号がエスケープされていない
セルの中に|をそのまま書くと列の区切りと誤認識されます。使う場合は\|のようにバックスラッシュでエスケープします。
3. テーブルの前後に空行がない
一部のパーサー(特にブログの記事管理システム(CMS)や一部のドキュメントツール)は、テーブルの直前に空行がないと通常の段落として扱ってしまうことがあります。 テーブルの前後には1行空けておくと安全です。
4. エディタ上の見た目のズレを気にしすぎる
日本語のような全角文字が混ざると、テキストエディタ上ではパイプの位置が縦に揃わず気になりますが、これは見た目だけの問題でレンダリング結果には影響しません。 ソースコード上の整列にこだわりすぎず、区切り行のハイフン数とコロンの位置が正しいかを優先して確認しましょう。
手打ちが面倒な理由 — 列数が増えるほど破綻しやすい
2〜3列程度の小さな表なら手打ちでも問題ありませんが、列数・行数が増えるとパイプの数を数えるだけで一苦労です。 例えば6列×10行の表を手で書くと、パイプは1行あたり7個、区切り行だけでもハイフンとコロンの組み合わせを6箇所分そろえる必要があります。 途中で1列追加すると、見出し行・区切り行・全10行のデータ行、合計12行すべてに手を入れることになり、ミスが起きやすくなります。
ぱんだツールズのMarkdownテーブル生成ツールを使うと、行数・列数を数値で指定してフォームにデータを入力するだけで済みます。 パイプの数や区切り行のハイフンは自動的にそろい、列の配置もボタンで切り替えられるため、コロンの位置を手で数える必要もありません。
HTML・CSV形式への変換が必要になる場面
Markdownテーブルはそのまま使えない場面もあります。代表的なのが次の2つのケースです。
ブログエディタがMarkdownに対応していない場合
WordPressのクラシックエディタや一部のメルマガ配信ツール・社内CMSは、Markdown記法を入力してもテーブルとして描画されません。 パイプ(|)やハイフン(-)が文字通りそのまま表示されてしまいます。 こうした環境では、あらかじめ<table>タグを含むHTML形式に変換してから貼り付ける必要があります。 文書全体をまとめて変換したい場合はMarkdown→HTML変換ツールが便利です。
Excel・スプレッドシートにデータとして取り込みたい場合
ドキュメント用に作った表のデータを、そのまま集計や共有のためにExcelやGoogleスプレッドシートへ持ち込みたいこともあります。 この場合はMarkdownテーブルをCSV形式で出力すればそのまま読み込めます。 さらにCSVをシステム連携用にJSON形式へ変換したい場合はCSV↔JSON変換ツールを使うと、追加の手打ち作業なしで変換できます。 ぱんだツールズのMarkdownテーブル生成ツールはMarkdown・HTML・CSVの3形式をタブ切り替えで同時出力できます。 用途が変わるたびに、別のツールへコピー&ペーストし直す手間がありません。
まとめ
- Markdownテーブルはパイプ(
|)で区切った見出し行と、直下の区切り行(---)の2行が基本構造 - 列の配置は区切り行のコロンで指定する。左寄せ
:---・中央:---:・右寄せ---: - 崩れる主な原因は「列数の不一致」「パイプの未エスケープ」「前後の空行不足」。エディタ上の見た目のズレ自体は気にしなくてよい
- 列数・行数が増えるほど手打ちは破綻しやすく、Markdownテーブル生成ツールで自動生成する方が確実
- Markdown非対応のエディタにはHTML、Excel・スプレッドシートへの取り込みにはCSVと、用途に応じて出力形式を選べる