マークダウンを覚えよう!(これはh2)
文章を視覚的に調整する
コンテンツというのはとりあえずは「タイトルと文章のみで成立」してしまうものです。
しかし、同じ文章でも視覚的に工夫を施せば情報が整理され、読み手にとってわかりやすくなります。
情報を視覚的に整理するには主に次の要素があります。
- 見出し
- 強調
- 改行
- 表作成
- リスト化
- サイトの引用
- 画像表示
- 区切り線
またHTMLにおいては特殊な使い方として「整形済みテキスト」というものがあります。HTMLタグではpreタグというものを使用します。
上記の視覚的要素を調整して、わかりやすいコンテンツを作成するように心掛けましょう。
下記は少し詰め込み過ぎたので逆にわかりにくくなっているかもしれません。
12個にまとめました(これはh3)
pタグは何も必要ない。そのままタイピングすればpタグとして認識してくれる。pタグを閉じたい時は1行改行すればいい。
こんなふうにね。
太文字はアスタリスク2つで囲むこと。
**こんな感じ。**
こんなふうになるよ。
同じpタグ内の改行は文末に半角スペース2つ入れてから改行そうすれば改行できるよ。
こんなふうにね。「そうすれば改行できるよ。」の後ろに半角スペースを2つ入れること。
リンクを貼りたい時は、
[表示名](URL)
画像を貼りたい時は、
![画像説明](画像パス)
でOK!!
リストの丸点なら「*と半角スペース」、順序リストなら「1.半角スペース」
* A
* B
* C
入れ子リストはタブを文頭に入れると出来るよ。
* A
* X
* Y
* Z
* B
* C
順序リストは2通りあるよ。
1. A
1. B
1. C
1. X
2. Y
3. Z
注意があって、上記のように2つ連続で書くと全部番号が連続してしまうよ。あいだに違う要素を入れたりして調整しよう!
区切る線はアスタリスク3つです。***
こんな感じだよ。
表の作成だよ。「テーブル」とも言われているね。
| 見出し | 見出し |
|--|--|
| データ | データ |
こうなるよ!
見出し | 見出し |
---|---|
データ | データ |
>引用
>>入れ子引用
とくに入れ子が必須というわけではありません。引用文や参考サイトに使えるね!
preタグはバッククォート3つでサンドイッチします。
` ` `
ここに書かれているものが整形済みテキスト、すなわちpreタグになるよ!
` ` `
マークダウンは単語登録しておくとラクだよ!これにて全部で12個ですね。