- Markdown記法って覚えること多いの？
- どうやって書けばいいのかわからない
- 何から覚えたらいいの？
この記事では実際のプレビュー画面を表示した画像を使用してMarkdown記法の書き方を初心者にもわかりやすく解説しているので、直感的に学ぶことができますよ！
初めてMarkdown記法を学ぼうと思っている方は、この記事で解説するMarkdown記法の解説を確認しながら、1,2回ブログ記事を頑張って書いてみてください。
ただ読むよりも実際に実践しながらだとすぐに覚えれます！
僕はMarkdown記法を覚えたことで、これまで3日かかっていたブログ記事執筆が今では3～5時間にまで短縮することができ、1日1記事ペースで難なく書けるようなりました！
この機会にあなたもぜひMarkdown記法をマスターしましょう！
Markdown記法のことがまだ良くわからないという方は、まずは以下の記事をご覧ください。
Markdown記法の書き方
MarkdownではHTMLで表す見出しやテーブル(表)、リスト(箇条書き)、引用などなど様々なタグに対応した簡単な記号で書くことができます。
さっそく各タグの書き方について簡単な解説と画像でわかりやすく解説していきますね！
なお、解説内で使用している各実例画像はVSCodeを使用して右側にリアルタイムプレビューを表示した画像です。
※画像内入力画面に時々表示されている黄色波線は気にしないでください。
VSCodeの導入方法は以下の記事をご覧ください。
よく使うMarkdown記法
見出し
行頭に『#』を付けると見出しになります。
- 『#』のあとは必ず半角空白を入力します。
通常リスト/箇条書き(HTML：ul)
行頭に『–』『+』『*』を付けると箇条書きリスト(HTML：<ul>)になります。
- 各記号のあとは必ず半角空白を入力
- リストの上下は空白行
ネスト(入れ子)
リスト内で記号の前に半角空白を入力することでさらにリストを入れるネスト(入れ子)も可能です。
- ネストリストの場合は上下空白行は不要で、最上位リストの上下に空白があればOK
順序リスト/箇条書き(HTML：ol)
行頭に『1.』や『2.』を付けると箇条書きリスト(HTML：<ol>)になります。
- 『1.』や『2.』のあとは必ず半角空白を入力
- リストの上下は空白行
引用
行頭に『>』を付けると引用になります。
また、引用内で他Markdownタグを利用することも可能です。
- 『>』のあとは必ず半角空白を入力
- 引用の上下に空白行(引用が長く続く場合は、最初と最後の行だけでOK)
- 1行が長く続いて折返しただけなら最初の行頭のみでOK
- 引用内で改行する場合は再度行頭に『>』を付ける
テーブル(表)
『|』で囲むことでテーブル表示になります。
最上段がヘッダ行、2段目でテーブルセル内の位置指定(左寄せ、右寄せなど)をします。
- 2段目のセル内位置指定は必ず記載
水平線
『*』『–』『_』のいずれかを3個以上連続入力で水平線になります。
たまに使うMarkdown記法
テキスト装飾【太字】
『**』または『__(アンダースコア2個)』で文字を囲みます。
1つで囲めばイタリック、2つで囲めば太字になります。
テキスト装飾【イタリック(斜め文字)】
『*』または『_』で文字を囲みます。
テキスト装飾【取り消し線】
『~~(チルダ2個)』で囲むと取り消し線が表示されます。
リンク
『[文字列](URL)』の形式で入力します。
画像
『』の形式で入力します。
『Alt』は画像が何を意味するのか文字で表現するための代替文字のことで、SEO対策に有効です。
『”補足説明”』(HTML：title属性)はマウスを載せた時にポップアップで小さく表示される補足説明のようなもののことで、省略OKです。
コード
『`』で【HTML・CSS・PHP等】のコードを囲むと、ただの文字として表示できるようになります。
『`』一つで囲めばインライン(文中内表示)として、『“`』3つで囲めば行単位でブロックとして使えます。
- ブロックで囲む場合は上下に空白行
コード表示はほとんどの方が使うことはないと思いますが、例えばブログ記事上でHTMLタグや本記事のようにMarkdownの解説をしたい時に役立ちますね！
例えば、先程のリンクのMarkdown記法での書き方の解説ですが、そのままWordPressに貼り付けると以下のようにコードとして認識されてしまい、コード自体の説明になっていません。
そこで、『`』で囲むとコードではなく文字として認識されるため、しっかりとコードの解説ができるようになるわけですね。
まとめ
一通りMarkdown記法を見てみると、意外と覚えることは少ないことがわかったかと思います。
たったこれだけを覚えるだけで、ブログ作成スピードが劇的に早くなるなら覚えないほうが損ですね！
1,2回Markdown記法で記事を書けば自然とほとんど覚えることができるので、ぜひ頑張ってみてください！
さらにブログ1記事書く時間を短縮したい方は以下記事も参考にしてみてくださいね。
▼ コメント ▼