【Canva無料】WordPressブログのアイキャッチの作り方|Cocoon対応サイズ・セーフゾーンまで解説

blog
記事内に広告が含まれています。

「ブログのアイキャッチってどうやって作ればいいんだろう…」
そんな悩みを持つ人も多いんじゃないかな。
アイキャッチはブログの「顔」とも言える大事な画像。でも、デザインの知識がなくてもCanvaを使えば無料で簡単に作ることができるよ!
この記事では、WordPressブログ(Cocoon)に合ったサイズの選び方から、Canvaでの作り方、クオリティを上げるコツまでまるっと解説していきます。

1. まずサイズを確認しよう

アイキャッチを作る前に、まずサイズを確認しておきましょう。
サイズが合っていないと、画像が見切れたり、ぼやけて表示されることがあります。
Cocoonの推奨サイズは「1200×630px
横長の16:9に近い比率で、SNSでシェアされたときもきれいに表示されるサイズです。

WordPressの設定も確認しよう

Canvaで正しいサイズで作っても、WordPress側の設定が合っていないと見切れることがあるので注意!

まずCocoon設定 → 画像タブ → 全体画像設定 → 「9:16…【推奨】で表示する」にチェックが入っているかどうか確認。

Screenshot
Screenshot

それでも画像が見切れる場合は、設定 → メディアを開いて「サムネイルを実寸方に切り抜く」のチェックを外してみましょう

現状アイキャッチが問題なく表示されているなら、サムネイルのサイズ等の設定はそのままでOKです!

2. Canvaで作る手順

設定が確認できたら、いよいよCanvaでアイキャッチを作っていきます。
Canvaは無料で使えるデザインツールで、テンプレートも豊富だから初心者でも簡単におしゃれな画像がたくさん。(王冠👑マークは有料プランでしか使えないので注意!)

Canva

① カスタムサイズで新規作成

Canvaにログインしたら、右上の「デザインを作成」→「カスタムサイズ」をクリック。
幅「1200」高さ「630」単位「px」を入力して「新しいデザインを作成」をクリック。

② テンプレートを選ぶ or 自作する

左のメニューから「テンプレート」を開くと、たくさんのデザインが表示されます。
気に入ったものを選んでカスタマイズするのが一番手っ取り早く、おしゃれなアイキャッチになるのでおすすめ!
自分でゼロから作りたい場合は「素材」や「テキスト」を使って自由にデザインしてみてね。

③ 文字を入れる

タイトルや説明文を入れるときのポイントはひとつ。
文字は少なく、大きく!
スマホで見たときに3秒で読めるかどうかが基準です。目安は10文字以内がベスト。
フォントはブログのイメージに合わせて選ぼう。太字がおすすめ!かわいい系なら丸みのあるフォントが相性がいいです。

④ 画像をダウンロード

デザインが完成したら右上の「共有」→「ダウンロード」→ファイル形式は「PNG」を選んでダウンロードしましょう。

3. クオリティを上げるコツ

基本的な作り方がわかったら、次はちょっとしたコツを意識するだけでグッとクオリティが上がります!

① セーフゾーンを意識しよう

画像の端から50〜100pxは「安全領域」として余白を残すようにします。

表示される場所によって端が少し切れることがあるから、大事なテキストやロゴは端ギリギリに置かないように。

特に右下は要注意。ブログカードなどで文字が被ることが多いから、重要な情報は置かないようにしましょう。

② 視線誘導を意識しよう

人の視線は自然と左上〜中央(F型/Z型)に最初に落ちます。
一番伝えたい情報を左上〜中央に配置すると、読者の目に留まりやすくなるので覚えておきましょう。

③ タイトルの完全コピーを避けて情報量を2倍に

記事タイトルをそのままアイキャッチに入れるのはもったいない。
例えば記事タイトルが「Canvaの使い方」なら、アイキャッチには「初心者でも5分で作れる!」など、タイトルに載っていない情報を加えると読者の興味を引きやすくなります。

④ 統一感のあるデザインにしよう

色・フォント・レイアウトをブログ全体で統一すると、一覧ページで見たときにぐっとプロっぽく見えます。
Canvaの「ブランドキット」機能を使うと、カラーやフォントを登録しておけるから毎回設定する手間が省けて便利!(⚠️ブランドキットは有料プランの機能)
無料プランの場合は、使う色のカラーコードとフォント名をメモしておいて、毎回同じものを選ぶようにしましょう。

4. WordPressにアップする方法

Canvaでダウンロードした画像を、WordPressのアイキャッチに設定してみましょう。

① メディアライブラリにアップロード

WordPress管理画面 → メディア → 新しいメディアファイルを追加 → ダウンロードした画像を選択してアップロード。

② 記事のアイキャッチに設定

記事の編集画面を開いて、右側のメニューから「アイキャッチ画像」→「アイキャッチ画像を設定」をクリック。
さっきアップロードした画像を選んで「アイキャッチ画像を設定」を押す。
まだメディアライブラリにアップロードしていない場合は、「アイキャッチ画像」の枠に直接ドラッグ&ドロップでも反映できます。

③ プレビューで確認しよう

設定できたら必ずプレビューで確認。
スマホ表示でも崩れていないかチェックするのを忘れずに!

5. まだブログを開設していない方へ

アイキャッチの作り方はわかったけど、「そもそもまだブログを始めていない…」という方はこちら!
WordPressブログを始めるならConoHa WINGがおすすめ。

\ ブログ始めるならここ! /

ConoHa WING公式ページ >>

まとめ

この記事では、Canvaを使ったWordPressブログのアイキャッチの作り方を解説しました。

  • アイキャッチの推奨サイズは1200×630px
  • セーフゾーンを意識して、大事な文字は端に置かない
  • 文字は少なく・大きく、10文字以内がベスト
  • 色・フォント・レイアウトを統一してプロっぽく仕上げよう

デザインの知識がなくても、Canvaの無料プランで十分おしゃれなアイキャッチが作れます。まずは1枚作ってみてね!

ブログをまだ始めていない方は、ConoHa WINGからスタートするのがおすすめです。

契約からWordPressの初期設定まで、初心者向けにまとめた記事があるのでこちらもチェックしてみてね( ・▽・)⊃

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