【UX改善】ブログカード最適化と吹き出しを使った読者獲得術

WP運用
この記事は約7分で読めます。

WordPress初心者がよく遭遇するブログカードや吹き出しなどの解説

WordPressテーマ「Cocoon」には、ブログカードや吹き出しなど、初心者でも使いやすい便利な機能が多数あります。
しかし、初期設定のままだと日付が古く見えたり、PV数が少なく見えたり、吹き出しが使われていなかったりと、読者の離脱につながることがあります。

私もWordPressを使い始めのころCocoonに吹き出しやブログカードの機能を知りませんでした。
そこでこの記事では、ブログカードの最適化(日付削除・PV削除)と、吹き出しの効果的な使い方を初心者向けにわかりやすく解説します。

護身IT
護身IT

この記事では、下記の悩みを解決します。
・ブログカードの日付を消したい
・PV数を非表示にしたい
・ブログカードがごちゃついて見える(PV数の非表示でスッキリ見える)
・吹き出しを使って読みやすい記事にしたい
・Cocoonの設定場所がわからない
・初心者向けサイトに最適な見せ方を知りたい
を分かりやすく解説します。

初心者の方でも、この記事を参考にサイト作成進める手助けになれば幸いです。

また、私自身、WordPress を使い始めた頃は、「どこを触ればいいのか分からない」
といった初歩的な部分で何度もつまずきました。
この記事では、私が実際に経験したトラブルと、そのときにどう解決した事も交えて解説します。

吹き出しを使うと記事が読みやすくなる理由

吹き出しは、文章を「会話形式」で伝えるための機能です。
初心者向けサイトでは、吹き出しを使うことで理解しやすさが大幅に向上します。

なぜ初心者にとって重要なのか

私も当初、テキストで会話形式に記事を執筆していましたが、吹き出し機能があることを知り劇的にブラッシュアップされました。

「吹き出し」のメリットを下記に記載します。

  • 説明がやわらかくなる。
  • 難しい内容を会話形式で伝えられる。
  • 読者が疲れない。
  • ブログカードとの相性が良い。(視覚的な流れが作れる)

「吹き出し」のデメリット

  • 吹き出しを使うと画面の余白やアイコンの占める割合が大きくなり、文字数が少なくなりがちです。
  • 吹き出しブロックは、アイコン画像を表示させたり、専用の装飾用プログラム(CSSなど)を読み込んだりするため、通常のテキストよりもサーバーに負荷がかかります。
  • パソコンでは綺麗に見えても、画面の横幅が狭いスマホで見ると、吹き出しの枠線やアイコンに圧迫されて「文字が縦に1〜2文字ずつ細長く伸びてしまう」という現象が起きることがあります。

Cocoonで「吹き出し」を設定

Cocoonテーマでは「吹き出し」は簡単に設定できます。

私もはじめのころは、この機能の存在すら気づけませんでした。今後のサイト運営の参考になれば幸いです。

  • 挿入したい位置でマウスクリックする。
  • 下図の赤枠に選択したいブロック名((例)吹き出し)を入力し選択する。(ブロックの種類が多くあるのでこの方法が個人的にはお勧めです。)
ブロック種類の選択
ブロック種類の選択

初心者が選ぶべき基準(吹き出し及びブログカード)

  • 「吹き出し」は、会話形式で執筆したいときは利用する。
  • 「吹き出し」は、補助説明する場合も有効です。
  • 「ブログカード」は画像のカードタイプでとても見やすくて良い。

体験談|初心者が実際に失敗しやすいポイント

・「吹き出し」は「つい」多用してしまいますので、注意して利用しましょう。複数のリンクをブログカードで貼ると逆に外観が損なわれる為注意が必要です。
・ブロックの種類が多く、私もWordPressを使い始めたばかりでは、検索機能など知らなく毎回目視で探していました。検索すると劇的に効果が実感できます。

護身IT
護身IT

毎回アイコン画像や名前を設定するのが面倒です。何か設定などありますか?

吹き出しさん
吹き出しさん

あらかじめ Cocoon設定⇒「吹き出し」画面から、よく使うキャラクターをテンプレートとして新規登録しておきましょう。これにより、記事編集時にプルダウンからワンクリックで呼び出せるようになります。

護身IT
護身IT

会話の順番や配置で気をつけることはありますか?

吹き出しさん
吹き出しさん

一般的に最初の発言は「左側」から配置し、同じ人が連続する場合はそのまま左側に,別の人が話す場合は左右を交互に入れ替えて会話形式にするのが自然な構成です。

ブログカードが読みやすさに与える影響

ブログカードは、記事内で関連記事を紹介する際に使う「視覚的なリンク」です。
私も初めてブログカードを利用した時、自分のサイトでない、見た目に驚きました。
ゆえに読者の安心感や読みやすさに直結すると感じました。

ブログカードがUX(ユーザーの利便性)に与える影響

  • 視覚的にわかりやすい。
  • 関連記事へ自然に誘導できる。
  • 読者が迷わない。
  • サイトの専門性が高く見える。

しかし、初期設定のままだと 日付やPV数が読者の不安を誘うことがあります。

ブログカードの日付を削除する理由

日付が古いと読者が不安になる

「この記事、古い情報なのでは?」
と感じて離脱する可能性があります。

初心者のサイトでは、日付より内容のわかりやすさの為、日付は必要ありません。

私も気になりましたので、下記設定で非表示にしました。

Cocoonでブログカードの日付を非表示にする方法

ここでは私のブログカードで、表示されていた日付を削除した時の操作を下記に記載します。
参考になれば幸いです。

操作方法:「Cocoon設定」⇒「インデックス」⇒✓を見直す。⇒「変更をまとめて保存」

ブログカードの投稿日付の場合、「インデックス」を選択する。

ブログカードの日付設定
ブログカードの日付設定

Cocoonテーマの場合、これだけでブログカードの日付が非表示になります。

ブログカードのPV数を削除する理由

私の場合ブログカードに表示されている数字が”何”なのか全くわかりませんでした。
意味のない数字が表示されていても、自身もそうですが読者の皆さんも迷われると思い削除するにはどうすれば良いか迷っていました。

解決:PV数だとわかり、さっそく下記要領で削除しました。

PV数が少ないと信頼性が下がる

ブログを始めたばかりの頃は、記事のPV数が1ケタや0であることは当たり前です。
でも、もしその少ない数字がそのままブログ上に表示されていたら、せっかく見に来てくれた読者に『この記事、誰も読んでないから参考にならないのかな?』と不安を与えてしまいますよね。
だからこそ、アクセスが伸びるまではこのPV表示を非表示にして、読者に余計なノイズを与えないスッキリしたブログ環境を作ることが大切だと私は思いました。

PV数は読者にとって不要な情報

読者が知りたいのは「記事の内容」であり、PV数ではありません。

Cocoonでブログカード表示のPV数を非表示にする方法

ここでは、メニューよりリンクされ下図のように表示される場合、赤枠部分を削除したいと思い削除したときの方法を記載します。参考になれば幸いです。

はじめの画面

操作方法:管理画面⇒[Cocoon設定]⇒[管理者画面]⇒[PVエリアを表示する]の✓を外す。⇒下にスクロールさせ[インデックス設定]の[インデックスにPV数を表示する]の✓を外す⇒[変更をまとめて保存]
※ 下図の①②の2か所の✓を外さないとできません。

設定画面
完成図

これでブログカードがシンプルで読みやすくなります。

護身IT
護身IT

ブログカードが表示されないのはなぜ?

ブログカードさん
ブログカードさん

管理画面⇒ Cocoon設定⇒「ブログカード」タブを開き、内部・外部それぞれの「ブログカード表示を有効にする」にチェックが入っているか確認してください。

護身IT
護身IT

Cocoonのブログカードで内部ブログカードも外部ブログカードも使い方は同じですがなぜ2つの設定に分かれているのですか?

ブログカードさん
ブログカードさん

使い方は「URLを貼るだけ」で全く同じですが、設定が分かれているのは「自分のサイト(内部)」と「他人のサイト(外部)」で、果たす役割や表示の仕組みが根本的に異なるからです。内部と外部でシステム(プログラム)が違います。

まとめ

最後まで記事を見ていただきありがとうございました。
この記事では、初心者でもわかりやすく下記の点について解説しました。
記事通りに進めていけば安心してサイト作成いただけます。
また、この記事だからこそ下記の問題が解決しました。

  • 日付削除 → 古さの不安をなくす。
  • PV削除 → 信頼性を保つ。
  • 吹き出し → 読みやすさと理解しやすさを向上。
  • サイトの回遊率と読者の理解度を向上させる。

初心者向けサイトでは、ブログカードと吹き出しを最適化することで
読者の離脱を防ぎ、サイトの専門性と読みやすさが大きく向上します。

また初心者がつまずきやすいCocoonテーマの操作を解説しました。必要な場面に遭遇しましたらご活用いただけると幸いです。

「Cocoonで必ず設定すべき基本機能まとめ|初心者向けWordPress設定ガイド」の関連記事を下記リンクしてますのでご覧ください。

全体の流れを詳しく知りたい方は、まず「【Cocoon】初心者が最初に設定すべき基本機能と重要項目まとめ」からご覧ください。

タイトルとURLをコピーしました