「今より早く記事を書きたい」
「効率よく書く方法はないか?」
Webライティングに携わっていると、こう思うことがあります。
そこで当記事では記事をよりスピーディに書く手段として「マークダウン記法」をご紹介いたします。よくあるマークアップとの違いも含めて解説しています。
マークダウン記法とは
マークダウン記法とは、Web上で文章を書きやすく&見やすくするために生まれた記法です。
通常はテキストを書いて、それらのフォントサイズを変えたり、装飾を加えて読みやすく整理します。見出しをつけて階層化したり、箇条書きにしたりしますよね。
ただ、綺麗な見出しや段落を作るには手間がかかります。HTMLを使うにしても多少の知識が必要です。そのような手間を省けて、文章作成を効率化できるのが、マークダウン記法です。
マークアップとの違いは?
マークアップ言語と混同されることも多いのですが、マークダウン記法は、マークアップ言語を簡略化したものとして認識いただければOKです。
例えば、マークアップ言語であるHTMLでh2見出しを表現する場合、以下のようになります。h2タグでテキストを囲むわけです。
一方でマークダウン記法なら、これだけで表現できます。テキストの前に##を二つつけるだけです。
マークアップ言語は、用途別のタグを覚えた上でテキストをマークアップする(囲んで指定する)必要がありますが、マークダウン記法ではその必要はありません。簡略化された規則さえ覚ええれば、誰でも簡単に使えるわけです。
基本的なマークダウン記法
基本的なマークダウン記法の中でも使いやすいものをピックアップしてご紹介いたします。これだけでも十分使えるはずです。※基本的にすべての記号は半角で入力してください。
見出し
見出しの前に#をつけて半角スペースを空けます。#の数で見出しの種類が変わります。
- 記述例
- 実際の表示例


箇条書き(リスト)
箇条書きにしたいテキストの前に「-」をつけるだけでOKです。※記号とテキストの間に半角スペースを入れてください。
- 記述例
- 実際の表示例


ナンバリング
ナンバリングしたいテキストの前に数字とピリオドを打つだけでOKです。この時数字はなんでも構いません。順番通りに数字が割り振られます。※ピリオドとテキストの間に半角スペースを入れてください。
- 記述例
- 実際の表示例


太字(強調)
強調したい単語や文章を「**」で囲むと、太字で表示されます。
- 記述例
- 実際の表示例


引用
引用したい部分の前に「>」をつけます。メーラーやチャットツールなどでも使えるものが多いです。
- 記述例
- 実際の表示例


取り消し線
取り消したい文章を「~~」で囲みます。追記しつつ、元のテキストを残しておきたい際に便利です。「~」は、JISキーボードの場合、shit+「へ」で入力できます。
- 記述例
- 実際の表示例


リンク
リンクさせたいテキストを[]で囲み、その隣に()でURLを記載します。※すべて半角
- 記述例
- 実際の表示例


無料で使えるマークダウン対応エディター
特別なツールやアプリでなくてもマークダウン記法で書くことはできますが、対応したエディターを使うと見え方をプレビューできたり便利です。マークダウン対応のエディターは豊富にありますが、有名どころと筆者おすすめのものをご紹介いたします。
- Atom
- Visual Stuido Code
- Typora
Atom
マークダウンはもちろん、プログラムを書くエンジニアにも支持されているGithub開発のエディターです。
Visual Stuido Code
Microsoft開発のソフトで、マークダウン以外にも多機能で非常に人気のあるエディターです。
Typora
マークダウン対応という点のみであれば、こちらをオススメいたします。プログラムなどを書くには不向きですが、マークダウン式でメモを取る or 記事の下書きをする方には最適なエディターです。
マークダウンで文章作成を効率化しよう
マークダウン記法を活用すると文章を整理したり、テキストを装飾するのがスムーズです。ざっと以下のようなメリットがあります。
- HTMLより直感的で覚えやすい
- 記述がシンプルで視認性がいい
- 文章の作成・整理のスピードが上がる
- マークダウン対応エディターが豊富
シンプルな記号のみでテキストを装飾・整理できるので、すっきりと見やすく入力もスピーディーです。ブログ記事の下書きやちょっとしたメモを取る際にも役立つので、ぜひ活用してみてください。
コメント