50代から始めるブログ初心者講座 第8回
「本文は書けた。画像もたくさん入れたほうがいい？」。写真、図解、記事の顔になる画像を探し始めると、何を選ぶかで迷います。仕事のあとに進めるなら、素材探しだけで終わるのは避けたいですよね。
最初に決めるのは、その画像で何を伝えるかです。記事の内容を知らせるのか、操作を説明するのか、違いを比べるのか。役割が決まってから、素材、文字、サイズを選びましょう。
第7回「ブログ本文の書き方」で使ったネタメモの記事を題材に、画像の選び方とアイキャッチの作り方を練習します。高価なソフトや有料素材を、最初からそろえる必要はありません。
50代研究員とAIの解説役「あい教授」の対話に解説を挟みます。あい教授は架空のキャラクターです。会話とデザイン例は説明用で、実在の専門家による監修や効果測定を示すものではありません。
アイキャッチと本文画像は、役割が違う
記事に写真を入れれば、ひとまずブログらしくなるかな。机の写真でも探そうか。
その写真で何を伝えるか考えてみましょう。メモの書き方なら、机の雰囲気より、記入する項目や書いた形が分かる図のほうが役立つ場合があります。
アイキャッチは、記事の内容を知らせる代表画像です。WordPressでは記事ごとに設定できます。記事一覧や記事の上部など、表示される場所や形は、使うテーマによって違います。テーマとは、ブログの見た目や表示の仕組みを決めるものです。
本文画像は、記事の説明を助けるために途中へ置く画像です。操作画面なら押す場所、比較図なら違い、記入例なら書く内容を見せます。アイキャッチと同じ絵を本文にも置くだけで、説明が増えるとは限りません。
| 画像の種類 | この練習で伝えること | 確認する場所 |
|---|---|---|
| アイキャッチ | ネタメモの書き方の記事だと知らせる | 記事上部・一覧の小さな表示 |
| 記入例 | 各項目へ何を書くか見せる | 説明している本文の近く |
| 判断図 | 分からない欄があるときの次の行動 | 迷う場面を説明する場所 |
この講座では毎回、代表画像と本文の図解を用意しています。それぞれ別の役割を持たせる方針です。さらに写真を足すなら、読者の理解や判断に必要なものを選びます。
図解：画像を作る前に、役割と使用条件を確認する
記事の顔？ 手順？ 比較？ 記入例？
確認できない → 別の素材へ
確認できる → 条件を守って制作
文字・余白・切れ方を点検
文字を減らす、配置を直す
→ 図が複雑なら分ける
本文の説明とaltを確認
→ 下書き保存後も表示を点検
本講座の制作手順です。画像を作ればクリック数が増える、という成果を保証する図ではありません。
ブログのアイキャッチの作り方：文字を選んでから配置する
1．記事で分かることを、短い言葉にする
練習記事のタイトルは「ブログのネタメモの書き方｜初心者向けの記入例」です。画像には「ネタメモの書き方」を大きく、「記入例つき」を補足として置く案にします。記事タイトルの全文を、必ず画像にも入れる必要はありません。
「必ず稼げる」「アクセス倍増」など、本文で確かめていない結果は足しません。画像で約束することと、本文で答えることをそろえます。画像だけ短くしても、記事の内容まで別のものに変えないようにしましょう。
2．素材と文字の置き場所を決める
メモ帳の絵と短い言葉を使うなら、文字を置く側に余白を残します。細かな模様や写真の上へ文字を重ねると、文字の輪郭が分かりにくくなる場合があります。背景と文字の明暗に差をつけ、最初は使う色と書体を絞ります。
テンプレートは、配置や色を繰り返し使えるひな形です。Canvaなどの画像作成サービスにはテンプレートを使う方法がありますが、素材・機能・書き出しの条件はそれぞれ確認してください。今回の考え方は、別の作成ツールでも使えます。
タイトルも、手順も、注意点も入れたいな。せっかくの画像だし、全部載せたら親切じゃない？
小さな一覧で全部読めるかを見てみましょう。今回の記事の顔なら「何の書き方か」が先です。詳しい項目や注意点は、本文の図へ分けられます。
3．詰め込んだ案と、要点を絞った案を比べる
次は本講座で作った説明用の配置比較です。実際のクリック率を測った結果ではありません。同じネタメモの記事を、小さな一覧で見分ける条件で比べます。
ネタメモの書き方を説明
疑問・根拠・不足・次の行動
記入例・注意点・見返す方法
どの言葉を先に読むか迷う。詳しい項目が、記事の顔を占める。
記入例つき
大きな言葉で題材を知らせる。細かな説明は本文へ分ける。
今回は「ネタメモの書き方」を中心にする案を選びました。残したのは題材と記事にある記入例、減らしたのは本文で説明する項目の列挙です。文字が少なければ常に正解ではなく、地域・対象・年度など、消すと記事の意味が変わる条件は残します。
画像サイズは「縦横の大きさ」と「データ量」を分けて考える
ピクセル（px）は画像の縦横の大きさを表す単位です。たとえば1200×675pxは、横1200・縦675の横長画像です。16：9は、その縦横の比率を表しています。
この連載では、横長の16：9に近い形を制作の出発点にしています。これは本講座の選択で、全てのブログ・SNSに共通する正解ではありません。WordPress公式案内でも、表示場所や推奨寸法はテーマによって違うと説明されています。
同じ画像なのに、記事の上では読めても、一覧だと小さくなるんだね。横長ならどこでも切れないと思ってた。
表示する枠の形が違うと、端が切り抜かれることがあります。重要な文字を端へ寄せすぎず、記事上部と一覧の両方で確かめましょう。
一方、KB・MBはファイルのデータ量です。縦横が同じでも、形式や保存方法、画像の内容によってデータ量は変わります。画像の縦横を小さくする作業と、画質を確認しながらデータ量を減らす作業は分けて考えます。
写真ならJPEG、透明な背景が必要ならPNGなどが選択肢になります。WebPなど、圧縮を利用する形式もあります。形式だけで一律に決めず、使用する環境で開けるか、文字や輪郭がつぶれていないかを確認してください。透過とは、背景の色を付けず、下の背景が見える状態です。
最初は元画像を残し、公開用のコピーでサイズや保存設定を調整する方法があります。数値を小さくするために、図解の文字が読めなくなるほど縮めないようにしましょう。
無料画像・自分の写真・AI画像も、確認してから使う
検索で見つけた画像は、そのままブログへ転載できる素材とは限りません。「無料」は料金の説明であり、使用条件がないという意味ではありません。配布元で、商用利用、加工、作者名・出典の表示、禁止用途など、自分の使い方に関係する条件を確かめます。
たとえばCreative Commonsのライセンスには、作者の表示が必要なものや、非営利利用に限るものなどがあります。同じ「CC」の表記でも条件は違います。公式のライセンス説明と各素材の条件を確認し、判断できなければ別の素材を選びましょう。
自分で撮った写真でも、人の顔、名札、住所、画面の通知など、公開してよい内容かを点検します。操作画面のスクリーンショットは、説明に必要な範囲と利用条件を確認し、個人情報や秘密の値を見せないようにします。
AIでメモ帳や人物の絵を作ったら、確認することはなくなるかな。写真じゃないしね。
生成画像も確認しましょう。文字の誤りや、本物に見える架空の商品・画面が入り込むことがあります。説明用の絵を、実物や体験の証拠として見せないことも大切です。
AI画像は、利用するサービスの条件を確認したうえで、本文と矛盾しないか、他の作品・人物などとの関係で問題がないかを点検します。AIで生成したことだけを理由に、自由に使えると決めつけません。
この連載の人物は説明用キャラクターです。実際に撮影した講義風景ではありません。価格・日付・数量・操作手順など、正確さが必要な図は、生成された文字をそのまま信じず、根拠を確かめて作成します。
WordPressへ設定し、画像が見えなくても分かる説明を添える
WordPressはブログの記事を作成・管理する仕組みです。画像を入れるときは、記事の代表画像にする設定と、本文の途中に入れる操作を分けます。
- 完成した画像を保存し、内容・文字・使用条件を確認する。
- 記事の「投稿」設定から「アイキャッチ画像を設定」を開き、画像を選択またはアップロードする。
- 本文の説明画像は、必要な場所へ画像ブロックなどで追加する。
- 代替テキストと、必要なら本文の説明やキャプションを入れる。
- 下書きを保存し、記事プレビューで画像と文字の表示を確かめる。
設定名や位置は、テーマや編集環境で変わることがあります。WordPress.comの公式案内は、代表画像の役割と設定の参考にできますが、全てのサービス固有機能がこのブログにあるという意味ではありません。
alt（代替テキスト）には、画像の役割を書く
alt（オルト、代替テキスト）は、画像を見ることができない人にも内容を伝えるための説明です。読み上げなどで役立ちます。検索語をたくさん並べる欄ではありません。
記入例なら「ネタメモに疑問、確認した情報、未確認の点、次の作業を記入した例」のように、記事の説明に必要な意味を伝えます。図解の情報が複雑なら、短いaltだけへ全部押し込まず、同じ情報を本文でも説明します。
周囲の文章と内容が重なる装飾画像などでは、altを空にする考え方もあります。W3Cの判断表では、画像の内容と役割に応じて使い分けます。Googleの公式説明でも、内容に合った説明を付け、キーワードの羅列を避けるよう案内されています。
【50代研究員のまとめ】まず、記事の顔と説明の図を分ける
今日は素材を何枚も集めるより、「何を伝える画像か」を決めるところからだね。作ったら小さく表示して、読めるかも見てみるよ。
はい。内容、使用条件、文字の読みやすさを確かめてから下書きへ入れましょう。作成画面だけで終わらず、記事に置いた後も確認してください。
今回の練習は、第7回の本文に合わせて、アイキャッチで知らせる言葉を選び、本文で見せる記入例や判断図の役割を決めることです。画像は、記事の内容を伝えたり、説明を具体的にしたりするために使います。
本講座では、紺・青・黄色を中心に、各回で分かることを代表画像に載せています。一方、本文の図解は内容に合わせて作り、数値・手順を本文でも説明する方針です。今回も、装飾を増やすより、読者が役割を見分けられる構成を選びました。
次回予告・シリーズ案内
第9回は「ブログSEOとは？50代初心者にもわかる検索される記事の考え方」です。検索する人の疑問と、記事を見つけてもらうための基本を学びます。次回は準備中です。
前回：第7回 ブログ本文の書き方
シリーズ一覧：50代からのブログ初心者講座
次回：第9回（準備中）
参照した公式情報
公式情報の確認日：2026年10月14日。配置比較、判断図、制作手順は本講座の練習用提案です。画像の枚数・大きさ・配置を、収益や検索順位が上がる条件としては扱いません。
コメント