• HOME
  • デザイン
  • アイキャッチ画像サイズの適正値。各SNSの適切なサイズを解説

アイキャッチ画像サイズの適正値。各SNSの適切なサイズを解説

アイキャッチ画像は、サイトを閲覧したときに最も目を引く大事な画像です。自身が運営するSNSのアイキャッチ画像サイズで迷っている人や、やったことのない人でも簡単にできる、アイキャッチ画像のサイズ適正についてお伝えしていきます。

Offers」は、時代の変化や環境にあわせてスキルを磨きたい、そんな人にぴったりのサービスです。「副業・複業」で、本業では経験できない、新しい環境/デザイン組織を経験しよう!

→「Offers」をもっと詳しくみる! かんたん60秒で副業を始めてみる

WordPressでアイキャッチ画像を設定する

WordPressの『アイキャッチ画像』とは、サムネイル画像と同義で、興味関心を引き出すためのインパクトある画像を指します。 アイキャッチ画像は、記事ごとに設定した『ページを象徴する写真・イラスト・記号(ピクトグラム)』全般で、ブログの記事の冒頭や、記事一覧ページに配置されるため、クリック率を引き上げる重要な役割を担っています。 実際にWordPressでアイキャッチ画像を設定する方法をみていきましょう。

編集画面から追加

アイキャッチ画像の追加は非常に簡単です。WordPressにログインし、管理画面のメニューから『設定』→『メディア』をクリックします。 メディア設定画面では、『サムネイルのサイズ(150×150ピクセル)・中サイズ(300×300ピクセル)・大サイズ(1024×1024ピクセル)』と、3種類の画像サイズが指定できるようになっているため、ここから画像を追加しましょう。

サイズを変更したい場合

WordPressをインストールした直後の状態だと、サムネイルサイズ・中サイズ・大サイズが指定されています。 『サムネイルのサイズ(150×150ピクセル)』をクリックし、変更したい幅と高さを決めて『変更を保存』で、サイズ変更は完了です。
\新しい環境/デザイン組織を経験するなら「0ffers」!/

Offersの詳細はこちら

SNSに投稿する際に適切なサイズ

ブログ運営をしている人は、複数のSNSを開設・連携している場合が多いでしょう。しかし、ほとんどのSNSでは、アイキャッチ画像は自動的に、それぞれのSNSのサイズにリサイズされてしまいます。 Facebook・Twitter・はてなブックマークで、アイキャッチ画像を適切に表示させるためのサイズを解説していきます。

Facebookの画像サイズ

SNSには『OGP(Open Graph Protocol)』という、『ページタイトル・URL・概要・アイキャッチ画像』を、適切に表示させるシステムが組まれています。 『Facebook』でアイキャッチ画像を正しく表示するためには、パソコン表示では『横1200ピクセル×縦630ピクセル』が推奨されています。スマホでは『横470ピクセル×縦246ピクセル』で、基本的にパソコンサイズでの縮小表示です。 Facebookでは、縦長の画像は上下がカットされてしまうため、Facebook用のアイキャッチ画像を作成するときは『横縦比率1.91:1』のサイズが理想です。

Twitterの画像サイズ

『Twitter』では、小さい正方形と、大きめの長方形の2種類のサイズを選択できます。正方形は横縦比1:1 で、長方形は横縦比が2:1になる『横1024ピクセル×縦512ピクセル』のサイズが、パソコンでの適正サイズです。 Twitterでも縦長の画像は、上下部分がカットされます。スマホでの表示は、Facebookとほぼ同じ『横450ピクセル×縦253ピクセル』なので、基本的にFacebookと同じ画像使用で問題ないでしょう。

はてなブックマークの画像サイズ

『はてなブックマーク』は、アイキャッチ画像を投稿するという概念はなく、記事がホットエントリーされたときに画像が表示されるシステムです。 比率は『1.43:1』で、パソコンサイズでは『横400ピクセル×縦280ピクセル』、スマホでは『横198ピクセル×縦139ピクセル』です。 はてなブックマークでは、縦横比が合わなかった場合、上下左右がバランスよくカットされるのではなく、上下は下から、左右は右からカットされるため、不恰好な画像にならないよう、公開前にサイズを合わせておきましょう。

アイキャッチ画像作成で便利なサイト

実際にアイキャッチ画像を作成する手順を紹介します。画像や写真には著作権や肖像権があるので、サイトにある画像を無断で使用するのは違法行為です。 素材として販売している写真を購入したり、無料で使用可能な画像をダウンロードしたり、もちろん自分が撮影した写真なら、被写体の許可を得ている場合に限り、使用可能とされています。 それらの画像をSNSにアップするときに、知っておくと便利なサイトを紹介します。

OGP画像シミュレータで適正値を調べる

複数のSNSに適合する画像サイズを探すのは、かなり労力が必要です。FacebookのOGP画像のサイズなら、ぜひ『OGP画像シミュレータ』を試してみましょう。 自分が作成したいアイキャッチ画像を、ドラッグ&ドロップするだけで、Facebookで表示されるデザインをシミュレートできます。

OGP画像シミュレータ | og:image Simulator

写真ACでフリー素材を手に入れる

無料会員登録で全ての写真が使える『写真AC』は、商用利用も可能な画像素材が非常に多く、リンクやクレジットも表記不要なので、多くのSNSで利用されています。 写真ACのほかにも、『イラストAC』や『シルエットAC』などの無料素材サイトが展開されており、希望のアイキャッチ画像を探すのにおすすめです。

写真素材なら「写真AC」無料(フリー)ダウンロードOK

Canvaで画像を編集する

「フリー素材を、アイキャッチ画像として掲載するだけでは物足りない」という人には、オーストラリア発祥の『Canva(キャンバ)』を利用してみましょう。 Photoshopを扱うような専門知識がなくても、オリジナリティのあるデザインやレイアウトが作れ、サイズ変更はもちろん、文字入れも簡単にできます。

Canvaグラフィックデザインを無料で簡単作成

まとめ

アイキャッチ画像は、そのサイトや記事の印象を一瞬で左右する、とても大事な画像です。どんなにかっこよいデザインや写真を使っていても、サイズが不恰好にリサイズされていては台無しです。 それぞれのSNSに適した画像サイズを知って、アイキャッチ画像を自在に操り、インパクトのあるSNS運用を楽しみましょう。
Offers」は、時代の変化や環境にあわせてスキルを磨きたい、そんな人にぴったりのサービスです。

いくつもの転職媒体を使って、企業を探し回るのはもう終わり。「副業」から始まる新しい働き方を実現します!

本業では経験できない、新しい環境/デザイン組織を経験しよう!



この記事をシェア

関連記事


副業・フリーランス

プログラミング

デザイン

インタビュー

【Unity&バックエンド採用】Offersコンシェルジュを活用し、VPoE業務に集中できた恩恵とは

幼児や小学生の家庭学習の必要性が求められている今、企業や団体がICTを活用した学習コンテンツの開発に注目している。ファンタムスティックは子ども用の学習アプリやデジタル教育コンテンツの開発に強みを...

転職前提の複業オファーで、2ヶ月後に正社員へ!未来のCTOを採用した注目スタートアップの採用術

スニーカー市場は熱狂的なファンも多く、一次流通・二次流通ともに毎年拡大を続けている。そのような市場の中、スニダンことスニーカーダンク(SNKRDUNK)は市場の拡大を追い風に成長し続けてきたが、...

『実践TypeScript』の著者・吉井健文が考えるTypeScriptの魅力と可能性

世の中にはさまざまなプログラミング言語が存在します。そして、人によってはただならぬ愛着を持つ人も。そこで本企画では、このプログラミング言語にフォーカス。お気に入りのプログラミング言語のことをマニ...

ヤフーが実践するギグワーク活用がこれからの新しい採用手法に!?リモート環境で求められる人材とはーこれからの「強い組織の作り方」CEOセッションー

新型コロナウイルスで、働き方改革やデジタル・トランスフォーメーションの流れが急激に加速し、採用・育成・マネジメントの状況は大きく変化しています。 株式会社overflow、株式会社zenkig...

お金

採用・組織

グルメ