崖っぷちシーアのサバイバルチャレンジ

転んでもタダでは起きない!節約と投資でどん底から這い上がります。陸マイラー志望。

ブログのアイキャッチ画像を作るために役に立つサイト8選

こんにちは。シーアです。(@seer_1118

 

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

 

アイキャッチ画像はブログの顔

ブログのトップに表示されるアイキャッチ画像。今まで、フリーフォトや自分で撮った写真を、サイズ調整だけしてそのままアップしていました。

それでもいいのですが、他の方のブログでは、画像に文字を乗せたりして、記事の内容がより伝わるように工夫されていますよね。あれ、いいな~、かわいいな~と思って、自分もやってみようと思い立ちました。

そこで、アイキャッチ画像の制作に役立つサイトを8つ集めました。自分メモ的に公開します。

フリーフォト

写真がキレイだと目を引きますよね。自分で撮った写真も使いますが、背景がごちゃごちゃしていたり、影が入ってしまっていたりと、使いにくい場合もあります。著作権フリーの写真はアイキャッチに便利です!

GIRLY DROP

girlydrop.com

私はかわいい・おしゃれな写真を探すとき、「GIRLY DROP」、略して「がりどろ」をよく見ます。女の子らしくてキュンとときめく画像がいっぱいです!お花の写真もたくさん。バレンタイン、ハロウィンなどの季節感のあるものも。

Unsplash

unsplash.com

おしゃれさ・美しさで言うとこちらがダントツ。海外のサイトなので英語です。ちょっと使いにくいものもあるのですが、色を抑えた写真がセンス良いです。

写真AC

www.photo-ac.com

王道は「写真AC」ですよね。種類が豊富で、記事の内容やシチュエーションに合わせて、多彩な画像の中から選べます。 オシャレなものもあるけど、実用的なもののほうが多いかな。

文字を乗せたり加工するのは「canva」で

画像が用意できたら、次は加工です。プロみたいなすごいスキルがなくても、文字などをレイアウトしてオシャレにできる「canva」がオススメです。ソフトではなく、オンライン上で作業ができるので、容量などを気にしなくてもいいのもメリット。もちろん無料です。

Amazingly Simple Graphic Design Software – Canva

オシャレなテンプレートがあるので、画像や文字だけを差し替えるだけで、いい感じになってくれます。私はスキルもセンスもないので、大変助かります!

使い方や、何ができるかは、こちらのサイトで初心者向けに詳しく解説してくださっています。ありがとうございます!

saruwakakun.com

アイキャッチ画像サイズチェッカーで、シェアされた時どう表示されるかをチェック

こちらも前述のCanvaと同じく、サルワカさんのサイトです。加工した画像が、twitterやfacebookでシェアされた際に、どんな風に見えるかをシミュレーションしてくれます。

saruwakakun.com

はてなブログのTOPページや、カテゴリごとの記事一覧画面では、左右がトリミングされて正方形のサムネイル画像が表示されます。写真の斜め下などにキャッチコピーが来ている画像だと、文字が途切れてしまって、せっかくのアピールポイントが見えなくなってしまうことも。 

私のスキルがないせいですが、全部気にしていたら、いつまで経ってもCanvaで微調整し続けて、なかなかアップできなくなってしまいます。慣れもあるかもしれませんが…。

なので、よく目に触れる「はてなブログのサムネイル画像」と、「twitterでシェアされたときの画像」だけ、注意して作成するようにしました。

facebookは私がやってないので、あまり拡散されている実感がないのと、Twitterが大丈夫ならfacebookでも大丈夫みたいなので、いったん置いときます。

アイキャッチ画像の変更がTwitterに反映されないとき

ところで、アイキャッチ画像を変更しても、それをTwitterでシェアしたら前のアイキャッチ画像のまま…ということが結構あります。今回それで試行錯誤してて、解決策を見つけたので、参考にご紹介します。

www.elppar.com

例えばこちらの記事ですが、

  • 2017年9月に記事を公開(アイキャッチA)
  • Twitterでシェア(アイキャッチA)
  • 2018年4月に記事を修正(アイキャッチBに変更)
  • Twitterでシェア(アイキャッチがAのまま)

という状況でした。実は、ツイッターは毎回最新の情報を取得してシェアしているのではなく、一度拡散されたデータは残っていて、それが次にも利用されているのです。

Card validator」にアクセスして、該当ページのURLを入力すれば、保存されている情報が更新されます。さっそく、新しいアイキャッチ画像に変わりましたよ。助かりました!

画像サイズを小さくしよう

画像をそのままアップロードすると、サイトが重くなり、ブログの表示速度が遅くなります。できるだけ容量の軽い画像にしてアップしましょう。なかなか表示されないサイトは、ユーザーも見たくなくなりますもんね。

JPEGmini

JPEGの場合は「JPEGmini」を使っています。無料・登録不要です。1枚ずつしかアップできないのが難点ですが、操作が分かりやすく、使いやすいです。

www.jpegmini.com

CompressPNG

私はあまりPNG画像を使わないのですが、PNGの方が容量が大きいしキレイなんですよね。PNGの場合は「CompressPNG」があります。こちらも無料です。

compresspng.com

参考~サルワカさんのサイト

これらの情報は、サルワカさんのサイトを参考にさせていただきました。CanvaやUnsplashはこちらで初めて知り、使ってみました。デザインのコツも勉強になります。ありがとうございます!

saruwakakun.com

関連記事

Googleアドセンスの審査が難しいと聞きますが、当ブログは申請から導入まで1日かからずスムーズに承認されました。気をつけたポイントなどまとめています。

www.seer1118.work

過去記事、絶賛リライト中です。主にタイトル、見出し、内容が古くなっていないかなどをチェックして修正しています。これからアイキャッチ画像も変えたいな~。

www.seer1118.work