HTMLに変換できる簡易的なマークアップ言語「Markdown」で学習メモをとる

文章の作成や勉強会などでのメモをとっている時、文章(プレーンテキスト)だけだとメリハリがなく、あとで読み返した時に要点がつかみにくいことがあります。
かといってHTMLで記述するのは面倒です。そこで僕がよく使っているのが「Markdown」というマークアップ言語です。
sponsored link
Markdownの記述方法
最終的には(X)HTMLに変換することになるんですが、HTMLと違って、開始タグや終了タグを使用せず、#
(ハッシュ)や*
(アスタリスク)や改行などがHTML要素の代わりをしてくれるのが特徴です。
最近では「GitHub」や「Tumblr」で採用されていて「WordPress」でもプラグインを使えば利用することもできます。
今回は使用頻度の高い「見出し」「段落・改行」「リスト」「リンク」の4つの記述方法を紹介します。
h要素のレベルは#の数
h1
やh2
などの見出しは#
(ハッシュ)の数で示します。また記号のあとには半角スペースかタブを入れるのが基本的なルールになっています。
1 2 3 4 5 6 7 |
// Markdown # 見出し1 ## 見出し2 // HTML <h1>見出し1</h1> <h2>見出し2</h2> |
p要素とbr要素は空白行と半角スペース
文章を入力する上でいちばん使うのはHTMLのp
要素だと思います。Markdownでは文章の行を空白行(入力していない行)で囲むことで示します。
1 2 3 4 5 6 7 8 9 10 11 12 13 |
// Markdown この行が1つ目のp要素になります この行が2つ目のp要素になります この行と この行はまとめてひとつのp要素になります // HTML <p>この行が1つ目のp要素になります</p> <p>この行が2つ目のp要素になります</p> <p>この行と この行はまとめてひとつのp要素になります</p> |
空白行で囲んでいなければ、途中で改行しても同じp要素の文章として扱われます。ただし、HTML要素内での改行と同じように半角スペースは挿入されます。
改行をしたい場合は半角スペースを2つ入力してからreturnします(見た目では分かりませんが…)。
1 2 3 4 5 6 |
// Markdown ここが段落の前 ここからが段落したあと // HTML <p>ここが段落の前<br/>ここからが段落したあと</p> |
文章を入力した流れで全角スペースを入力してしまいがちなので気を付けましょう。
順序なしリストは*、順序ありリストは1.
HTMLではul
(順序なし)とol
(順序あり)の2つのリストがあります。
順序なしリストは*
(アスタリスク)と-
(ハイフン)と+
(プラス)のいずれかで示します。入れ子にしたい時はスペースかタブを入れて記号を変更します。
順序ありリストは1.
で示します。下の例でも分かるように、1.
や2.
と数字は上がっていなくてもHTMLでは記述した順番で変換されます。順番を入れ替えることを考えて1.
だけで記述するのがおすすめです。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
// Markdown * リスト1 * リスト2 - 入れ子リスト1 - 入れ子リスト2 * リスト3 1. リスト1 1. リスト2 1. リスト3 // HTML <ul> <li>リスト1</li> <li>リスト2 <ul> <li>入れ子リスト1</li> <li>入れ子リスト2</li> </ul></li> <li>リスト3</li> </ul> <ol> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> </ol> |
リンクは角括弧と丸括弧
リンクのタイトルは[]
(角括弧)でURLは()
(丸括弧)で囲みます。
1 2 3 4 5 |
// Markdown [hoge.com](http://hoge.com) // HTML <a href="http://hoge.com">hoge.com</a> |
タイトルを先に書かないとうまく変換されないので注意します。
僕は新しいことを学習している時に考えをまとめながらMarkdownでメモを残しています。アプリなどを使えばHTMLファイルにエクスポートすることもできるので、Dropboxなどにアップロードしておくと、どこでも復習することができるのでおすすめです。
Mac限定ですが、「MacDown」というアプリを使えば、リアルタイムにHTMLのプレビューができたりCSSも変更することができます。主要な言語のSyntax Highlightが使えるのもうれしいところ。しかも無料です。
MacDown: The open source Markdown editor for OS X.