2019こんにちは、クライン(@kleinitblog)です。現在エンジニア兼ブロガーとして日々楽しく過ごしています。本記事では実際に私が普段行なっている、ブログのアイキャッチ画像をおしゃれに作る方法を紹介します!今回使用するサイトは以下の2つです。画像をおしゃれにカスタマイズするサイトPixabayに関してはあくまで画像をダウンロードするだけなので、既にお気に入りの画像がある場合はそちらをお使いいただいて問題ありません!カスタマイズ方法だけ知りたいという方は、Canvaでカスタマイズに飛んでください!完成系のイメージ今回は本記事で使用している、以下のようなアイキャッチ画像を例として作成します。けいふぉんと基本的には画像を入手してCanvaでカスタマイズの流れになります。【おすすめ】WordPressのテーマにAFFINGER5(WING)を選んだら大成功だった話【後悔しない】このブログはWordPressで運用をしていますが、テーマにを使用しています。...続きを見る使いたい画像をダウンロードCanvaでカスタマイズアカウント作成とログインサイズを選ぶ画像をアップロードキャンバス上で画像をカスタマイズ使いたい画像をダウンロードまずは背景に使いたい画像をダウンロードします。前述しましたが、ここの画像は好きなもので構いません!!今回は私が愛用している、『Pixabay』からダウンロードします。サイトにアクセスして検索するだけ使い方はめちゃくちゃ簡単です。以下のURLから公式サイトにアクセスし好きなワードで検索するだけです。公式サイト:https://pixabay.com/ja/こちらの検索窓に任意のワードを入力して検索してください!お好きな画像が見つかったら、画像を選択すると以下のような画面になりますので右カラムの画像ダウンロードからダウンロードします。サイズについては、お使いのブログに合わせることをおすすめしますがこの後のCanvaでも調整できるので1番小さいものでも良いかもしれません!!CanvaでカスタマイズいよいよCanvaでカスタマイズをします!慣れるとめちゃくちゃ簡単におしゃれな画像が作れますのでぜひお試しください!!アカウント作成とログインCanvaの使用にはアカウントが必要になります。(もちろん無料です)以下のURLから公式サイトにアクセスしてください。公式サイト:https://www.canva.com/左カラムの『Googleで登録』『Facebookで登録』『メールアドレスで登録』のいずれかからアカウントを作成してください。悩む手順はないので、作成しログインまで行なってください!サイズを選ぶCanvaでは初めから用意されている画像サイズと、自分で好きなサイズを設定できるカスタムサイズというものがあります。今回はせっかくなのでカスタムサイズを使ったやり方を紹介します!と言っても超簡単です!画面右端のカスタムサイズを押して幅と高さを指定するだけ!!ちなみに本ブログのアイキャッチは以下のサイズで作成しています。435pxプルダウンで単位を指定できるのでお忘れなく!!画像をアップロードサイズを選んだら次のような画面が立ち上がります。左カラムのアップロードからお好きな画像をアップロードします!ちなみに、Canvaにも画像があるのでそちらから使うことも可能です!(著作権等にご注意ください)アップロードができたら、カスタマイズするために右側の真っ白なキャンバスに画像をドラッグし投げ込んでください。このように、画像がキャンパスいっぱいに広がるようにします。キャンバス上で画像をカスタマイズ最後にアップロードした画像をカスタマイズします。Canvaでは様々なカスタマイズが行えますが、今回具体的に行うのは以下の作業です!画像を透過させる文字を入れるこんなこともめちゃくちゃ簡単にできます。画像を透過させる画像を透過させると書いていますが、実際にはアップロードした画像の透過を行う訳ではありません。アップロード画像の上いっぱいに色付きの図形を配置し、その図形を透過させることで上記完成図のような透過を実現しています。左カラムの図形から正方形を選択しキャンバスにドロップしてください。このような状態になると思います。ここまでできたら次に、図形をキャンバスいっぱいに広げます。←『配置』の隣にあるコレ)をクリックして透過度を設定します。透明度をドラッグで調整すると、後ろのアップロードした画像が透けて見えるようになりますのでお好きなところで設定してください。基本的に、透過が少ないほど上に文字を重ねた時に見やすくなります。(後でいくらでも調整可能です)ちなみに、この透過させている図形の色をお好きな色に変更することができます。(おそらく今はダークグレーになっていると思います)図形にフォーカスが当たっている状態で、キャンバス左上の色指定マークを押して好きな色に変更できます。文字を入れる次に文字を入れます。Canvaの使い方」ですね。左カラムの『テキスト』から『見出しを追加』を押すとキャンバス上にテキストが追加されます。このテキストの内容を好きなものに変えるだけでOKです!!(簡単すぎる!)上記の例だと、『おしゃれなアイキャッチ画像を作る!』と『Canvaの使い方』のフォントサイズが異なっていますが、単純に見出しを2つ追加してそれぞれの大きさを変更しているだけです!フォントの大きさや色などは、文字にフォーカスが当たっている状態でキャンバス上部から変更ができます!コレで完成!!慣れたら3分もかからずにできると思います!おしゃれなアイキャッチで見やすいブログ記事を!今回はCanvaを使用したおしゃれなアイキャッチ画像の作り方を紹介しました!アイキャッチに時間を掛けるのは最初しんどいかもしれないですが、慣れたらめちゃくちゃ簡単ですしブログを見に来てくれたユーザーにも親切度と、この記事はちゃんとしているんだなという印象を与えることができるのでぜひ参考にして見てください!!【おすすめ】WordPressのテーマにAFFINGER5(WING)を選んだら大成功だった話【後悔しない】このブログはWordPressで運用をしていますが、テーマにを使用しています。現在5年目のエンジニアで26歳です。山のようにあるプログラミングスクールの中から、特におすすめなスクールをタイプ別に逆引きで3つ紹介します。...3【厳選】Udemyでセール時に購入すべきオススメの動画まとめ!みなさんはを使っていますでしょうか。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。して少なめの給料で働いています。現在は5年目、担当は主にサーバサイド〜インフラ。...ブログ開設3ヶ月で1万円の収益が出たので、登録したアフィリエイトASPを紹介する。本ブログを開設してから約3ヶ月ほどが経過しました。いう方に向けて、デフォルトの表示からCSSでカスタマイズする方法を紹介します。...PREVAWSのソリューションアーキテクトに合格する為におすすめの本や動画まとめ!【認定資格の学習法】NEXT【Mac】iTerm2に脆弱性が見つかったのでアップデート手順まとめ!クラインほぼ未経験の新卒でエンジニアとして就職し、日々勤務しています。現在5年目、だいたいサーバサイド〜インフラをやってます。現在5年目のエンジニアで26歳です。山のようにあるプログラミングスクールの中から、特におすすめなスクールをタイプ別に逆引きで3つ紹介します。...3【厳選】Udemyでセール時に購入すべきオススメの動画まとめ!みなさんはを使っていますでしょうか。