ブログ・アイキャッチ画像の作り方【Canva(キャンバ)】

WordPressブログや無料ブログのアイキャッチ画像はおよそ16:9の比率に近ければなんでもよく、Cocoonでは1200px*630pxが推奨されており、個人的な経験では600px*350pxが表示速度的にもおすすめのサイズです。アイキャッチ画像は大きすぎても意味は無いので横幅600pxから800pxにした比率で作ると無難です。

 

スポンサーリンク

ブログのアイキャッチ画像の作り方

求められている画像サイズと表示速度

大前提としてブログのアイキャッチ画像は

  • 600px*350px程度の小さめの画像
  • カラフルならJPG(EWWW使用)
  • 2色ならPNG(EWWW使用)
  • 画像容量は極力抑えて表示速度スコアを上げる

などを考慮して、その画像を見るだけで何が書かれている記事なのか伝わるように文字を主体にしてデザインした方が良いです。

 

このページのアイキャッチ画像であればこれですが、これもCanvaで作ったものです。このサイトのCanva関係のアイキャッチ画像は全部この形式です。Canva Freeでは600px*350pxで作った画像はそのままでしか使えないですが、Canva Proであれば600px*350pxサイズを1920px*1080pxサイズに大きくリサイズできます。

 

基本的にはテンプレートをベースにオリジナルのアイキャッチ画像にすればよく、記事1つ1つを完全ゼロからのこだわり画像にする必要はないです。そこまでこだわっても検索結果での順位やアクセス数にはあまり変化はありません。

 

関係するとしたらSNSに記事を共有した場合に影響するOGP画像です。OGP画像が魅力的であればクリックされる確率が上がりますので、インパクトがあり、おもしろそうで、遊び心があるアイキャッチ画像にするのが、個人的な経験からのおすすめです。

 

おしゃれなテンプレートの見つけ方

Canvaのテンプレート検索で

  • ブログ
  • アイキャッチ
  • Blog
  • Blogバナー
  • プレゼン
  • タイトル画像
  • thumbnail
  • サムネイル

と検索すると良い感じのカラフルでおしゃれなテンプレートが出てきます。どれもちょっと騒がしくて大切な情報が目に入ってこない感じのデザインですが、イマドキのごちゃついたのが好まれるデザインとしてはちょうどいいくらいでしょう。

 

グリッド表示形式の画像を背景にして、左から帯を差し込んでテキストを載せており、画像さえおしゃれならば良い感じのアイキャッチ画像になりそうです。5選の所で、「選」の文字が見づらいのでちょっとデザインを工夫するか、右下の画像を色合いの違うものに変えれば問題ないでしょう。

 

シンプルで分かりやすく、内容も伝わりやすいですが、使用する画像の品質にすべて持っていかれるのでセンスが問われます。またSNS上ではタイムラインで目立たないため手書きのイラストをつけるか、キャラクター系のイラスト素材を載せると遊びが出ておしゃれさが増すはずです。

 

THEイマドキのデザインという感じですが、同じ構図で色々転用すると全体的に違和感が出てしまうのと、WordPressのトップページで一覧表示された時に文字が見えなくなるので、フォントを変えつつ、たまぁにこのタイプのアイキャッチ画像にする感じだったら映えるはずです。

 

シンプルかつ内容が伝わりやすいですが、左側の白い枠がちょっぴり余白が多すぎるので、背景枠の形を変えつつ、画像の配置をずらしてと枚数も2枚にし、画像を大小重ねるようにすれば雰囲気がもっと出そうです。あとはテキストのフォントを柔らかくすれば良い感じに生かせそうです。

 

色合いが統一されていて使いやすいですが、視線が泳ぎすぎて何を伝えたい記事なのか、ちょっと印象に残りづらいため「演出」の文字が大きくなるようにテキストボックスを分けて、フォントサイズも大きくすればいい感じになりそうです。

 

テンプレートをアレンジしてアイキャッチ画像を作る

上記のテンプレート例は、Canvaで検索したら誰でも使える(Canva Proなら)ものです。どれもテンプレートなので、自分のウェブサイトやテーマではこうしたいと思う部分を変更していって思い通りのデザインにしましょう。

 

慣れてくるとアイキャッチ画像のイメージが自然に浮かんでくるので、ゼロから組み直してしまいましょう。

 

個人的アイキャッチ画像作製のコツ

個人的には、ブログ用のアイキャッチ画像で重視しているものから組みます。

  1. テキストとフォント
  2. 背景画像や枠
  3. 追加のアクセントになるアイテム

いつもこの順番でアイキャッチ画像を作ります。文字で情報を伝えるサイトなので、文字がしっかり読者の目に入るようにする必要があります。

 

またSchema、構造化データ、リッチリザルトでアイキャッチ画像を表示させる場合には、横長長方形の画像の中央正方形だけ切り抜かれて検索結果に表示されます。大切な情報は、できる限りアイキャッチ画像の真ん中に寄せるようにしましょう。

 

スポンサーリンク

Posted by 管理人