noteで記事を書いていて、比較表を入れたくなりました。手元のMarkdownはこう書いてあります。
| 項目 | 前回 | 今回 |
|---|---|---|
| 勝率 | 12% | 28% |
これをnoteのエディタに貼ると、こうなります。
| 項目 | 前回 | 今回 | |---|---|---| | 勝率 | 12% | 28% |
表ではなく、縦棒とハイフンの羅列がそのまま出ます。しかも改行まで潰れます。
これを4本の記事で連続して踏みました。毎回「あ、そうだった」と思い出して、毎回手作業で直していました。
先に結論を書くと、noteのエディタには表の機能がありません。 見出し・太字・引用・箇条書き・コード・画像・埋め込みはありますが、表はない。
Markdownの表の書き方（| で区切る書き方）は、そもそも解釈されません。
つまり「書き方が悪い」のではなく、機能として存在しない。
ここを知らないと、書き方を変えながら延々と試行錯誤することになります。
2列の表なら、たいてい箇条書きで足ります。
3列以上になると途端に読みにくくなりますが、 そもそも3列以上の表は、記事本文には重すぎることが多いです。 畳めるなら畳んだほうがいい。最終的にはこれで済ませることが増えました。
比較表のように「並んでいること自体に意味がある」場合は、画像にするしかありません。手順は3つです。
このとき幅に注意します。noteの本文の幅はおよそ620pxで、それより大きい画像は縮小されます。 横に広い表を貼ると、スマホで見たときに文字が潰れて読めません。
実際に決めたルールは2つです。
| 決めたこと | 理由 |
|---|---|
| 列は4つまで | それ以上は本文の幅に収まらない。収まっても読めない |
| 横幅620pxで作る | 大きく作って縮小させると線がにじむ |
画像は手軽ですが、代償があります。ここを承知のうえで選んだほうがいいです。
| 失うもの | どういうことか |
|---|---|
| 検索に引っかからない | 画像の中の文字は本文として読まれない。表に入れた言葉では見つけてもらえなくなる |
| 読み上げに乗らない | 音声読み上げを使っている読者には、内容がまったく伝わらない |
| あとから直せない | 数字が1つ変わっただけでも、作り直して貼り直すことになる |
とくに3つ目が効きます。更新する可能性がある表ほど、画像にしないほうがいい。 逆に「この記事のこの時点の記録」として固定される表なら、画像で困りません。
スプレッドシートなどを埋め込む方法もあります。ただ、外部サービスが消えたら記事も壊れます。 数年後も読まれる記事にするなら、画像のほうが安全だと考えています。
記事の下書きはMarkdownで書きます。そのまま貼れないので、公開の直前に表だけを処理します。
3つ目が意外と多いです。表にしようとしたけれど、実は文章で1行書けば済む内容だった、ということがよくあります。
「この表は要るのか」を毎回悩むと時間が溶けるので、判断を決めておきました。 行と列のどちらかが2つしかないなら、たいてい文章のほうが速いです。
検索すると「noteで表を作る方法」の答えは「箇条書きにしましょう」で終わっている記事が多いのですが、 それは半分正しくて半分不親切だと思っています。 畳める表は畳めばいい。畳めない表のときにどうするか——幅620px・4列まで、というのがその答えです。
さらに、同じ失敗を繰り返さないために、下書きに表が残っていたら公開前に止める仕組みを入れました。
記事を出力するスクリプトの中で、| で始まる行が2行以上続いていたら警告を出すだけの、
10行程度の処理です。
これで4本連続の手直しが止まりました。 人間の注意力ではなく、道具の側に覚えさせるのが、結局いちばん確実でした。
※2026年7月時点のnoteのエディタで確認した挙動です。仕様は変わることがあります。