WordPressで改行や段落を挿入する時の注意点と方法

20160510-157
  • このエントリーをはてなブックマークに追加

WordPress で文章を作成していると、改行を入れたつもりなのに行間の空白が開き過ぎることはないだろうか?文章の区切り次第でコンテンツの見やすさは変わり、これはユーザビリティの向上にもつながってくる。

ここでは正しい改行と段落の挿入方法を紹介しよう。

1.改行と段落の違い

まず一般的な改行と段落の意味を確認しておこう。それぞれ、

  • 改行:文章を区切って行を変えること
  • 段落:長い文章の中の1つの主題をもって区切った部分

となる。

なので単に文章が長いから区切るのではなく、ちゃんと意味をもって改行や段落を使い分けることを心がけよう。

2.改行・段落で文章を区切るポイント

また、見やすく区切られた文章はユーザビリティの観点からも重要だ。

インターネットリサーチの業界で著名な Nielsen Norman Group が「長文よりも簡潔で読み流しができる Web ページ程、ユーザビリティが上がる」という結果を発表している。ユーザービリティが上がれば、サイトのゴール達成やコンバージョンにつながることも期待できる。

では、どのように文章を区切るべきか?

ポイントは、 “ユーザーにとって読みやすいか” を基準にしよう。もっとも効果的な確認方法は、あなたの作ったコンテンツを他の人に読んでもらうことだ。

「なんだ、そんなことか」と思われた方もいるかもしれないが、弊社クライアントでもいざコンテンツを作成していただくと、ユーザー目線を忘れてしまう。面倒だと思われるかもしれないが、コンテンツの作成の度に毎回、他の人に読んでいただくことをおススメする。

できれば、業界に関係のないあなたの家族や友人など第3者からのフィードバックがもらえると良い。すると読みやすい文章を作り上げるだけではなく、理解できない箇所の指摘を受けるとコンテンツのブラッシュアップにもつながる。

※ 良質なコンテンツについて
いくらユーザーに読みやすいコンテンツを作っても、検索エンジンから評価の低いコンテンツだとユーザーと信頼関係を築くのは難しい。そこで、良質なコンテンツを作る方法を『SEOコンテンツの作り方』で解説しているので、一読して実践してほしい。

3.改行・段落を挿入する方法

次の表の「入力キー」を見ていただきたい。

区切り 入力キー HTMLソース
改行 Shift + Enter <br />
段落 Enter <p>◯◯◯</p>

「入力キー」とは、キーボードのキーを表している。また、「HTML 」とは、ブラウザで表示するための言語のことで、WordPress の投稿画面から確認することができる。

改行と段落を明確にしなければ検索エンジンのペナルティを受ける、ことはないがHTML のルールを無視することになる。正しい理解をもってコンテンツを作る方が「本当にこれで良いのか?」と疑問を持ちながら進めるより気持ちが良いだろう。

それでは、それぞれの挿入方法を図で解説しよう。

HTMLソースを確認するための準備
デフォルトでは一部のHTMLソースが確認できないが、「TinyMCE Advanced」というプラグインを使うと表示できるようになる。インストールは、簡単なので『TinyMCE Advanced の設定法と使い方』を読んで設定しよう。そして設定項目の「Advanced Opitons のチェックボックスにチェック」を忘れずに入れよう。

3−1.改行を挿入する方法

管理画面の左メニューにある「投稿」をクリックして記事を作成する。そして文章の中の改行を挿入したい箇所をクリックしよう。

「Shift」キーを押しながら「Enter」キーを入力すると改行が挿入される。

下図のように「テキスト」タブをクリックするとHTMLソースが確認できる。赤枠に改行のソース <br /> が入っていることが確認できる。

3−2.段落を挿入する方法

先ほどの改行と同様に段落を挿入したい箇所をクリックしよう。

「Enter」キーを入力すると文章を段落で区切ることができる。

HTMLソースを見ると、確かに段落の<p>〜</p>が追加されていることが確認できる。

  • このエントリーをはてなブックマークに追加

バズ部のWordPress無料オリジナルテーマ

cta_extension” Xeory (セオリー)”は、バズ部のノウハウをしっかり詰め込んだ、コンテンツマーケティングに特化したWordPressのテーマです。Xeory はWEBマーケティングで結果を出すために次の3つの特長を備えています。

  • ・お問合せなどにつなげる導線の実装が簡単
  • ・ソーシャルメディアと連携する仕組みが導入済み
  • ・内部構造をSEO化にこだわって徹底して改善

世の中に良質なコンテンツが溢れることを想い、テーマは無料でご提供しております。まずはダウンロードしてお試しください。


Xeory テーマを見る

最新の記事情報が取得できます

Facebook

「いいね!」ボタンを押すと、最新情報がすぐに確認できるようになります。

Twitter

「フォローする」ボタンを押すと、最新情報がすぐにツイート上で確認できるようになります。

コメントはこちらから

  1. ゴミみたいな記事を書くな氏ね

    1. っっgさま、貴重なご意見をありがとうございます。
      もっと質の高いコンテンツが書けるよう精進してまいります。

  2. この使い方が分からなくて探していたらたどり着きました。
    とても分かりやすくてホントに助かりました。ありがとうございます。

    1. matsuさん、コメントありがとうございます!