現在エンジニア兼ブロガーとして日々楽しく過ごしています。
本記事では実際に私が普段行なっている、ブログのアイキャッチ画像をおしゃれに作る方法を紹介します！
今回使用するサイトは以下の２つです。
Pixabayに関してはあくまで画像をダウンロードするだけなので、既にお気に入りの画像がある場合はそちらをお使いいただいて問題ありません！
カスタマイズ方法だけ知りたいという方は、Canvaでカスタマイズに飛んでください！
完成系のイメージ
今回は本記事で使用している、以下のようなアイキャッチ画像を例として作成します。
| サイズ | 728px × 435px |
| 背景透過度 | 70% |
| フォント | けいふぉんと |
基本的には画像を入手してCanvaでカスタマイズの流れになります。
-
【おすすめ】WordPressのテーマにAFFINGER5(WING)を選んだら大成功だった話【後悔しない】
このブログはWordPressで運用をしていますが、テーマにを使用しています。 本記事では、WordPressのテーマが多すぎて選べないという方や AFFINGERって良く聞くけど本当に ...
続きを見る
-
【保存版】ブログアフィリエイトを始める為のベストプラクティス【副業】
これからブログを始めたいけどどうしたら良いか分からない！ アフィリエイトで稼ぎたいけど、サーバーとか多いしWordPressとか意味不明！！という方に向けて 必要なことやその選択肢としてのベストプラク ...
続きを見る
使いたい画像をダウンロード
まずは背景に使いたい画像をダウンロードします。前述しましたが、ここの画像は好きなもので構いません！！
今回は私が愛用している、『Pixabay』からダウンロードします。
サイトにアクセスして検索するだけ
使い方はめちゃくちゃ簡単です。以下のURLから公式サイトにアクセスし好きなワードで検索するだけです。
公式サイト：https://pixabay.com/ja/
こちらの検索窓に任意のワードを入力して検索してください！
お好きな画像が見つかったら、画像を選択すると以下のような画面になりますので
右カラムの画像ダウンロードからダウンロードします。
サイズについては、お使いのブログに合わせることをおすすめしますがこの後のCanvaでも調整できるので１番小さいものでも良いかもしれません！！
Canvaでカスタマイズ
いよいよCanvaでカスタマイズをします！
慣れるとめちゃくちゃ簡単におしゃれな画像が作れますのでぜひお試しください！！
アカウント作成とログイン
Canvaの使用にはアカウントが必要になります。（もちろん無料です）
以下のURLから公式サイトにアクセスしてください。
公式サイト：https://www.canva.com/
左カラムの『Googleで登録』『Facebookで登録』『メールアドレスで登録』のいずれかからアカウントを作成してください。
特に悩む手順はないので、作成しログインまで行なってください！
サイズを選ぶ
Canvaでは初めから用意されている画像サイズと、自分で好きなサイズを設定できるカスタムサイズというものがあります。
今回はせっかくなのでカスタムサイズを使ったやり方を紹介します！
と言っても超簡単です！画面右端のカスタムサイズを押して幅と高さを指定するだけ！！
ちなみに本ブログのアイキャッチは以下のサイズで作成しています。
| 幅 | 728px |
| 高さ | 435px |
プルダウンで単位を指定できるのでお忘れなく！！
画像をアップロード
サイズを選んだら次のような画面が立ち上がります。
左カラムのアップロードからお好きな画像をアップロードします！
ちなみに、Canvaにも画像があるのでそちらから使うことも可能です！（著作権等にご注意ください）
アップロードができたら、カスタマイズするために右側の真っ白なキャンバスに画像をドラッグし投げ込んでください。
このように、画像がキャンパスいっぱいに広がるようにします。
キャンバス上で画像をカスタマイズ
最後にアップロードした画像をカスタマイズします。
Canvaでは様々なカスタマイズが行えますが、今回具体的に行うのは以下の作業です！
- 画像を透過させる
- 文字を入れる
こんなこともめちゃくちゃ簡単にできます。
画像を透過させる
画像を透過させると書いていますが、実際にはアップロードした画像の透過を行う訳ではありません。
アップロード画像の上いっぱいに色付きの図形を配置し、その図形を透過させることで上記完成図のような透過を実現しています。
まずは、左カラムの図形から正方形を選択しキャンバスにドロップしてください。
このような状態になると思います。
ここまでできたら次に、図形をキャンバスいっぱいに広げます。
一時的にアップロードした画像が何も見えなくなってしまいますが、問題ありませんのでご安心ください！
図形を透過するため、右上の透過マーク（
←『配置』の隣にあるコレ）をクリックして透過度を設定します。
透明度をドラッグで調整すると、後ろのアップロードした画像が透けて見えるようになりますので
お好きなところで設定してください。
基本的に、透過が少ないほど上に文字を重ねた時に見やすくなります。（後でいくらでも調整可能です）
ちなみに、この透過させている図形の色をお好きな色に変更することができます。
（おそらく今はダークグレーになっていると思います）
図形にフォーカスが当たっている状態で、キャンバス左上の色指定マークを押して好きな色に変更できます。
文字を入れる
次に文字を入れます。
今回の完成系の例だと、「おしゃれなアイキャッチ画像を作る！ Canvaの使い方」ですね。
左カラムの『テキスト』から『見出しを追加』を押すとキャンバス上にテキストが追加されます。
このテキストの内容を好きなものに変えるだけでOKです！！（簡単すぎる！）
上記の例だと、『おしゃれなアイキャッチ画像を作る！』と『Canvaの使い方』のフォントサイズが異なっていますが、単純に見出しを２つ追加してそれぞれの大きさを変更しているだけです！
フォントの大きさや色などは、文字にフォーカスが当たっている状態でキャンバス上部から変更ができます！
コレで完成！！
慣れたら３分もかからずにできると思います！
おしゃれなアイキャッチで見やすいブログ記事を！
今回はCanvaを使用したおしゃれなアイキャッチ画像の作り方を紹介しました！
アイキャッチに時間を掛けるのは最初しんどいかもしれないですが、慣れたらめちゃくちゃ簡単ですし
ブログを見に来てくれたユーザーにも親切度と、この記事はちゃんとしているんだなという印象を与えることができるのでぜひ参考にして見てください！！
-
【おすすめ】WordPressのテーマにAFFINGER5(WING)を選んだら大成功だった話【後悔しない】
このブログはWordPressで運用をしていますが、テーマにを使用しています。 本記事では、WordPressのテーマが多すぎて選べないという方や AFFINGERって良く聞くけど本当に ...
続きを見る
-
【保存版】ブログアフィリエイトを始める為のベストプラクティス【副業】
これからブログを始めたいけどどうしたら良いか分からない！ アフィリエイトで稼ぎたいけど、サーバーとか多いしWordPressとか意味不明！！という方に向けて 必要なことやその選択肢としてのベストプラク ...
続きを見る
