Markdownを使ってブログの作成を素早く効率化!

      2016/08/15


ブログを書くスピードを上げる方法として、Markdownというマークアップ言語を使った記載方法があります。

特徴としては、
・軽量マークアップ言語
・プレーンテキスト形式で書いた文書からHTMLを生成できる
・読みやすく、書きやすい
・学習コストが低い
といったことがあげられると思います。

使い方を覚えるため、Markdownの記法について調べてまとめました。

1.ヘッダ h

先頭に#を付ける。#の数でh1~h6が決まる。


# ヘッダ1
## ヘッダ2
### ヘッダ3
        

h1とh2に関しては、文字列の下に==や--を記載する書き方も出来る ※h1は== h2は--


ヘッダ1
==
        

2.段落 p

段落は以下のように空行を入れればいい。自動で一つ一つがPタグになる。


だんらく1

だんらく2
        

3.改行 br

行の末尾にスペースを2つ付ける。

4.水平線 hr

ハイフンかアスタリスクかアンダーバーを3つ連続で書けばよい。
※スペースで区切って書いてもよい。

5.強調 em、strong

アスタリスクかアンダーバーで囲む。
※emは1文字で囲む、strongは2文字で囲む。


*aaaa*  
**aaaa**
        

使用例:
aaaa
aaaa

6.引用 blockquote

先頭に、"> " を付ける。入れ子も出来る。


> 引用てすと
>> 引用入れ子てすと
        

使用例:

引用てすと

引用入れ子てすと

7.コードブロック code

バッククォートで囲む。
複数行のコードをまとめてコードブロックにするには、tabかスペース4つ以上でインデントする。

8.リスト ul ol

ul

アスタリスクかプラスかマイナスを先頭に付ける。


- item1
- item2
        

ol

数字の後にドットとスペースを続けて書く
※先頭の数字は、数字であれば何でもよい。


1. item1  
2. item2  
        

9.リンク a

自動リンク、インラインリンク、外部参照リンクがある。

自動リンク

アドレスやメールアドレスを<と>で囲めばよい。


<http://illarena.com>
        

使用例:
http://illarena.com

インラインリンク

大括弧[]の中にリンクテキストを書く。
続けて、丸括弧()の中にURLを書く。
タイトル属性も指定出来る。
丸括弧内に続けてダブルクォーテーションで括ったテキストを書けばよい。
※マウスカーソルをリンク上にホバーすればタイトル文字が確認出来る。


[illarenaへのリンク](http://illarena.com "イラレナ")
        

使用例:
illarenaへのリンク

外部参照リンク

リンクテキスト部分は、インラインリンクと同様、大括弧[]の中にリンクテキストを書く。
続けて、大括弧[]の中にIDを書く。
次行以降に、[上記ID]: リンク先を記載する。
さらに後ろに続けてタイトル属性の指定も可能。


[illarenaへのリンク][1]  
[1]: http://illarena.com "イラレナ"  
        

使用例:
illarenaへのリンク

10.画像 img

ビックリマークの後ろにALT属性のテキストを大括弧で括る。その後ろに画像のパスを丸括弧で括り、続けてタイトル属性。
外部参照のような記載方法も可能。


![キウイの画像]("kiwi1.png" "キウイです")

![キウイの画像][3]
[3]: ("kiwi1.png" "キウイです")  
        

使用例:
キウイの画像

11.インラインHTML

普通にHTMLを書けばよい


<a href="http://illarena.com">illarenaへ</a>
        

使用例:
illarenaへ

12.エスケープ

バックスラッシュを先頭に付ける


`#タイトル
        

まとめ

Markdownは使い始めたばかりですが、ブログの作成にも効率化を図れそうだと感じました。

 - ツール , ,