
アイキャッチの作り方ってみんなどうやってるの?コツとか知りたいな。
この記事では上記のような疑問を解決します
この記事の想定読者
- ブログのアイキャッチ画像の作り方を知りたい人
- ブログのアイキャッチ画像の作るコツを知りたい人
私はデザインの知識は皆無でしたが、友人のデザイナーにデザインについて教えてもらいました。
意識する点や大事な点について私なりにまとめてみました。
参考までに私の1記事目と最新記事のアイキャッチを載せておきます。


1.ブログアイキャッチ画像の必要性
●ブログアイキャッチは大事
理由としては、2点あります
1.サイト内での滞在時間の増加
アイキャッチにインパクトがあるとその記事を見てくれる率が上がるため
2.SNSからの流入が見込める
SNSにアイキャッチ込みで共有した時のインパクトも流入に変化が出るため
●読者はアイキャッチを見てる
アイキャッチを見てることは感覚的にわかると思います。
ユーチューブ見ている時、結構サムネを見て選ぶことありますよね。
結構、日常の中で視覚的に決断していることも多いので、アイキャッチは大事です。
しかし、一瞬しか見ないことが多いのも確かです。
2.アイキャッチ画像作成ツール
Photoshop(フォトショップ)を使えば写真をアーティスティックに加工したり、手描きのイラストを取り入れたりなどと、たくさん表現ができます。
とはいえ、ブログのアイキャッチ画像は基本的にイラストや写真を軽くいじるだけですし、ブログは記事の内容がメインなので、あえて有料にする必要はないかと思います。
Illustrator(イラストレーター)はフォトショップよりも、イラストレーターの方がアイキャッチ画像を作るような、レイアウト作業に向いています。
私も購入を検討しましたが、最初のうちは無料でも良いものが作れるのを知ったので、まだ購入するには至ってません。
私が使っているのがCanva(無料)です。
十分におしゃれなアイキャッチ画像を作ることができます。
案外利点なのが、ソフトをインストールする必要がないこと(Web上で使える)。
操作方法もシンプルで直感的にできます。
初心者はCanvaでOKだと思います。
3.【筆者版】ブログアイキャッチ画像を作る手順(Canva使用)
●Canvaを使用したアイキャッチ作成手順
1画像サイズの決定
2背景の画像かテンプレ選び
3テキスト挿入
4全体のデザインの修正
5画像保存
6画像圧縮
7完成

ホームページにて左上の1「デザインを作成」をクリック
次に2「プレゼンテーション」をクリック。
するとこの画面になるので、ここから作成開始です。

他にも様々なサイズのイラストも作成できるので無料なのが素晴らしいです。
記事との関連性がありそうな画像もしくは背景のテンプレを選びます。
●写真の場合
商用利用可の無料素材まとめサイトの「OADAN」をよく使ってます。
●テンプレの場合

左上のテンプレートを選択します。
検索し、自分に合うものを見つける。

左の「テキスト」を選択するとフォントのテンプレもあるので便利です。
左上英語で書いてあるところを押すと様々なフォントが選べます。

全体の配置や、ぼかし、色合いなどを最終調整します。
今回はこんな感じで仕上がりました。

最後に右上のダウンロードマークを押して保存します

この際、私は基本PNGで保存します。
イラストのような場合はPNG形式を選ぶとボヤけにくくなるので、おすすめです
ただ写真の場合はファイルが重くなるのでJPGで保存します。
次に必須作業とも言える画像圧縮をします。
私は完成したイラスト等の画像はパソコンのフォルダに一応保存しておいてます。
この一連の流れを20分ぐらいでできるのが理想でしょう。
ぜひ参考にして見てください。
4.アイキャッチ画像を作るコツ
●配色を意識する
色合いは難しいですよね。
基本的に原色に近い色(青や赤などそのものの色)は薄めたりしてます。
配色パターンもググってバランスの良いものを使います。
また色の数も多くても4個ぐらいまでにしてますかね。
●アイコンを使用
可愛いアイコンを使うのも案外サイトに統一感が出て良いです。
アイコンはフリー素材サイトの「FLAT ICON DESIGN」
もしくは「Font Awesome」を使ってます。
●綺麗な写真を使用
基本的に見やすい画像であればなんでも良いと思います。
無料でも良い画像は見つかりますので、それを自分なりにアレンジして独自性を出せば良いかと思います。
とはいえ、有料の画像サイトは時短にも繋がりそうなので、お金に余裕ができたら契約しようか考えている私です。笑
●シンプルな写真にテキストを挿入
背景がごちゃごちゃしてる写真は文字がわかりにくいです。

良い例はシンプルで文字を埋めやすい画像

●文字の強調
画像がシンプルの方がテキストを埋めやすいです。
とはいえ、使いたい画像が文字を強調しにくい時ありますよね。
そんなとき私は背景画像にぼかしを入れることが多いです。
こんな感じで。

5.アイキャッチ画像のSEO対策
●見出しh2の後に入れる?
見出しの後にアイキャッチはブロガーさんの多くが入れていますよね。
文字数が多くなりすぎて記事が読みずらい場合は入れてあげたり、見出しの説明に使用したりするのは良いと思います。
しかし、でたらめに意味のない画像を入れすぎるのは良くないと思います。
●画像のalt設定はする?
これはSEO対策になります。 これは理由があります。
下記のようになるからです。
読者→画像を見る
Google→altの文字を見る
Googleのクローラーが徘徊する際、画像の代わりになるalt部分を認識しているためです。
しかしやりすぎは禁物です。
<img src=”画像のURL” alt=”〇〇”/>

<img src=”画像のURL” alt=”鼻をかき、どこかを見つめるゴリラ”/>
<img src=”画像のURL” alt=”鼻ほじる、たくましい、優しそう、どこか見てるゴリラ、”/>
6.最後に
初心者はとにかくCanvaで十分ですね。
アイキャッチについては時間はかけすぎは禁物ですが、きちんとした知識で作成していくことは大事だと思います。
最初は時間がかかっても、この記事で触れたことを意識してアイキャッチを作成してくれたら幸いです。