ブログの下書きにはMarkdown(マークダウン記法)がオススメ!
「ブログの下書きって何に書いてますか？」
私はこれまで、ブログの投稿画面に直接書いて、下書き状態にしていました。
個人的にもブログを書くので、ライブドアブログ、FC2ブログ、アメーバブログと書いてきましたが、各ブログの投稿画面に下書きしていました。
しかし、私はMSENに入社してから Markdown(マークダウン記法) という書き方を教えてもらいました。
「なんて楽なんだ…」
それからというもの、ブログの下書きは Markdown で作成する様になりました。
という事で、今回は Markdown の書き方を記載していきます。
マークダウン記法とは
Markdown（マークダウン）は、文書を記述するための軽量マークアップ言語のひとつである。本来はプレーンテキスト形式で手軽に書いた文書からHTMLを生成するために開発されたものである。
Wikipediaから引用
簡単に言うと、マークダウン記法のルールで書くと、自動的にHTMLに変換してあげるよ～という事です。
最近はマークダウン記法に対応したサービスも多くなってきたので、簡単なメモを取る時もマークダウン記法で書いておくと、見やすくなるので整理がしやすいです。
まぁ難しい事は置いといて、マークダウン記法の書き方を見ていきましょう。
段落と改行
段落は空白行を入れます。 厳密には1行以上の空白行で挟まれた範囲が段落になります。
改行しただけでは段落は分けられません。
Markdown
今日はいい天気ですね。
そうですね。
お出かけ日和ですね。実際に表示される形
今日はいい天気ですね。
そうですね。お出かけ日和ですね。出力されるHTMLタグ
<p>今日はいい天気ですね。</p>
<p>そうですね。お出かけ日和ですね。</p>もし段落内で改行したい場合は、改行したい末尾に半角スペースを2つ書きます。
Markdown
今日はいい天気ですね。
そうですね。 ←半角スペース2個
お出かけ日和ですね。実際に表示される形
今日はいい天気ですね。
そうですね。
お出かけ日和ですね。出力されるHTMLタグ
<p>今日はいい天気ですね。</p>
<p>そうですね。<br>
お出かけ日和ですね。</p>見出し
見出しを設定したい箇所に # を書きます。
# の後は必ず半角スペースが必要です。
# の数が見出しのレベルになります。最大6個まで設定可能。
見出しのデザインは、文章を作成する媒体（ブログ等）によって違います。標準でも文字の大きさは変わると思いますが、見出しのデザインを変更したい場合は、見出しに対してのCSSを編集します。
Markdown
# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
###### 見出し6実際に表示される形
見出し1
見出し2
見出し3
見出し4
見出し5
見出し6
出力されるHTMLタグ
<h1>見出し1</h1>
<h2>見出し2</h2>
<h3>見出し3</h3>
<h4>見出し4</h4>
<h5>見出し5</h5>
<h6>見出し6</h6>箇条書きリスト
箇条書きリストにしたい行頭に、**アスタリスク( * )**を書きます。
* の後は必ず半角スペースが必要です。
階層にする場合は、半角スペース2個を行頭前に書きます。
半角スペース2個では階層にならないシステムもあります。 その場合は、半角スペース4個を行頭前に書いてください。
Markdown
* リスト1
* リスト2
* リスト2-1
* リスト2-2
* リスト3実際に表示される形
- リスト1
- リスト2
- リスト2-1
- リスト2-2
- リスト3
出力されるHTMLタグ
<ul>
<li>リスト1</li>
<li>リスト2<ul>
<li>リスト2-1</li>
<li>リスト2-2</li>
</ul>
</li>
<li>リスト3</li>
</ul>番号付きリスト
番号付きリストにしたい箇所に、数字とピリオドを書きます。
番号付きリストの形になっていれば数字は自動的に振られます。
数字とピリオドの後は必ず半角スペースが必要です。
階層にする場合は、半角スペース2個を行頭前に書きます。
半角スペース2個では階層にならないシステムもあります。 その場合は、半角スペース4個を行頭前に書いてください。
Markdown
1. 番号付きリスト1
1. 番号付きリスト1_1
1. 番号付きリスト1_2
1. 番号付きリスト2
1. 番号付きリスト3実際に表示される形
- 番号付きリスト1
- 番号付きリスト1_1
- 番号付きリスト1_2
- 番号付きリスト2
- 番号付きリスト3
出力されるHTMLタグ
<ol>
<li>番号付きリスト1<ol>
<li>番号付きリスト1_1</li>
<li>番号付きリスト1_2</li>
</ol>
</li>
<li>番号付きリスト2</li>
<li>番号付きリスト3</li>
</ol>引用
引用表示にしたい箇所に > を書きます。
> の後は必ず半角スペースが必要です。
Markdown
> こんにちは。今日もいい天気ですね。実際に表示される形
こんにちは。今日もいい天気ですね。
出力されるHTMLタグ
<blockquote>
<p>こんにちは。今日もいい天気ですね。</p>
</blockquote>二重引用
引用したい箇所に > で書いた後に、二重引用したい箇所に >> を書きます。
> や >> の後は必ず半角スペースが必要です。
Markdown
> こんにちは。今日もいい天気ですね。
>> そうですね。でも明日は雨ですよ。実際に表示される形
こんにちは。今日もいい天気ですね。
そうですね。でも明日は雨ですよ。
出力されるHTMLタグ
<blockquote>
<p>こんにちは。今日もいい天気ですね。</p>
<blockquote>
<p>そうですね。でも明日は雨ですよ。</p>
</blockquote>
</blockquote>強調
強調したい箇所の前後に ** を書きます。
Markdown
こんにちは。今日も**いい天気**ですね。実際に表示される形
こんにちは。今日もいい天気ですね。
出力されるHTMLタグ
<p>こんにちは。今日も<strong>いい天気</strong>ですね。</p>水平線
水平線を引きたい箇所に *** を書きます。
Markdown
***実際に表示される形
出力されるHTMLタグ
<hr>リンク
リンクにしたい箇所に [文章](URL) を書きます。
残念ながら別窓で開く target=“_blank” は設定できません。
Markdown
[ググれ](https://www.google.co.jp/)実際に表示される形
出力されるHTMLタグ
<p><a href="https://www.google.co.jp/">ググれ</a></p>コード
コードとして表示したい箇所を `(バッククオート)を3つで挟みます。
Markdown
あか
実際に表示される形
<span style="color:red;">あか</span>まとめ
個人的によく使用するマークダウン記法はこんなところですかね。
もちろん、この記事も紹介したマークダウン記法のみで書いています。
他にも Markdown Extra や GitHub Flavored Markdown(GFM) という拡張的な書き方もあり、テーブル作成やURLの自動リンク等がサポートされています。マークダウン記法は簡易的に使うこと多いので、あまり使いませんが、また別の記事で紹介できたらなと思います。
じゃあ、何（どのテキストエディタ）にマークダウン記法で書けばいいの？となると思いますが、私は ATOM を使用しています。
ATOM は標準で Markdown に対応していて、さらにリアルタイムで表示してくれるビュアーも標準装備されているので、次回の記事で使い方を紹介したいと思います。
あゆとの雑談部屋
今週の休みは家族4人（嫁 + 4歳娘 + 1歳娘）で レゴランド・ディスカバリー・センター大阪に遊びに行ってきました。
レゴランド・ディスカバリー・センター大阪 https://www.legolanddiscoverycenter.jp/osaka/
事前に色々と調べてから行ったのですが、思ったより子供寄りの施設でした。
アトラクション中心の作りになっているので、大人は2時間程度で暇になってしまいますｗ 間違えても、大人だけで入ってはいけません。
まぁ子供達はものすごく楽しんでいたので結局4、5時間滞在しちゃいましたが。
レゴランド
個人的にはマスター・ビルダー・アカデミーが一番楽しかったですね。
プロのビルダーから作り方を教えてもらえる教室です。
今回はハチを作りました。毎月お題は変わるそうです。
マスタービルダーアカデミー
ハチの制作対象年齢は6歳だったんですが、4歳の娘はしっかり作っていました。
普段から家でレゴに触れているからですかね。（親バカ）
作り終わった後は認定書を貰え、それをレジに持って行くと、今回作ったレゴのパーツセットを500円で買う事ができます。
やっぱり大人も子供もレゴを触るのはすごく楽しいので、もっと作り方やテクニックを教えてくれる施設が多いと嬉しいな～。
場内は写真&動画撮影がほぼ可能なので、子供との思い出作りには良い施設でした。
さすがに年間パスポートにアップグレードする勇気はありませんでしたが…
