【HP引っ越し企画】マークダウンのすすめ

はじめに

昨年（2025年）の末に行われた弊社（三技協）のホームページリニューアルに伴い、自由なスペースで勝手に更新していた我々のブログも、会社のホームページ管理システム（某社のシステム）へ統合されることになりました。

もともとのこのブログは、会社ホームページ内にフォルダを割り当ててもらい、（悪いことしなければ）好きに使って良いとされスタートしました。そのため、個人の趣味もありますが、できるだけ軽く作ろうというコンセプトの下、完全手書きのHTML/CSSでフレームを作って運用していました。普段の記事はVS Code（Visual Studio Code）を使ってマークダウン形式で書いていました。そして、記事更新時にマークダウンのテキストをHTML変換して、それを手書きHTMLのメインフレームへ埋め込んで（コピペして）いました。そのため、リニューアル前のブログは、阿部寛ホームページ^※1とまではいかないまでも、とても軽いページだったと自負しております。

しかし、今皆様が読んでいるであろうこのブログは、弊社が契約したホームページ管理システム上で動いています。いわゆるSaaSというやつでブログの更新はすべてWeb上で完結することができ、さらにアクセス解析など色々な機能が標準で付いてきます。それは一般的には便利なのでしょう。しかし、下図のようにブログ記事の編集をWebページ上で動くGUIの書式メニューで行うスタイルってどうなんでしょう？　多分、エンジニアではない方ならこのスタイルが良いのだと思います。だから、企業向けシステムとして、GUIで記事を書かせること自体には理解ができます。

GUIベースの編集画面
_{ブラウザの仕様なのかカーソルが変なところに飛ぶことも多く大変}

しかし、一応我々はHTML/CSSを手書きできるし、プログラミングやCADの連載もする程度にはリテラシーもある（はず）。それに、我々は先に書いたようにVS Codeでブログ記事を書いていました。VS Codeならば、サジェスト機能やスペルチェックが使え、最近はGeminiやCopilotのAIアシストもあります。また、右側にプレビューを出しながら書けるので、テキストのマークダウンで書きながらも、最終的な見た目を確認しながら書ける。しかも、テキストエディタ（という体）なので非常に軽い。ITに詳しい人であれば、「VS Codeを使ってマークダウンで書く」という方法はブログ作成の一つの完成形だと理解して頂けるはずです。

それなのに、新システムの（大変失礼ながら）編集がし易いとは思えない二世代前のGUIで毎週数千字のブログを書けというのは、正直苦痛以外の何物でもない。業界では結構メジャーなシステムなので使っている人も多いでしょうに、みんなどうやってブログを書いているんだろう・・・　せめて、マークダウン形式だけでも対応してくれれば、VS Codeで編集して貼り付けるだけなので、誰にとってもハッピーなのに。

ということで、社内のホームページを管理をしている広報担当や、この新システムの業者さんの担当者にも、「マークダウンで書けないのか？」と質問してみました。しかし、みんな？？顔。え？もしかしてマークダウンを知らないとか？私が「Qiitaとかの記事はマークダウンで書かれてますよね？」と言っても、Qiitaって何状態。そっか、Qiitaなんてエンジニアしか読まないか。マークダウンの知名度って、もしかして低い？

というわけで、今回はエンジニアなら誰でも使っているが、そうでない人は名前も知らない、この「マークダウン」について、非エンジニアの一般の方々へ紹介する記事を書きたいと思います。

そもそもマークダウンとは何なのか？

マークダウンは、2004年に開発された、テキストエディタで書いた普通のテキスト文書からHTMLを生成するために開発された書式（マークアップ言語）です。アメリカのジョン・グルーバーというエンジニアが、主にAppleファン向けのブログを執筆・運営していたのですが、その際により簡単にブログが書ける方式として開発されたのが、このマークダウンです。

マークダウンの書式で書くと、ツールを使ってそのままHTMLの文章に変換できるようになっています。テキストエディタで書いたプレーンなテキストを、見た目そのままでHTML化出来ると考えて貰うのがいいかと思います。ですから、マークダウンでブログを書けば、何の調整の必要も無く、即HTMLへ変換でき、ブログをアップできるというわけです。

さて、マークダウンはブログを書きやすくするために開発されたわけですが、ジョン・グルーバーが特に重視したのは書きやすさよりも「読みやすさ」でした。書きながら読めないと意味が無いと考えたのでしょう。ですから、マークダウンは、見た目はほとんど「ただのテキスト」になっています。HTMLテキストのようなごちゃごちゃとしたタグは存在しません。この辺、言葉で説明しても分からないと思うので、下の図を見てください。

マークダウンからHTMLへの変換
_{VS Code上のマークダウンの見た目（左）、HTMLの表示（右）}

"#"を行頭に付けると見出しとして扱われます。"#"の数が見出しレベルです。太字にしたければ文字列を"**"で囲うだけです。箇条書きは行頭に"- "を付ければ良いです。数字の箇条書きは"1. "を付けるだけ。タブでインデントレベルを下げることもできます。

他にもテーブルだったり、ハイパーリンクだったりルールは色々あるのですが、基本的に見た目はそれほど複雑にならないのに、HTMLでやりたい表現はおおよそできる、というのがマークダウンの良いところです。生のHTMLテキストのあの複雑なタグが無くても、おおよそ同じような見た目になるんです。見た目も中身もただのテキストなのに、それなのにHTMLの複雑なタグを使った表現ができる、これがマークダウンです。

マークダウンを普通のテキストエディタで書いても問題はありませんが、最近はマークダウンに対応したテキストエディターも多いので、そういったエディターを使えば、HTMLに変換すること無く、色や大きさを変えたり、自動的にインデントしてくれたりします。例えば、"#"があるところを見出しの色にするなど、おおよそ見た目を合わせてくれます。

繰り返しになりますが、マークダウンはプレーンテキストで記述し、見た目もほぼプレーンテキストでありながら、HTMLで装飾したような文章が書けるという書式（正確に言うとマークアップ言語）なのです。だから、世界中の多くの人（特にエンジニア）が使用しています。今回は、その素晴らしさを皆様へご紹介しようと思っています。

尚、今回は、マークダウンの良さを紹介する記事のため、マークダウンのルールや書き方には触れません。マークダウンの書き方などはこちらのページをご覧下さい。

なぜマークダウンをおすすめするのか？

さて、私がなぜブログをマークダウンで書くのか、そしてなぜ非エンジニアの皆様にもお勧めするのか、いくつかの理由を説明したいと思います。

• ほぼ普通のテキストとして書ける

  何か文章を書いているとき、いちいちGUI操作で太字にしたり、箇条書きにしたりするのは面倒ですよね。特に、リアルタイムでメモを取っているときとかに、いちいちマウスを触って操作すると遅くなる。マークダウンなら全てテキストですから、タイピングを止める必要はありません。少しの違いのように見えますが、これが慣れると大きな体感の差となります。

• そのままでも読みやすい

  さきほど、マークダウンは「読みやすさ」を重視して作られたと書きました。実際にマークダウンで文章を書くと分かるのですが、見た目はほとんど「ただの文章」なんですよね。だから、HTMLにする前のそのままの文章でも、十分に「見やすく整理されたプレーンテキスト」なんです。さらに、VS Codeのようなマークダウンエディターを使えば、リアルタイムに見た目を表示してくれますので、より読みやすい環境を作ることもできます。

  
  VS Codeでこの記事を編集中の画面
  _{右にプレビューを表示できるため、見た目を意識して書くこともできる。}

• どんなツールでも書ける

  マークダウンはそもそもプレーンテキストです。したがって、テキストが書けるツールならどんなツールでも書けます。Windows標準のメモ帳でも良いですし、専用のテキストエディタでもよい。マークダウンの大きなメリットは、ツール依存に依存しない点です。例えばMSのWordで文章をつくれば、確かに様々な機能が使えて、綺麗で豪華にできます。しかし、その書式はWord上だけ、良くて他のOffice製品上だけの表示に留まります。ツールを跨ぐと、書式が完全に失われることが多いです。しかし、マークダウンはただのテキストです。単にテキストが書式も表しているだけです。見た目は表示するツール次第のところがあり完全には一緒にはなりませんが、それは同じWebページを見てもブラウザによって見た目が多少異なるのと同じレベルの話です。どんなツールでもOKというメリットを消すようなデメリットではありません。

• 過去の資産が無駄になることが無い

  どんなツールでも書けるという点とも繋がりますが、マークダウンは元を正せば「ただのテキスト、ただの文字情報」です。しかも、HTMLテキストとは異なり人間にも読みやすい形式ですので、そのままでも立派な文章です。だから、もし10年後、20年後マークダウン方式が時代遅れになり、対応ツールがなくなったとしても、マークダウンで書いたそのテキストが読めなくなるとか、価値が無くなるとかそういった心配がありません。「データが腐らない」のは、マークダウンの長所です。

さて、3番目のメリット「どんなツールでも書ける」という特長は、その書式が広まるにつれ、様々なツールでも使えるようになる、という事でもあります。HTMLが今や様々なブラウザ、ツールで表示できるように、マークダウンも様々なツールで編集・表示できるようになってきています。私がこの文章を書いているMicrosoftのVS Codeは最も有名なマークダウンのエディターですが、それ以外にもマークダウンに対応しているツール、アプリは沢山あります。今回は、そのいくつかを紹介いたします。しかし、紹介するこれらいずれもが「マークダウンエディター」とは謳われていないアプリであることを留意してください。

アプリの対応例

下の様にマークダウン方式で書いたプレーンテキストがあったとします。何の機能も無いメモ帳で書いたと思ってください。

このテキストを紹介する各ツールへ貼り付けるとどうなるか？を見て頂きたいと思います。改めて言いますが、見ての通り、そのまま読めるただのテキストです。

テキストエディタ（Mery）

私はテキストエディタとしてMeryを使っています。軽いのに高機能なこのテキストエディターは、Windows標準メモ帳の代わりにテキストファイルに関連付けして使用している人が多く、私もその一人です。そんなテキストエディターでも、設定は必要なもののマークダウンが使えます。下の画像は、上のサンプルテキストをテキストエディタMeryに貼り付けた例です。見出しや箇条書きに対応していて、見た目が変わります。もちろん、VS Codeのように高機能ではありませんが、ちょっとしたメモを見やすく書く用途であれば十分と思われます。

Meryでマークダウンを表示した例
_{プラグインによりアウトライン表示やプレビューを出すことができる。}

Microsoft Teamsの投稿欄

使っている人も多いであろうコミュニケーションツールである、MicrosoftのTeamsも、実はMarkdownに対応しています。コピペではマークダウンにならないのですが、普通に記述（入力）すればマークダウンになります。この例では箇条書きがちょっと崩れていて苦手なのが露呈していますが、それ以外はおおよそ問題ありません。また、チャットという性質上、引用にはきっちり対応しています。更に言えば、Teamsはコードブロック^※2にも対応しています（しかし、残念ながらマイクロソフトなのにF#には対応していない！）。Teams使用の際、多くの人が書式を変えるときにはGUIで操作すると思いますが、その裏でこっそりマークダウンの書式に対応しているんですね。皆さんも、今後メッセージを送信する際は、マークダウンで書いてみてはいかがでしょうか？

Microsoft Teamsでマークダウンを表示した例
_{箇条書き（インデント機能）が弱いし、太字はGUI操作が必要。でも、引用、コードブロック対応。}

Windows11のメモ帳

最後ですが、一番伝えたかったことを。皆さんが使っているそのWindowsの標準のメモ帳。実は、マークダウンに対応しています。[ファイル]メニューを開くと、"[新しいマークダウン]タブ"という項目があるのですが、気付いていましたか？これを選べば、マークダウン対応のメモ帳になります。引用、テーブルなど高度なものには対応していませんが、日常のメモ取りに必要な書式には対応しているようです。そう、マークダウンの環境を整えるのが面倒と思っているあなたも、今すぐマークダウンでメモが取れる環境が作れるのです！！マークダウンに触れたことのない人は、まずはメモ帳から試すのがいいかもしれません。

尚、Windowsメモ帳の細かい仕様はMicrosoftが公開していませんので、詳細を知りたい方はこちらをご覧下さい。

Windows11のメモ帳でマークダウンを表示した例
_{引用、テーブル、コードブロックには対応していない}

まとめ

というわけで、皆さんもマークダウンで何か書いてみたくなりましたか？なりましたよね？最近はiPhoneのメモまでマークダウンに対応しましたし、近いうちにあらゆるテキストエディタがマークダウン対応になるかもしれません。

なぜ、これほどまでにマークダウンが普及しているのか？その理由として「マークダウンの書式を意識すると、結果的に論理的なテキストになる」ということを挙げる人もいます。特に、マークダウンでメモを取ったりすると、普通にテキストで書くときと比べて見出しと箇条書きを意識せざるを得ないので、自然と論理的な文章構造になると言われています。

もし今後、マークダウンでテキストを書いてみたいと感じたら、Windowsのメモ帳も良いですが、是非エディターを使ってみることをおすすめします。おすすめのエディターを紹介しているページもありますので、参考にしてみて下さい。ちなみに私は、このブログを書く時はVS Code、メモを取る時は前述のページでも紹介されているBoostnoteを使っています。皆様も、どんなツールでも良いので、まずはマークダウンに触れてみることをおすすめします。きっと、すぐに手放せなくなること請け合いです。