レッスン 5
プレビューと HTML エクスポート
ライブプレビュー、サニタイズされた HTML フラグメント、Markdown と HTML のどちらをコピーするかを理解します。
Markdown ツールは通常 2 つの異なる出力を提供します。
- 執筆中に読むためのレンダリングプレビュー
- HTML フラグメントが必要なシステム向けのHTML エクスポート
関連していますが、同一ではありません。
ライブプレビューが示すもの
ライブプレビューは Markdown を解析し、見出し、段落、リスト、表などの構造化コンテンツをレンダリングします。ブラウザツールでは通常 CSS でスタイル付けされた HTML 要素を意味します。
プレビューが答えるのは：「このドキュメントは読みやすいか？」
HTML エクスポートが提供するもの
HTML エクスポートは Markdown を次のようなタグに変換します。
<h1>Title</h1>
<p>Paragraph text.</p>
<ul>
<li>Item</li>
</ul>
良いツールは HTML をサニタイズし、生 HTML ブロックをアクティブコンテンツに昇格させません。
HTML エクスポートが答えるのは：「別システムに貼り付けられるフラグメントは何か？」
Markdown と HTML のどちらをコピーするか
| 宛先 | より良い選択 |
|---|---|
| GitHub README や Issue | Markdown ソース |
.md ファイルのドキュメントリポジトリ | Markdown ソース |
| CMS リッチテキストフィールド | HTML フラグメント |
| メールや内部 Wiki | HTML フラグメント（多くの場合レビュー付き） |
| コードレビュー議論 | Markdown ソース |
ほとんどの公開パイプラインは Markdown を好みます。宛先が独自のテーマを適用するためです。
プレビューテーマとエクスポート
プレビュースタイリングは快適に書くのに役立ちますが、コピーした HTML には通常プレビューテーマ CSS は含まれません（ツールが明示的にスタイル付き HTML をエクスポートしない限り）。これは正常です。
要点
構造と可読性を検証するにはプレビューを使い、次のシステムが Markdown ソースではなく意味的 HTML を必要とするときは HTML エクスポートを使います。
Markdown Preview / Markdown to HTML ツールは両方の経路をサポートします。ライブプレビューとサニタイズされた HTML フラグメントのコピー/ダウンロードです。