さて、いよいよ作表です。tableの書き方。
tableタグがMarkdownで簡単に
<table>−HTML5タグリファレンス 
<table>タグは、テーブル（表）を作成する際に使用します。テーブルの基本的な構造は、<table>〜</table>の中に <tr>〜</tr>で表の横一行を定義して、 さらにその中に<th>〜...tableはHTML上級者向け。tableタグの中にtrタグとtdタグを並べ、ちゃんと前後のタグの数が足りているか計算しながら、でも書き換えたりすると分からなくなって、マス目が多いほど発狂しそうになる。甘いものが食べたくて仕方ない。そんな貴方にMarkdownです。
| 配信サービス | 年会費 | URLアドレス
|-
| Hulu | 933円 × 12ヶ月 | http://www.hulu.jp
| Netflix | 650円 × 12ヶ月 | http://www.netflix.com/jp
|Amazon | 3,900円 | http://www.amazon.co.jp
２行目の「|-」がポイント。各セルは「|」で始めます。
| 配信サービス | 年会費 | URLアドレス |
|---|---|---|
| Hulu | 933円 × 12ヶ月 | http://www.hulu.jp |
| Netflix | 650円 × 12ヶ月 | http://www.netflix.com/jp |
| Amazon | 3,900円 | http://www.amazon.co.jp |
これだけで作表できる。１行目はかならずテーブル・ヘッダーになります。「|配信サービス | 年会費 | URLアドレス」のところ。ここは不可欠。他は自由に書いてください。
左寄せ・右寄せ・中央表示
配置も指定できます。２行目のtableマークがコントローラーになっています。tableの正式な書き方は「|-|-|-|」。セルの列数の「-」を用意し、それぞれ「|」で区切る。このとき「:-」とすれば、そのセルは左寄せになります。「-:」なら右寄せ。「:-:」は中央表示。
| 配信サービス | 年会費 | URLアドレス
|:-|-:|:-:
| Hulu | 933円 × 12ヶ月 | http://www.hulu.jp
|Netflix |650円 × 12ヶ月 |http://www.netflix.com/jp
|Amazon | 3,900円 | http://www.amazon.co.jp
２行目が賑やかになります。
| 配信サービス | 年会費 | URLアドレス |
|---|---|---|
| Hulu | 933円 × 12ヶ月 | http://www.hulu.jp |
| Netflix | 650円 × 12ヶ月 | http://www.netflix.com/jp |
| Amazon | 3,900円 | http://www.amazon.co.jp |
ヘッダーセルもデータセルも、コントローラーに合わせて配置される。
セル内を多段にしたいとき
セルの中身が長すぎると、それはそれで不恰好。表の中で改行したい場合も起こり得る。表は見せ方次第で訴えるポイントが変わります。そんなときbrタグで問題を回避します。
| 配信サービス | 年会費 | URLアドレス
|-
| Hulu | 933円 <br> × 12ヶ月 | http://www.hulu.jp
|Netflix |650円 <br> × 12ヶ月 |http://www.netflix.com/jp
|Amazon | 3,900円 | http://www.amazon.co.jp
月額と年会費が混在しているから注意を促したい。
| 配信サービス | 年会費 | URLアドレス |
|---|---|---|
| Hulu | 933円 × 12ヶ月 |
http://www.hulu.jp |
| Netflix | 650円 × 12ヶ月 |
http://www.netflix.com/jp |
| Amazon | 3,900円 | http://www.amazon.co.jp |
あまり美しい方法ではないけれど、出来上がりが美しいから許してほしい。
空セルは作れない
情報のないセルがあっても空白は無視されます。代わりに「-」を入れてください。
| 配信サービス | 年会費 | URLアドレス
|-
| Hulu | 933円 × 12ヶ月 |-
|Netflix |650円 × 12ヶ月|-
|Amazon | 3,900円 | http://www.amazon.co.jp
文中に隙間を開けようとしても無視されます。
| 配信サービス | 年会費 | URLアドレス |
|---|---|---|
| Hulu | 933円 × 12ヶ月 | - |
| Netflix | 650円 × 12ヶ月 | - |
| Amazon | 3,900円 | http://www.amazon.co.jp |
Markdownは最適化が好きだから、無駄な空白／空行は省略される運命。
表のアフォーダンス
こう並べると、Amazonプライムの価格破壊がよく分かります。映画が見放題。TVドラマを見ないのならこれしかない。一本100円として、年間40本が収支の条件。月３本程度なら敷居も高くないし、レンタル屋だと貸出中で置いてないこともあるよなあ・・・。
表は、読み手に「比較」を強いる装置です。平文であれば、興味のあるところしか読まないことが可能です。知りたいことを知るために読む。人間の目にはフィルターが付いています。たとえば、Netflixの記事だけ読み、あとは飛ばすことができる。
表にはそのフィルターが通じません。かならず上下に目が移る。知ろうとした情報が、他と比べてどうかを見てしまう。比較のアフォーダンスがある。それでいて、書き手は「情報」を出さないことができる。だいたい２列目に勝負どころを置きます。「年会費」のところ。そこに目が行くでしょ？ 表をそう作っているからで、もし３列目に「品数」を置いたとしても、その重要度は薄くなる。４列目だと見ないかも。駆け引きが「表」のなかに隠れています。気をつけてくださいね。
まとめ
Markdownの表は「ヘッダーを付けるならこの形式しかない」ってところを攻めてきます。書き方を拘束してくる。ヘッダー無しの表を作れないのは意図的だと思います。何を比較しているのか明示する義務を負わせている。HTMLのテクニックとして、見栄えのためにtableタグが濫用されたので、そういう用途を禁じる働きも内在しています。tableを、table本来の役割にしか使えないようにする。この記法、うまく考えてあります。