【記事作成の基本】知っておきたい段落Pの正しい使い方

記事を作成するにあたって 段落はとても大事な項目です。
実は気付かずに間違った方法で記事を書いてしまっているかも…!?

段落とは?

段落 = p 要素  pは パラグラフ の P・略してピー とも言います。
段落とは 一つの文章のブロックの事で 記事を書くルールとして
<p> ~ </p> のコードで一つの文章を作ります。

ビジュアルエディタ画面 ブロックを表示させて段落の使い方を解説

画面の左上 見出しなどの項目を選択する窓は 現在、段落<p>となっています。
その少し右に ブロックを表示させるボタンがあり
これをクリックすると エディタ画面に うっすらと点線でブロックが表示されます。

これが、一つの文章のブロックであることが分かります。

" Enter " での 改行は要注意!!

ビジュアル画面で 記事作成をした場合、
パソコンの改行(Enter)キーで改行していくと、文章が 別のブロックになってしまいます。
例えばこんな感じに…↓
ブロックを使って説明 間違った段落

お分かりいただけますか?
私たち日本人が読んだ場合、文章として読むことはできますが、
インターネット上では、これが文章なのか、何が書かれているのか 分からなくなってしまいます。

HTMLについて かんたんに解説
HyperText Markup Language ( ハイパーテキストマークアップランゲージ )
を略して HTML と呼ばれることが多い。

ハイパーテキストは 複数の文書を相互に関連付け、結びつけるという意味で
マークアップランゲージは その文章構造などを記述するための形式言語

マークアップ言語を用いることで 見出し・段落 など ここに何が書かれているかを認識させる。

Wikipedia – HyperText_Markup_Language  より抜粋

間違った 余白のとりかた

次に、文章と文章の間を もう少し空けたいなぁ、なんて時。
改行キーを連打して、余白を作っていませんか?

改行を使った 間違った余白の付け方
この方法を使うと テキストエディタ画面で &nbsp; と表示されます。

この方法は 間違った表示方法で 余白はできますが
余計なコードが 必要以上に入っているということは検索エンジン的にも お勧めできません。

文章を正しく認識してもらうために 正しい 改行方法と 余白に関するカスタマイズを行っていきましょう。

段落Pに対しての 行間を調整するだけで余分な改行を無くし 見やすいサイトを作ることができますので
まずは行間のカスタマイズをやってみましょう‼

正しい改行

ビジュアル画面で 記事作成をした場合、改行キーを押すと
テキストエディタ画面では、2段 改行された形になっています。

反対に、テキストエディタ画面で記事作成した場合は 改行キーを押しても
一段下がるだけで、同じブロックのままになります。

ビジュアル画面で作成する場合の改行のしかたは
Shift キーを 押しながら Enter キーを押すだけで 同じブロックのまま改行することができます。

 

合わせて読んで頂きたい!!

そのほか、記事の作成での時間短縮できる方法を知っていると とっても便利です!
知っておきたい!!記事作成の時間短縮できる機能

記事投稿CSS&HTML

Posted by 45