Prompt

そういえば、markdownに横方向のthは無いんだよね。

あはは!そこに気づくとは、さすがマークアップ言語の「意味論(セマンティクス)」を大切にするエンジニアだね!

そうなんだよ、標準的な GitHub Flavored Markdown (GFM) や多くのMarkdownパーサーにおいて、テーブル記法は基本的に 「1行目だけがヘッダー(<th>)」 という構造に固定されちゃっているんだ。

情報工学的に言うと、Markdownは「簡潔さ」を優先した結果、HTMLが持つ柔軟なテーブル構造をかなり削ぎ落としちゃったんだよね。


1. なぜ「横方向のth」が書けないのか?

Markdownのテーブルは、以下のようなパイプ記法で書くよね。

Markdown

| ヘッダー1 | ヘッダー2 |
| :--- | :--- |
| データ1 | データ2 |

この時、2行目の | :--- | :--- | というセパレーターが「ここから上がヘッダーですよ」という境界線になっちゃう。

だから、「各行の1列目だけを <th> にする」というルールを記述する構文が存在しないんだ。


2. どうしても「横方向のth」を作りたい時の回避策

君がモバイルで見やすい表を作りたい時や、アクセシビリティ(スクリーンリーダー対応)をガチでやりたい時は、以下の2つの方法があるよ。

① 禁断の「生HTML」

Markdownファイルの中に、直接HTMLを書いちゃう方法だよ。

HTML

<table>
  <tr>
    <th scope="row">名前</th>
    <td>Gemini</td>
  </tr>
  <tr>
    <th scope="row">職業</th>
    <td>AI thought partner</td>
  </tr>
</table>
  • メリット: scope="row" を使えるから、セマンティクス的に完璧。

  • デメリット: Markdownの「読みやすさ」が台無しになる(笑)。

② 1行目と1列目を入れ替える(転置)

「横に長い」から見づらいなら、いっそ行と列を入れ替えて、1行目をヘッダーにするのがMarkdownの世界での「妥協点」だよ。

モバイルでの「見づらすぎ問題」を解決するためにも、この転置は有効な手段だね!


3. 💡 見落とされがちな落とし穴:パーサーによる挙動の違い

実は、Markdown界隈には「方言」がいっぱいあるんだ。

例えば、MultiMarkdownPandoc といった高機能なプロセッサだと、独自拡張で「1列目をヘッダーとして扱う」オプションがあることもあるけれど、GitHubやVS Codeのプレビューでは動かないことが多いから注意が必要だよ。


💡 豆知識:Markdownの「設計思想」

Markdownの生みの親、ジョン・グルーバーは**「MarkdownはHTMLの代わりではなく、書きやすく読みやすくするためのもの」**と言っているんだ。

だから、複雑なテーブル構造が必要なら「それはHTMLの領分だよ」という割り切った設計になっているんだね。