入門・テンプレート

執筆・検証: MD Converter編集部

MarkdownをスライドPDFに変換する方法｜Marpの書き方と出力手順

MarkdownからスライドPDFを作る方法を解説。Marpの区切り、1枚の情報量、画像・表・コードの調整、ブラウザとCLIでの出力手順をまとめます。

Markdownからスライドを作る前に決めること

Markdownをスライドへ変換すると、文章の内容を再利用しながら、構成と差分をテキストで管理できます。ただし、長文をそのまま区切るだけでは読みやすい発表資料になりません。最初に次の3点を決めます。

  1. 誰に何を持ち帰ってほしいか
  2. 1枚につき一つの主張をどう置くか
  3. 配布資料ではなく、口頭説明を支える情報量になっているか

詳細をすべてスライドへ入れるのではなく、結論、根拠、次の行動を中心に組み立てます。補足が多い場合は、別の文書やリンクとして渡す方が発表中に読みやすくなります。

Marp形式の最小サンプル

Marpは、MarkdownをHTML、PDF、PowerPointなどのスライド形式へ変換できる仕組みです。通常のMarkdownに加え、水平線---をスライド区切りとして使います。PowerPoint形式で出力したい場合の方式の違いと注意点はMarkdownをPowerPointに変換するときの悩みと解決策を参照してください。

---
marp: true
theme: default
paginate: true
---

# 週次共有会

今週の結論

---

## 進捗

- 新機能を公開
- 問い合わせ時間を短縮

---

## 次の行動

1. 利用状況を確認する
2. 改善候補を決める

先頭の領域はfront matterです。marp: trueでMarp文書として扱い、themeでテーマ、paginateでページ番号を指定します。利用する変換環境によって対応するディレクティブが異なる場合があるため、出力前にプレビューで確認してください。

スライドの区切り方

区切りは見出しレベルへ暗黙に任せず、---で明示すると意図を保ちやすくなります。次の目安で分割します。

  • 話題が変わる場所
  • 結論と根拠を分けた方が理解しやすい場所
  • 表や図を大きく見せたい場所
  • 聞き手へ問いかけ、間を置きたい場所

一方、タイトルと短い補足、グラフと読み取り結果のように同時に見せる必要がある要素は同じスライドに置きます。文法上の見出し数ではなく、発表時の一呼吸を1枚の基準にします。

1枚の情報量を減らす

文書用Markdownは段落が長くなりやすいため、スライド用に次のような編集が必要です。

文書の書き方スライドでの調整
背景から順に説明する結論を見出しに置く
長い段落で条件を列挙する3〜5個程度の短い箇条書きに分ける
表へすべての数値を載せる主張に必要な列と行だけ残す
コード全体を掲載する説明する行だけ抜き出す

箇条書きの個数は絶対的なルールではありません。プレビューしたときに文字を小さくしないと収まらないなら、削るかスライドを分ける合図です。

画像・表・コードを読みやすくする

画像

画像内の小さな文字は、発表画面では読めなくなります。不要な余白をトリミングし、説明対象を大きく見せます。画像の相対パスを使う場合は、Markdownファイルとの位置関係を保ってください。リモート画像は出力時のネットワーク状態に左右されるため、重要な素材はローカルで管理する方が再現しやすくなります。

表

列が多い表は、文字を縮小するより分割します。「全データ」ではなく「このスライドで比較するデータ」に絞り、単位と基準日を見える場所へ書きます。

コード

コードは一画面で読める行数に限定し、関係のないimportや例外処理を省略します。省略したことが誤解を生む場合は、完全版へのリンクや補足資料を用意します。

テーマとCSSは内容が固まってから調整する

最初から色や装飾を作り込むと、本文量の問題をデザインで隠しがちです。まず組み込みテーマで構成を確認し、内容が固まってからフォント、色、余白を調整します。

MarpではCSSテーマも利用できますが、プロジェクトで使う場合はテーマファイルと変換設定も原稿と一緒にバージョン管理します。同じMarkdownでもテーマやフォントが変われば折り返し位置が変わるため、CIと手元で同じバージョンを使うことも重要です。

Marp CLIでPDFへ出力する

Node.jsと対応ブラウザを利用できる環境では、Marp CLIでPDFへ変換できます。公式READMEにある一回限りの実行例は次の形です。

npx @marp-team/marp-cli@latest slide-deck.md --pdf

継続的なプロジェクトではlatestへ毎回追随するより、開発依存としてバージョンを固定し、同じコマンドをnpm scriptsやCIから実行すると再現性を高められます。ローカル画像の読み込みには追加設定が必要な場合があり、信頼できないMarkdownに広いファイルアクセスを許可しないよう注意してください。詳しい要件はMarp CLIの公式READMEで確認できます。

ブラウザやエディタで出力する場合

CLIを使わない場合も確認順序は同じです。

  1. Markdownを読み込む
  2. ---ごとのスライド枚数を確認する
  3. はみ出した文字、表、コード、画像を直す
  4. PDFとして保存する
  5. 保存したPDFを全ページ見直す

変換サービスへ機密資料を読み込む前に、原稿がどこで処理されるかを確認します。ブラウザ内で変換する方式でも、外部画像やWebフォントがあれば取得先へ通信するため、必要に応じてローカル素材へ置き換えます。

発表前のチェックリスト

  • タイトルだけで各スライドの主張が分かる
  • 本文を読み上げなくても口頭で説明できる
  • 表とコードが会場や画面共有で読める大きさになっている
  • 画像の参照切れや低解像度がない
  • ページ番号、日付、版が正しい
  • PDFを実際に全画面表示してページ送りを確認した
  • 配布先でリンクが開ける

Markdownからスライドを作る利点は、変換操作そのものより、構成をテキストとして見直しやすい点にあります。まず---で話の流れを作り、各スライドの主張を一つに絞ってから、最後にテーマと細部を整えてください。

関連する基本記法はMarkdown記法ガイド、文書型PDFとの違いはMarkdownをPDFに変換する方法で確認できます。

ブラウザでMarkdownをスライドPDFに変換する