【CanvaとAI】読みやすいバナーの作り方｜背景・文字入れ・公開前チェック

バナーを作るたびに、背景も文字も最初から考えるのは大変です。ここでは、AIで背景の案を用意し、Canvaで文字と配置を仕上げる方法を説明します。

まず一枚、スマホでも読める画像を作ることを目標にします。画像生成の待ち時間や調整時間は条件によって変わるため、「3分で完成」などの所要時間は約束しません。

作り始める前に、完成形を一行で決める

今回の作例は、ブログの「AIへの質問のしかた」を紹介するバナーです。以下は制作条件の例で、特定サイズがすべてのサービスで推奨されるという意味ではありません。

• 用途：ブログの記事一覧で表示する横長画像。
• 作例のサイズ：横1200×縦675ピクセル。
• 入れる文字：「AIへの質問」「まずは3つの条件」の二行。
• 配置：左側に文字、右側にノートのイラスト。上下左右に余白を残す。

記事のタイトルを全文入れず、一覧で読める短さにします。詳しい説明は記事タイトルと本文に任せます。

ステップ1：文字のない背景を用意する

画像生成に対応したAIを使う場合は、次のように頼みます。自分の写真やCanvaの素材を使っても構いません。

ブログのバナー用の背景。横長16:9。
右側にノートと鉛筆のイラスト、左側は文字を置くため広く空ける。
クリーム色を基調に、緑を少し使う。細かい模様は増やさない。
文字、数字、ロゴは入れない。

背景がきれいでも、文字を置く余白がなければ作り直します。横長の枠へ無理に引き伸ばすと、元の絵や文字がつぶれます。縦横比を保って置き、必要なら背景の端を切り取ります。

ステップ2：Canvaで文字を別に入れる

1. Canvaで、用途に合うデザインまたはサイズを選びます。
2. 背景を配置し、顔や重要な物が端で切れないように調整します。
3. テキスト欄を二つ作り、短い見出しと補足を入れます。AI画像に描かれた日本語をそのまま使う必要はありません。
4. 文字が背景に埋もれる場合は、文字の下に無地の面を置きます。
5. 有料素材の表示や透かしがないか確かめ、画像として書き出します。

Canvaには無料で使える範囲と有料機能があります。AI機能・素材・利用回数は契約によって異なるので、書き出し前に画面の料金表示を確認してください。Magic Designは素材に合った配置やテンプレートを提案する機能です。背景の生成とは分けて考えると迷いにくくなります。公式：Magic Design（2026年9月19日確認）

小さく表示すると、どこで読めなくなるか

編集画面では大きく見えても、記事一覧では縮小されます。作例の1200ピクセル幅を300ピクセル幅で見ると、文字も約4分の1の見かけの大きさになります。

二枚目は複製しても、確認は省かない

一枚の配置が決まれば、デザインを複製して見出しと背景を差し替えられます。ただし、長い題名へ変えると改行や余白が崩れます。同じテンプレートだから大丈夫、と確認を飛ばさないでください。

同じ背景をすべての記事に使うより、配色と書体をそろえながら、内容に合った物や場面を選ぶと記事を見分けやすくなります。

公開前のチェック

• 画像の題名と、リンク先の記事の内容が一致している。
• スマホで日本語の欠け、誤字、読めない文字がない。
• 画像を引き伸ばしていない。重要な部分が切れていない。
• 素材の利用条件を確認し、有料表示や透かしを見落としていない。
• 画像を見られない人にも内容が伝わる説明文を設定した。

AIへの背景の頼み方はアイキャッチ画像の指示例へ。記事紹介の文章まで作る場合はGeminiでX投稿の下書きを作る手順を使えます。