ファンサイトに戻る

PROMPT GUIDE

ブログのアイキャッチ画像をAIで作る方法(OGP・余白)

アイキャッチは、ブログの記事一覧やSNSでシェアされた時に、記事の「顔」になる画像です。ブログのテーマやSNSによって切り取られ方が変わるので、どこが切れても伝わる構図にしておく必要があります。この記事では、アイキャッチに向いた比率と構図、記事に合う絵の決め方、プロンプト(呪文)の例をまとめました。

最終更新: よみもの めやす 約3分

結論を先に

ブログのアイキャッチ(記事の見出し画像)をAIで作る時は、SNSでシェアされた時に表示される横長の比率(OGP画像)に合わせて作り、主役を中央に、まわりに少し余白を空けます。端が切れても大丈夫なように、文字や顔を端に置かないことが大切です。記事の内容を1つの場面で表す絵にすると、一覧でも何の記事か伝わりやすくなります。

ブログのアイキャッチをAIで作るには?

SNSでシェアされる横長の比率に合わせて作り、主役を中央に置いて、端に大事な物を置かないようにします。

ブログの記事をSNSでシェアすると、OGP画像として決められた横長の比率で表示されます。比率や推奨サイズはSNSやブログのサービスごとに違い、変わることもあるので、使っているサービスの公式の案内で確認してください。一般的には、1.91:1 前後の横長がよく使われます。AIで作る時は、16:9くらいの横長で作り、上下を少し切って合わせると扱いやすいです。

アイキャッチ向きの言葉

タグ意味メモ
centered中央に端が切れても主役が残る
wide shot横長の引きの構図場面が伝わる くわしく
simple backgroundシンプルな背景文字を乗せやすい くわしく
flat illustration平塗りのイラストブログになじみやすい
soft pastel colorsやわらかい色記事一覧で浮きにくい
no text文字なしタイトルは後から入れる

イラストの利用ルール

アイキャッチの作り方の手順は?

AIでブログのアイキャッチを作る手順

  1. 使っているブログとSNSの、OGP画像の推奨の比率とサイズを公式の案内で確認する
  2. 記事の内容を1つの場面にする(例:パソコンで作業している・カフェで勉強している)
  3. 主役を中央に、まわりに余白を空けた横長の構図で何枚か作る
  4. 推奨の比率に合わせて切り抜き、切り抜きシミュレーターでSNSでの見え方を確かめる
  5. 文字を入れるなら、中央付近に大きく入れる(端は切れることがある)
  6. ページが重くならないように、WebPやJPEGで軽量化してから記事に設定する
1girl, solo, sitting at a desk, laptop, smile, indoors, room, window, soft lighting, wide shot, centered, simple background, soft pastel colors, no text
a wide flat illustration of an anime girl studying with a notebook in a cozy cafe, centered in the frame, plenty of calm space around her, soft pastel colors, no letters or signs

記事に合うアイキャッチの絵の決め方は?

記事の内容を「誰が・どこで・何をしているか」の1つの場面にすると、絵から記事の中身が伝わります。

記事の種類場面の例言葉の例
やり方・解説パソコンで作業するlaptop, desk, focused
勉強・まとめノートに書く・本を読むnotebook, reading, library
旅行・お出かけ景色を見る後ろ姿from behind, scenery, wide shot
お知らせ・日記笑顔で手をふるwaving, smile, looking at viewer
季節の話題季節の小物と風景cherry blossoms, autumn leaves, snow

りんかのコツ

  • 記事一覧で同じ絵柄・同じ配置にそろえると、ブログ全体の統一感が出る
  • 人物の顔は中央より少し上に。下は記事一覧のタイトルの帯で隠れることがある
  • 画像のファイル名は記事の内容が分かる英単語にしておくと、画像検索でも見つけてもらいやすい

アイキャッチに透かしやサイト名を入れるなら 画像に透かし(ウォーターマーク)を入れる方法とSNS向けのコツ →

アイキャッチでよくある失敗と直し方は?

失敗原因直し方
SNSで顔や文字が切れる端に置いている主役と文字を中央に・centered を書く
何の記事か分からない場面が記事と関係ない記事の内容を1つの場面にして頼む
画像が重くてページが遅いPNGのまま大きいサイズWebP・JPEGにして横幅を1200前後に
意味のない文字が入る文字の入りやすい物(看板・本の表紙)no text を足す
記事ごとに絵柄がばらばら毎回ちがう書き方画風と色の言葉を決まった書き方にする

アイキャッチを使う時の注意は?

使った生成サービスの利用規約で、ブログや広告のある記事に使えるかを確認してください。決まりは変わることがあります。

  • 実在の人物やブランド、他人のキャラクターに似せた絵は使わない
  • 画像のALT(代替テキスト)には絵の説明を書く。プロンプトの羅列は入れない
  • 元の画像は大きいサイズで保存しておき、記事に使う物だけ縮める

動画のサムネイルを作るなら YouTubeのサムネイルをAIで作る方法(16:9・文字の余白) →

Xのヘッダー画像を作るなら X(旧Twitter)のヘッダー画像をAIで作る方法 →

公開・投稿する前の最終チェックは 投稿前チェックリスト完全版 →

FAQ

よくある質問

アイキャッチはどの比率で作ればいいですか?

SNSでシェアされた時のOGP画像の比率に合わせるのがおすすめで、一般的には1.91:1 前後の横長がよく使われます。サービスごとに違い、変わることもあるので公式の案内で確認してください。

アイキャッチに文字を入れたほうがいいですか?

入れるなら中央付近に大きく入れます。端は切れることがあるので避けてください。文字はAIに描かせず、後から入れるのが確実です。

アイキャッチ画像が重くてページが遅くなります。

WebPかJPEGにして、横幅を1200ピクセル前後まで縮めると軽くなります。ブラウザの中で変換できるツールも使えます。

AIの画像をブログに使っていいですか?

使った生成サービスの利用規約によります。広告のある記事や商用のブログで使えるかも含めて、公式の規約を確認してください。

RINKA WORLD

読んだあとは、りんかワールドで

MORE

あわせてどうぞ