HTMLわからない人でもきっとなんとなく分かるようになるMarkdownのはじめ方

みなさん、Markdown書いてますか？
まあ、Qiita民はそもそもMarkdown書けないと記事も書けないので書いてはいるのでしょうけど、非エンジニアだとなかなか触れる機会がないようです。
そのせいか「 **エンジニア様がきれいなドキュメントを書くときに使う魔法のじゅもん** 」みたいに感じて敬遠されることも少なくないのですが、個人的には **パソコン使って文章を書くすべての人に便利なもの** と思っていますので、簡単にお話させていただければと思います。

# そもそもMarkdownって何？

ここはまず、すべてのインターネット民が大好きなWikipediaにあたってみましょう。
https://ja.wikipedia.org/wiki/Markdown

>
「書きやすくて読みやすいプレーンテキストとして記述した文書を、妥当なXHTML（もしくはHTML）文書へと変換できるフォーマット」として、ジョン・グルーバー（英語版）により作成された。アーロン・スワーツも大きな貢献をしている[4]。
Markdownの記法の多くは、電子メールにおいてプレーンテキストを装飾する際の慣習から着想を得ている。


ふえー、そうなんですね。

まあ、でも理念というか、基本的な発想としてはこの一文に全て詰まっていると言っていいと思います。そう、
*書きやすくて読みやすいプレーンテキストとして記述した文書を、妥当なXHTML（もしくはHTML）文書へと変換できる*
ってところです。
つまり、「**プレーンテキストのまま書いてもそれなりに構造だった見た目になるし、対応のビューアーを通せばあらま立派なHTML文書になる**」ってことです。
じゃあやっぱりHTMLの知識要るやんけ！と思われるかと思いますが、そんな事はありません。
「**構造化された文書**」これがわかれば十分です。あまり聞き慣れない言葉かもしれないので、次でちょっと書いてみます。

# 構造化された文書ってなんだろう

ちょうど良さげなブログを見つけました。

[コンテンツの構造化とは何か？　構造化の目的、手段は？　Word文書のスタイル付けとマークアップの関係](http://blog.cas-ub.com/?p=5432)

>例えば、書籍は、表紙、前書き、目次、本文、後書き、奥付という大枠の構造を持つ。本文はさらに大見出し、中見出し、小見出しを必要に応じて繰り返すという構造をもつ。さらに本文の文章の中には、箇条書き、引用、表をもつという階層構造になっている。また、章や節、図表には番号をつける。注釈、参考文献は、参照元と参照先への対応関係をもつ。

まあ、そういうことなんですよ。

簡単に言えば本の目次とかイメージしてもらうと良いと思うんですが、「部・章・節」ごとに分かれて書かれてますよね。
アレです。
まずアレが基本になって、文章の中に表があったり、図があったり、箇条書きがあったり、引用があったり。インターネット文書だとそこにハイパーリンク（単に「リンク」と呼ばれてるやつです）があります。
HTMLもMarkdownも結局表現したいことはそれだけで、書き方が違うだけで同じなのです。

# いきなり全部覚える必要はないよ

ここからはいよいよ書き方の話をしていきますが、いきなり全部覚えなくても大丈夫です。
細かい書き方はそのへんどっかググっていただくとして、最低限のところだけやっていこうと思います。

# 目次（見出し）を作ろう

そこそこの分量の文章を書くときって、いきなり頭からガーッて書き下すことって少ないと思うんですよ。いや、この記事は頭から思うままに書いてますが。
だいたい、あらすじというか、先に章立てしてから中身書いていったほうが全体の見通しも立てやすいし、破綻しない文章が書けるんじゃないかなって思います。そう言えば大学の卒論を書くとき「まず目次だけ作って提出しろ」って言われたことがありました。**ダメな文章は目次からすでにダメです。**　（例：このエントリー

こんな感じに書いてみますか。ちなみにこの文章の出典元はWikipediaのドラクエ4です。
https://ja.wikipedia.org/wiki/%E3%83%89%E3%83%A9%E3%82%B4%E3%83%B3%E3%82%AF%E3%82%A8%E3%82%B9%E3%83%88IV_%E5%B0%8E%E3%81%8B%E3%82%8C%E3%81%97%E8%80%85%E3%81%9F%E3%81%A1

```
# ドラゴンクエストIV 導かれし者たち

## 第一章 王宮の戦士たち

## 第二章 おてんば姫の冒険

## 第三章 武器屋トルネコ

## 第四章 モンバーバラの姉妹

## 第五章 導かれし者たち
```

これをMarkdownビューアー（Qiita自体がそうなんだけど）に通すとこんな感じになります。

---
# ドラゴンクエストIV 導かれし者たち

## 第一章 王宮の戦士たち

## 第二章 おてんば姫の冒険

## 第三章 武器屋トルネコ

## 第四章 モンバーバラの姉妹

## 第五章 導かれし者たち
---

んー、ちょっと分かりづらいですね。
ただ、アタマに `#` が1個ついているものより2個ついているもののほうが文字がちょっと小さいと思いませんか？
そう、 `#` は見出しを表す記号で、数が増えれば増えるほど見出しのレベルが上がっていきます。見出しのレベルが上がる、って言うとどんどん偉くなっていくような気がするかもしれませんが、要は階層が深くなっていくっていうことです。社畜にわかりやすい表現するならこういうことです。

```
# 社長
## 取締役or執行役員（統轄）
### 部長（マネージャー）
#### 課長（サブマネージャー）
##### 係長（リーダー）
一般社員
```

---
# 社長
## 取締役or執行役員（統括）
### 部長（マネージャー）
#### 課長（サブマネージャー）
##### 係長（リーダー）
一般社員

---

※ちなみにカッコ内は古巣の光○信グループの役職名です

`#` がアタマにつかない行は地の文だということがわかっていただけるかと思います。行頭につける記号は必ずその後に半角スペースを1個以上入れます。1個以上なら何個でも良いですが1個にしておいたほうがおすすめです。

# 中身を入れていこう

まさか目次だけで満足しちゃってねえだろうな！？　だとしたらとんだ早r(以下検閲削除
というわけで、中身を入れていきましょう。章だけ書いてもライアンもホイミンも出てこないんじゃ寂しいですものね。

```md

# ドラゴンクエストIV 導かれし者たち

## 第一章 王宮の戦士たち

### 主な登場人物

* ライアン
* ホイミン

### あらすじ

*バトランド王国の王宮戦士* のひとりである **ライアン** が ***主人公*** 。 `王の命令` により、最近次々と起こる子供の失踪事件を解決する。

## 第二章 おてんば姫の冒険

### 登場人物

* アリーナ
* ブライ
* クリフト

### 登場人物の偉い順

1. アリーナ
2. ブライ
3. クリフト

## 第三章 武器屋トルネコ

### 登場人物

* トルネコ

### あらすじ

> 武器屋で働く商人トルネコが主人公。世界一の武器商人になることを目指し、故郷レイクナバを離れて金儲けの旅をする。トルネコの出世の過程を描くシナリオとなっており、ボス敵は登場せず、一定の金額を稼ぎ出して進めるイベントが続く。

## 第四章 モンバーバラの姉妹

### 登場人物

* マーニャ
* ミネア

### 登場人物の職業

|名前|職業|
|---|---|
|マーニャ|モンバーバラの踊り子|
|ミネア|占い師|
|殺害された父、エドガン|錬金術師|

## 第五章 導かれし者たち

### 登場人物

* 主人公

### あらすじ

~~住んでいた村をデスピサロ率いる魔物の軍団に壊滅させられ、ただ一人生き残った主人公（勇者）が旅に出る。章の前半は、ほかの7人の導かれし者たちを探すことが中心となる。全員集結後は、天空城へ行くために必要な天空の武具を集め、その過程の途中で地獄の帝王と戦う。天空の武具を全て集めた後、天空城でマスタードラゴンと謁見し、闇の世界で“第二の地獄の帝王”となったラストボスとの最終決戦に挑む。~~
```

とりあえず無理くり使いそうな要素をねじ込んでみました。
これをビューアーに通すとこんな感じです。

---
# ドラゴンクエストIV 導かれし者たち

## 第一章 王宮の戦士たち

### 主な登場人物
* ライアン
* ホイミン

### あらすじ
*バトランド王国の王宮戦士* のひとりである **ライアン** が ***主人公*** 。 `王の命令` により、最近次々と起こる子供の失踪事件を解決する。

## 第二章 おてんば姫の冒険

### 登場人物
* アリーナ
* ブライ
* クリフト

### 登場人物の偉い順
1. アリーナ
2. ブライ
3. クリフト

## 第三章 武器屋トルネコ
### 登場人物
* トルネコ

### あらすじ
> 武器屋で働く商人トルネコが主人公。世界一の武器商人になることを目指し、故郷レイクナバを離れて金儲けの旅をする。トルネコの出世の過程を描くシナリオとなっており、ボス敵は登場せず、一定の金額を稼ぎ出して進めるイベントが続く。

## 第四章 モンバーバラの姉妹

### 登場人物
* マーニャ
* ミネア

### 登場人物の職業
|名前|職業|
|---|---|
|マーニャ|モンバーバラの踊り子|
|ミネア|占い師|
|殺害された父、エドガン|錬金術師|

## 第五章 導かれし者たち
### 登場人物
* 主人公

### あらすじ
~~住んでいた村をデスピサロ率いる魔物の軍団に壊滅させられ、ただ一人生き残った主人公（勇者）が旅に出る。章の前半は、ほかの7人の導かれし者たちを探すことが中心となる。全員集結後は、天空城へ行くために必要な天空の武具を集め、その過程の途中で地獄の帝王と戦う。天空の武具を全て集めた後、天空城でマスタードラゴンと謁見し、闇の世界で“第二の地獄の帝王”となったラストボスとの最終決戦に挑む。~~

---

じゃあ順に解説していきましょうか。

### 箇条書き（リスト）

各章の「登場人物」のところが箇条書きになっているのがわかると思います。行頭に `*` または `-` または `+` をつけると番号なしの箇条書きになります。
順番が前後しますが、二章の「登場人物の偉い順」の書き方のところで分かる通り `1.`  と行頭につけると番号付きの箇条書きになります。数字は全部1にしてもちゃんと増やしても良いのです。

### 強調

一章のあらすじのところに入れましたが、強調の書き方は3通りありまして、 `*` 1個で囲むと斜体、2個で囲むと太字、3個で囲むと太い斜体になります。囲みの時は記号のあとにスペースは入れません。

### インラインコード

文の中にコードをねじ込むときに使います。「`（バッククォート）」記号で囲みます。

### 引用

三章のあらすじのところに入れましたが、行頭に `>` を入れるだけです。メールっぽいですよね。

### 表

四章の「登場人物の職業」のところに使いました。
基本的には `|` 記号で囲って表っぽくすれば良いのですが、表の2行目を見ると分かる通り、 `|---|` って行を2行目に入れると1行目が見出し行になります。

### 打ち消し線

五章のあらすじのところに使いましたが `~~` （チルダ2個）で文字を囲うとその中が打ち消しになります。

# おわりに

とりあえずこの記事はこんなもんにしておきます。
あとはどんどんジャンジャンバリバリ書きまくってみてください。
ツールに迷ったらとりあえずVSCode入れておけば大丈夫だと思いますよ。