web-writing

メモ帳でも手軽に記述でき、シンプルで直感的に覚えられるマークダウン記法をご紹介します。
もとがHTMLの簡易記法のためWeb用の原稿書きにはもちろんの事、MS-WordやPDFなどへも変換でき、汎用性も高い便利な記法です。また、文書の構造も同時に記述するため、立体的な文書作成が身につきます。

マークダウンとは

Markdown(マークダウン)は、文書を記述するための軽量マークアップ言語のひとつである。
もとはプレーンテキスト形式で手軽に書いた文書からHTMLを生成するために開発された。現在ではHTMLのほかパワーポイント形式やLATEX形式のファイルへ変換するソフトウェア(コンバータ)も開発されている。各コンバータの開発者によって多様な拡張が施されるため、各種の方言が存在する。 引用元:http://ja.wikipedia.org/wiki/Markdown

拡張子は***.mdとなります。

必ず覚えたいマークダウンの4つのルール

左はマークダウン記法で記述し、同じ内容を右はhtmlで記述しています。
私自身も下書きは左のマークダウン記法で書き、ソフトを使ってhtmlに変換・修正して原稿を作っています。

つまりマークダウン記法を使うと、htmlと同じ正確な文書構造が伝わります。

見出し

mark down html
#見出しレベル1 <h1>見出しレベル1</h1>
##見出しレベル2 <h2>見出しレベル2</h2>
###見出しレベル3 <h3>見出しレベル3</h3>
####見出しレベル4 <h4>見出しレベル4</h4>
#####見出しレベル5 <h5>見出しレベル5</h5>
######見出しレベル6 <h6>見出しレベル6</h6>

改行と段落

改行

markdown html
改行するには␣␣
半角スペースを2つ入れてから改行
改行するには <br>
半角スペースを2つ入れてから改行
※␣は半角スペースです。また半角スペースが2つないと改行されません。

段落

markdown html
段落を分けるには・段落を分けるには・段落を分けるには・段落を分けるには・段落を分けるには

1行開ける・1行開ける・1行開ける・1行開ける・1行開ける

<p>段落を分けるには・段落を分けるには・段落を分けるには・段落を分けるには・段落を分けるには</p>

<p>1行開ける・1行開ける・1行開ける・1行開ける・1行開ける</p>

強調

markdown html
**強調したい部分**をアスタリスク2つで囲む <strong>強調したい部分</strong>をアスタリスク2つで囲む

リンク

markdown html
[リンクテキスト](http://example.com) <a href=”http://example.com”>リンクテキスト</a>

できれば覚えたいマークダウンのルール

箇条書き

markdown html
– 箇条書きは行頭に半角ハイフン+スペースをつける
– オーダーリストは行頭に半角数字+スペースをつけます(一部認識しない場合もあります)
– 入れ子にすることもできます
<ul>
<li>箇条書きは行頭に半角ハイフン+スペースをつける</li>
<li>オーダーリストは行頭に半角数字+スペースをつけます</li>
<li>入れ子にすることもできます</li>
</ul>

引用

markdown html
>引用したい文章の前に大なりをつける <blockquote>引用したい文章の前に大なりをつける</blockquote>

マークダウンで実際に記述してみる

それでは、ここまでの記事の部分をマークダウン記法で書いてみます。記事内ではテーブルタグが多用されていますので、その部分は箇条書き等に置き換え、内容も修正しています。

#記事を書くならマークダウン記法がおすすめ

メモ帳でも手軽に記述でき、シンプルで直感的に覚えられるマークダウン記法をご紹介します。  
もとがHTMLの簡易記法のためWeb用の原稿書きにはもちろんの事、MS-WordやPDFなどへも返還でき、汎用性も高い便利な記法です。また、文書の構造を同時に記述するため、立体的な文書の作成が身につきます。

##マークダウンとは
>Markdown(マークダウン)は、文書を記述するための軽量マークアップ言語のひとつである。  
もとはプレーンテキスト形式で手軽に書いた文書からHTMLを生成するために開発された。現在ではHTMLのほかパワーポイント形式やLATEX形式のファイルへ変換するソフトウェア(コンバータ)も開発されている。各コンバータの開発者によって多様な拡張が施されるため、各種の方言が存在する。

引用元:http://ja.wikipedia.org/wiki/Markdown

##必ず覚えたいマークダウンの4つのルール
左はマークダウン記法で記述し、同じ内容を右はhtmlで記述しています。  
私自身も下書きは左のマークダウン記法で書き、ソフトを使ってhtmlに変換・修正して原稿を作っています。  

**つまりマークダウン記法を使うと、htmlと同じ正確な文書構造が伝わります。**

###見出し
1 見出しレベル1
2 見出しレベル2
3 見出しレベル3
4 見出しレベル4
5 見出しレベル5
6 見出しレベル6

###改行と段落

####改行
- 改行するには␣␣
- 半角スペースを2つ入れてから改行
- 半角スペースを2つ入れてから改行

※␣は半角スペースです。また半角スペースが2つないと改行されません。

####段落
段落を分けるには・段落を分けるには・段落を分けるには・段落を分けるには・段落を分けるには
 
1行開ける・1行開ける・1行開ける・1行開ける・1行開ける

###強調
**強調したい部分**をアスタリスク2つで囲む

###リンク
[リンクテキスト](http://example.com)

##できれば覚えたいマークダウンのルール

###箇条書き
- 箇条書きは行頭に半角ハイフン+スペースをつける
– オーダーリストは行頭に半角数字+スペースをつけます
– 入れ子にすることもできます

###引用
>引用したい文章の前に大なりをつける

マークダウンで書いたコードをhtmlに変換する

マークダウンで書いたコードが実際にどのようなhtmlに変換されるのか、オンラインサービスで確認してみましょう。

  1. 上記コードをコピー
  2. Online Markdown Editorにアクセス
  3. 左のボックスにコピーしたコードをペースト
  4. 右上のメニューからHTML Outputを選択
  5. 右ボックスに生成されたhtmlコードが表れます

また、pdfに直接変換したい場合は、DILLINGERが便利です。

マークダウンを詳しく知りたい方へ

以上のルールが基本的なものです。興味のある方は、グーグル検索などを使って情報を得てください。

マークダウン記法については、「マークダウン・記法」などで、Webサービスについては「マークダウン・オンライン・エディタ」などで検索してみてください。

カテゴリー:Web-Writing