見出しとテキスト

テキストの書式設定、見出しの作成、コンテンツのスタイリング方法を学ぶ

ヘッダー

ヘッダーはコンテンツを整理し、ナビゲーションのアンカーを作成します。目次に表示され、ユーザーがドキュメントを効率よく見渡せるようにします。

見出しの作成

# 記号を使って、見出しのレベルを指定します:

## セクションの見出し
### サブセクションの見出し
#### サブサブセクションの見出し

以降の内容を明確に示す、説明的でキーワードを盛り込んだ見出しを使いましょう。これにより、ユーザーの操作性と検索エンジン最適化の双方が向上します。

アンカーリンクを無効化する

デフォルトでは、見出しにはクリックできるアンカーリンクが付き、ユーザーは特定のセクションへ直接リンクできます。HTML または React の見出しで noAnchor プロップを使うと、これらのアンカーリンクを無効化できます。

HTML header example

<h2 noAnchor>
Header without anchor link
</h2>

noAnchor を使用すると、見出しにアンカー用のチップは表示されず、見出しテキストをクリックしてもアンカーリンクはクリップボードにコピーされません。

テキストの書式設定

テキストの強調やスタイル設定のために、ほとんどのMarkdownの書式に対応しています。

基本的な書式

次の書式スタイルをテキストに適用します：

スタイル	構文	例	結果
太字	**text**	**important note**	important note
斜体	_text_	_emphasis_	emphasis
取り消し線	~text~	~deprecated feature~	deprecated feature

形式の組み合わせ

書式スタイルを組み合わせることができます:

**_bold and italic_**
**~~bold and strikethrough~~**
*~~italic and strikethrough~~**

太字と斜体
太字と取り消し線
斜体と取り消し線

上付き文字と下付き文字

数式や脚注には HTML タグを使用します。

種類	構文	例	結果
上付き文字	<sup>text</sup>	example<sup>2</sup>	example2
下付き文字	<sub>text</sub>	example<sub>n</sub>	examplen

リンク

リンクは、ユーザーがページ間を移動したり、外部リソースにアクセスしたりする際に役立ちます。わかりやすいリンクテキストを用いて、アクセシビリティとユーザーエクスペリエンスを向上させましょう。

内部リンク

ルート相対パスを使って、ドキュメント内の他ページへリンクします:

[Quickstart](/quickstart)
[Steps](/components/steps)

Quickstart
Steps

[page](../page) のような相対リンクは、読み込みが遅く、ルート相対リンクほど最適化しづらいため、使用は避けてください。

外部リンク

外部リソースには、フルURLを含めてください:

[Markdown Guide](https://www.markdownguide.org/)

Markdown Guide

リンク切れ

CLI を使ってドキュメント内のリンク切れをチェックできます:

mint broken-links

引用

引用は、コンテンツ内の重要な情報や引用、例を目立たせるために用いられます。

1行の引用ブロック

引用ブロックを作成するには、テキストの前に > を追加します：

> This is a quote that stands out from the main content.

メインコンテンツから際立つ引用です。

複数行の引用ブロック

長い引用や複数段落にする場合:

> This is the first paragraph of a multi-line blockquote.
>
> This is the second paragraph, separated by an empty line with `>`.

これは複数行の引用ブロックの最初の段落です。

これは2つ目の段落で、> を付けた空行で区切られています。

視覚的な効果と意図を保つため、引用ブロックの使用は控えめにしましょう。メモ、警告、その他の情報にはコールアウトの使用を検討してください。

数式表現

数式や方程式の表示には LaTeX をサポートしています。

インライン数式

インライン数式には $ を使用します:

The Pythagorean theorem states that $(a^2 + b^2 = c^2)$ in a right triangle.

直角三角形では、ピタゴラスの定理は $(a^2 + b^2 = c^2)$ を示します。

ブロック方程式

独立した数式には、二重ドル記号 $$ を使用します：

$$
E = mc^2
$$

$$E = mc^2$$

LaTeX を利用するには、正しい数式の構文が必要です。構文の詳細なガイドラインについては、LaTeX のドキュメントを参照してください。

改行と余白

余白や改行を調整して、コンテンツの可読性を高めます。

段落の区切り

段落は空行で区切ります：

This is the first paragraph.

This is the second paragraph, separated by a blank line.

これは最初の段落です。

これは2つ目の段落で、空行で区切られています。

手動の改行

段落内で強制的に改行するには、HTML の <br /> タグを使用します:

This line ends here.<br />
This line starts on a new line.

この行はここで終わります。
この行は新しい行から始まります。

多くの場合、手動の改行よりも空行で段落を分けたほうが可読性が高くなります。

ベストプラクティス

コンテンツの構成

• 見出しで明確な情報の階層を作る
• 正しい見出し階層に従う（H2 から H4 へ飛ばさない）
• 説明的でキーワードを盛り込んだ見出し文を作成する

文字装飾

• 強調には太字を使い、段落全体には使わない
• 斜体は用語やタイトル、控えめな強調に限って使う
• コンテンツの理解を妨げる過度な装飾は避ける

リンク

• 「こちらをクリック」や「続きを読む」ではなく、内容が分かるリンクテキストを使用する
• 内部リンクにはルート相対パスを使う
• リンク切れを防ぐために、定期的にリンクを確認・テストする