【2024年9月13日更新】「WordPressのテーマを活用する方法」で、テーマ『XWRITE』を使って吹き出しを作る手順に変更しました。
| 初心者 | (3.5) |
| 重要度 | (3.0) |
| 難しさ | (2.0) |
こんにちは、T部長です！
数多くのブログで使われている「吹き出し」。
「自分のブログでも吹き出しを使ってみたい」と思っている人は多いのではないでしょうか。
そこで、この記事ではブログに吹き出しを挿入する方法やメリット・デメリット、注意点を解説します！
T部長
この記事は次のような人におすすめ！
- ブログで吹き出しを使いたい人
- 吹き出しの作り方を知りたい人
- 吹き出しの使いどころを知りたい人
吹き出しは、ブログを読みやすくする工夫の1つです。
この記事を読んで吹き出しの作り方を知り、読者にとって読みやすいブログをつくっていきましょう！
それではどうぞ！
ブログの吹き出しとは
吹き出しとは、ブログの装飾の一つです。
吹き出しを使うと、実際に人やキャラクターが「喋っている風」「会話している風」に見せられます。
以下が当ブログの吹き出しです。
T部長
吹き出しは、多くのブログで取り入れられている表現方法です。
使えるようになると、ブログでの表現の幅が広がります！
吹き出しを使う3つのメリット
ブログで吹き出しを使うと、以下3つのメリットが得られます。
これらメリットを踏まえ、自身のブログで吹き出しを使うかどうか判断してください！
1.「リアルさ」を強調できる
先述のとおり、吹き出しは「人やキャラクターが話しているように見せられる」装飾です。
「著者本人が実際に話している感」を強調できるため、メッセージに説得力を持たせられます。
2.表現方法のバリエーションが増える
装飾のない記事は単調で、最後まで読み通す負担が大きいです。
吹き出しを使うことで表現のバリエーションが増え、記事の読みやすさが高まります。具体的には、吹き出しの利用には以下のような効果があります。
- 文章にテンポが生まれて読みやすくなる
- 重要な点を吹き出しにすることで、飛ばし読みでも記事のポイントを理解できる
- 補足的なメッセージを自然に配置できる
吹き出しで文章の単調さをやわらげ、スラスラと読める記事を目指しましょう！
3.メリハリをつけられる
吹き出しは「ビジュアル要素」の1つです。
‟文章疲れ”を防ぐ効果が期待できるため、「読者が記事から離脱する割合 = 離脱率」の低下に貢献するかもしれません。
基本的に文章ばかりが続く記事は疲れやすく、かつ読みにくいです。
「文章ばかりで読む気が失せた……」と、ページを閉じたり別の記事へ離脱したりした経験がある人も多いのではないでしょうか？
たとえば「文章だけの見出し」と「吹き出しを織り交ぜた見出し」で見比べてみます。
ビジュアル要素の吹き出しは、読者にとって「箸休め」にもなります。
記事にメリハリをつけられるため、最後まで記事を読んでくれる読者を増やせる可能性があります！
ブログで吹き出しを使う際の注意点3つ
ブログで吹き出しを使う場合は、以下3つの点に気をつけましょう。
それでは、解説していきます。
1.「使い方・使う場面」を選ぶ
吹き出しは、「使い方・使う場面」が重要になる表現方法です。
使い方や場面を間違えると、前述のメリットが得られないだけでなく、読者に嫌悪感を抱かれるかもしれません。
そのため、吹き出しは最適なシチュエーションでのみ使うよう心掛けましょう！
吹き出しは、実際に人が介在しているように見せられる表現方法です。
だからこそ、吹き出しは以下のような場面での使用が適しています。
上記のシチュエーションで吹き出しを活用すれば「リアルさ」を強調でき、意見に説得力を持たせられます。
それだけでなく、嫌悪感を抱かれるおそれもないはずです。
2.吹き出しを多用しない
吹き出しが多用されている記事は、視点が左右に揺さぶられて疲れてしまいます。
逆に読みにくくなってしまうため、吹き出しの連続使用は避けるようにしましょう。
以下の画像を見ると、わかりやすいと思います。
画像のとおり、吹き出しが連続すると読みにくくなります。
これは、会話形式でも同様です。
会話形式の場合、吹き出しの使用は多くても「2往復」までに留めましょう。
※インタビュー形式のコンテンツは除きます
3.テキストは短めにする
吹き出し内のテキストは、簡潔にまとめるよう心掛けてください。
テキストが長いと、非常に読みにくくなってしまいます。
とくにスマホ画面で見るとわかりやすいです。
基本的に吹き出し内のテキストは、「2文」までに抑えるのがおすすめです。
WordPressブログでの吹き出しの作り方！
WordPressのブログに吹き出しを設ける方法は、基本的に以下の2つです。
それぞれ紹介します。
ステップ0：アイコンの準備
どちらの方法で作成する場合も、まずは吹き出しに使うアイコンを準備しましょう。
アイコンとは、ブログや運営者の特徴を表した画像のこと。
当ブログの吹き出しだと、この部分がアイコンです。
基本的にアイコンの作り方には、以下の2通りがあります。
- 自作する方法
- 「ココナラ」などで外注する方法
具体的な作り方に関しては、以下の記事でスクショとともに解説しています。
ぜひあわせてごらんください！
WordPressのテーマを活用する方法
1つ目は、WordPressのテーマで吹き出しを作る方法です。
今回は、WordPressテーマ「XWRITE（エックスライト）」で吹き出しを作る方法を紹介します。
「XWRITE」は、WordPressがはじめてでも簡単にブログが書けるように作られているテーマ（有料）です。当ブログを運営しているエックスサーバー株式会社が開発しています。
まずは、事前に準備しておいたアイコンをWordPressのメディアにアップロードしましょう。
メディアを選択後、新規追加をクリックしてアイコンのファイルをドラッグ、もしくはファイルから選択でアップロードしてください。
「投稿」ページにて新規投稿を追加をクリックしましょう。
「新規投稿」のページに遷移します。
続いて、左上にある＋をクリックしてください。
「検索窓」が立ち上がるので、こちらに「ふき出し」と入力しましょう。
結果に表示されたふき出しをクリックしてください。
記事のエリアに吹き出しが現れたらOKです。
続いて、アイコンを設定しましょう。
アイコンをクリックしてください。
先ほどアップロードしたアイコンが表示されるので、そちらを選択しましょう。
以下のようにアイコンが挿入できたらOKです。
あとは、「ブロックを選択するには…」のところに好きなテキストを入力してください。
アイコンの下部に名前の入力もできます。
プレビューを確認して、問題がなければ完成です。
なお、「XWRITE」の吹き出しは、設定によるカスタイズが可能です！お好みの吹き出しにできますよ。
カスタマイズできる項目は、以下のとおりです。
- ふき出しの配置：左もしくは右に設定可能
- ふき出しの形状：「矢印」か「心の声」から選択
- ふき出しの枠線：枠線の表示・非表示
- 線の太さ：ふき出しの枠線の太さを設定
- ふき出しの並び (モバイルのみ)：モバイル表示時にふき出しを縦並びにできる
- 丸み：ふき出しの枠の丸みを設定
- 幅の最大値 (PCのみ)：ふき出しの幅の最大値を設定
- アイコンを非表示にする：アイコンの表示・非表示を設定
- アイコンの枠線：アイコンの枠の表示・非表示を設定
- 線の太さ：アイコンの枠線の太さを設定
- アイコン形状：「サークル」か「四角」から選択
- アイコン画像URL：使用したいアイコンの画像のURLを設定
また、以下は「XWRITE」についてまとめた記事です。気になる方はぜひ一度チェックしてみてください。
WordPressのプラグインを活用する方法
2つ目は、WordPressのプラグインを活用して吹き出しを作る方法です。
この記事では「LIQUID SPEECH BALLOON」を使用した吹き出しの作成方法を解説します。
まずは「LIQUID SPEECH BALLOON」をWordPressにインストールします。
ダッシュボードからプラグインをクリックしてください。
プラグインのページにアクセスしたら新規追加をクリックしましょう。
右側にある検索窓に「LIQUID SPEECH BALLOON」と入力したのち、今すぐインストールをクリックしてください。
インストールが完了したら、有効化しましょう。
プラグインの一覧に「LIQUID SPEECH BALLOON」が表示されていたら、インストールは完了です。
まずはテーマのときと同じく、「投稿」より新規投稿を追加をクリックして、新しい投稿を作成しましょう。
続けて、左上にある＋をクリックしてください。
少しスクロールすると「フキダシ」という項目があるので、選択しましょう。
記事のエリアに吹き出しが追加できたらOKです。
続いては、アイコンの設定です。
ブロックを選択した状態で右上の設定をクリックしてください。
設定画面をスクロールすると「アバターと名前の設定」のリンクがあります。
こちらをクリックしてください。
以下のような吹き出しの設定ページに変わります。
こちらで吹き出しの「名前」「画像URL」を入力しましょう。
「画像URL」は「メディアライブラリ」から「添付ファイルの詳細」で確認できます。
入力が完了したら、変更を保存を押してください。
新規投稿ページに戻って、以下のように「アイコン」と「名前」が表示されていたらOKです。
最後にテキストを追加しましょう。
以上で完成です！
ちなみに、先のテーマほどではありませんが、「LIQUID SPEECH BALLOON」でも吹き出しをカスタマイズできます。
カスタマイズできる項目は、以下の4種類です。
- Direction（吹き出しの位置）：左もしくは右に設定可能
- Design（吹き出しのデザイン）：「影付き」「線なし」など6種類から選択可能
- Size（吹き出しのサイズ）：「Default（標準）」「Small（小）」「Large（大）」から選択可能
- Options（オプション）：アイコンの位置などを設定可能
まとめ
以上、ブログに吹き出しを挿入する方法や具体的な使い方の解説でした！
それでは、今回の内容をおさらいします。
- 吹き出しを使うと「リアルさ」を強調できる
- 「主観や主張を伝えたいとき」など、吹き出しは最適な場面でのみ使うように心掛けよう！
- 吹き出しは多用しないように気をつけよう
- 吹き出しの作成方法は「テーマを活用する方法」と「プラグインを活用する方法」の2種類ある
吹き出しを上手く活用して、より読みやすいブログを目指してください！
最後までお読みいただき、ありがとうございました！
ブログの始め方を知りたい！実際に始めたい方へ
国内シェアNo.1※レンタルサーバー「エックスサーバー」では2025年9月4日(木)17時まで、サーバー利用料金の半額がキャッシュバックされる期間限定キャンペーンを開催中です！
今なら実質月額495円～とお得にWordPressブログが始められます！
.comや.netなど大人気ドメインも永久無料と過去最大級にお得です。
ぜひこのお得な機会にWordPressブログをご検討ください！
※ 2025年6月時点、W3Techs調べ。
当メディア「初心者のためのブログ始め方講座」では、
初心者の方に分かりやすく簡単にブログを始められる方法を紹介しています！
WordPressに使用される国内シェアNo.1サービス「エックスサーバー」の中の人が確実で信頼性の高い情報をお届けしています！
ブログをこれから始める方はこちらの完全ガイドをぜひご覧ください！
また、初心者の方向けにWordPressでのブログ立ち上げがたった10分できる方法も紹介しています！
ブログの始め方・立ち上げに関する、ご質問・ご相談はX（旧Twitter）DM（ @tbcho_xsv ）までお気軽にどうぞ！
