- ブログ
サムネイルの作り方5ステップ｜クリックされる5原則とサイズ早見表【初心者向け】
「動画は投稿できたのに、サムネイルだけ手が止まる」
「作ってみたけれど、どこか素人っぽい」
このような悩みを抱えていませんか。
サムネイルが素人っぽく見える主な原因は、センスよりも小さく表示される前提で設計できていないことにあり、原則を押さえれば改善できます。
本記事では、Webデザインスクールを運営するCampusが、サムネイルのサイズと仕様から作り方の5ステップ、クリックされる5原則、クリック率とA/Bテストを使った改善方法までを解説します。
また、デザインの原則から体系的に学びたい方に向けて、Campusでは無料の動画講座をご用意しているので、あわせてご活用ください。
※本記事の仕様・機能に関する記述は2026年10月時点の情報です。YouTubeは仕様の更新があるため、最新情報は公式ヘルプでご確認ください。
サムネイルを作る前に押さえたい役割とサイズ・仕様
ここでは、サムネイルを作り始める前に押さえておきたい役割と、YouTubeやSNSのサイズ・仕様について解説します。
仕様を知らないまま作ると、せっかく作ったサムネイルをアップロードできないこともあるため、先に確認しておきましょう。
サムネイルの役割は「クリックされること」
サムネイルとは、動画や記事の内容を1枚の画像で示す見出し画像のことです。
その役割は、一覧の中で目に留まり、クリックしてもらうことにあります。
どれだけ中身の良い動画でも、サムネイルで素通りされれば視聴者に届きません。
逆にいえば、サムネイルを整えることで、届く人を増やせる可能性があります。
そのため、サムネイルは「上手いか下手か」ではなく、「クリックされたか」で評価するのが基本です。
クリックされたかどうかを数字で確認する方法は、後半で解説します。
YouTubeサムネイルのサイズと仕様
YouTubeヘルプでは、カスタムサムネイルの推奨仕様が次のように示されています。
| 項目 | 内容 |
|---|---|
| 推奨解像度 | 3,840×2,160ピクセル（最小幅640ピクセル） |
| アスペクト比 | できるだけ16:9 |
| ファイル形式 | JPG、PNGなど |
| 容量の上限 | パソコンからのアップロードは50MB／モバイルからは2MB |
| ショート動画 | 9:16（推奨解像度2,160×3,840ピクセル） |
（出典：YouTubeヘルプ「YouTube でカスタム サムネイルを追加する」。2026年10月時点）
なお、「サムネイルは2MB以下」という情報も見かけますが、現在の公式ヘルプでは、アップロードに使う端末によって容量の上限が異なり、パソコンからであれば50MBまでアップロードできます。
ファイル形式は、写真が多いデザインならJPG、文字とイラスト中心ならPNGを選ぶとよいでしょう。
実務では、1,280×720ピクセル以上で作っておくと安心です。
後半で解説するA/Bテストでは、720p（1,280×720）未満のサムネイルがあるとテストに使うサムネイルがすべて480pへ縮小されるため、この寸法を下限の目安にするとよいでしょう。
カスタムサムネイルを使うにはアカウント確認が必要
自分で作ったサムネイルをアップロードするには、YouTubeアカウントの確認が済んでいる必要があります。
未確認の場合は、動画から自動生成された候補しか選べません。
「サムネイルをアップロードするボタンが出てこない」という場合は、まずアカウントの確認状況を見てください。
あわせて知っておきたい仕様が3つあります。
- 1日にアップロードできるカスタムサムネイルの数には上限がある（国や地域、チャンネルの履歴によって異なる）
- ショート動画のカスタムサムネイルは、パソコン版のYouTube Studioからのみ追加できる（推奨アスペクト比は9:16）
- 縦向き動画に16:9のサムネイルを設定した場合、ホームや探索などの一部の画面では自動生成された4:5の画像に置き換わる
スマホからはショート動画のカスタムサムネイルを追加できないため、オリジナルの画像を使いたい場合は、パソコンのYouTube Studioから設定しましょう。
SNS・ブログのサムネイルサイズの目安
サムネイルの表示比率は、媒体によって異なります。
目安は次のとおりです。
| 媒体 | 比率の目安 |
|---|---|
| YouTube（長尺） | 16:9 |
| YouTube ショート | 9:16 |
| Instagram フィード | 1:1 または 4:5（4:5が主流） |
| X（旧Twitter） | 16:9 |
| ブログのアイキャッチ・OG画像 | およそ1.91:1（1200×630ピクセルが一般的） |
各媒体の仕様は変更されることがあるため、最新の数値はそれぞれの公式ヘルプでご確認ください。
特にInstagramは、プロフィール一覧（グリッド）の表示比率が変更されています。
フィード用に4:5で作っても、一覧では上下が切られて見える場合があります。
また、媒体ごとに表示のトリミング範囲が違う点にも注意が必要です。
16:9で作った画像をInstagramに流用すると、上下が切られて文字が読めなくなることがあります。
複数媒体で使う場合は、中央に情報を寄せておくと崩れにくくなります。
サムネイルの作り方5ステップ
ここでは、スマホでもPCでも共通するサムネイルの作り方を、5つのステップに分けて解説します。
Step1｜伝えたい要素を1つに絞る
最初にやるのはデザインではなく、「この動画の何を伝えるか」を1つに決めることです。
決めるときは、次の3つをそれぞれ一言で書き出してみてください。
- 誰に見てほしいのか
- 何が得られる動画なのか
- 見た人にどう思ってほしいのか
ここが曖昧なまま作り始めると、あれもこれもと情報を詰め込みたくなり、一覧の中で読まれにくいサムネイルになってしまいます。
Step2｜素材（写真・動画のキャプチャ）を用意する
次に、背景になる画像を用意します。
素材の選択肢は、主に次の3つです。
- 動画から静止画を切り出す：内容と一致するため信頼感が高い
- 自分で撮影した写真を使う：人物の表情は目を引きやすい
- フリー素材を使う：手軽だが、他の動画と似た印象になりやすい
フリー素材を使う場合は、事前に利用規約を確認しておきましょう。
「無料」と書かれていても、商用利用の条件が設定されていることがあります。
また、他人の写真やキャラクター、他チャンネルの画面を無断で使うと、著作権や肖像権の侵害になるおそれがあります。
自分に使用権のある素材だけを使ってください。
Step3｜文字を入れる（短く、大きく）
サムネイルの文字は、動画タイトルの繰り返しではありません。
タイトルで書けなかった「一番の引き」を置く場所です。
文字を入れるときは、次の3点を意識しましょう。
- 文字数は少なく：一覧では数センチの大きさで表示される
- 改行位置を意味の区切りに合わせる：単語の途中で折り返さない
- 書体は太めを選ぶ：細い書体は縮小すると消える
Step4｜スマホの実寸で読めるか確認する
ここが最も飛ばされやすく、最も効く工程です。
パソコンの大画面で作業していると、文字は問題なく読めてしまいます。
しかし、スマホで視聴する人は、一覧画面で数センチほどの大きさのサムネイルを見ています。
確認は、次の手順で行います。
- 作ったサムネイルをスマホに送る
- 画像を縮小表示する（または少し離して見る）
- 文字が読めるか、主役が何か一瞬でわかるかを確認する
読めない場合は、文字を減らすか大きくしましょう。
この確認を1回入れるだけでも、仕上がりは変わります。
Step5｜書き出してYouTubeに設定する
最後に、画像を書き出してYouTubeに設定します。
パソコンから設定する手順は、次のとおりです。
- YouTube Studioにログインする
- 左メニューの「コンテンツ」を選ぶ
- 対象の動画をクリックする
- 「サムネイル」の下にある「ファイルをアップロード」から画像を選ぶ
- 「保存」をクリックする
サムネイルは公開後でも変更できますが、反映までに時間がかかることがあるため、変わらない場合は少し待ってみてください。
スマホだけでサムネイルを作る手順
パソコンがなくても、サムネイルは無料アプリで作れます。
ここでは、スマホで使えるツールの選び方とCanvaアプリでの手順、スマホ制作の限界について解説します。
スマホで使える無料ツール
スマホで作る場合は、次の3つを基準にツールを選びましょう。
- 書き出しサイズを指定できるか（16:9で出せるか）
- 日本語の太いフォントが使えるか
- 文字の縁取りや影をつけられるか
この3つを満たしていれば、無料ツールでも十分に作れます。
一方、比率を指定できないアプリでは、表示時に上下が切れてしまうおそれがあるため避けたほうがよいでしょう。
Canvaアプリでサムネイルを作る手順
無料で使える代表的なツールがCanvaです。
Canvaアプリでサムネイルを作る流れは、次のとおりです。
- 「YouTube サムネイル」のテンプレートを検索する（16:9で作成される）
- 装飾が少なく、余白が広いテンプレートを選ぶ
- 文字と背景画像を差し替える
- 使わない要素を削る
- PNGまたはJPGで書き出す
スマホ制作の限界とパソコンに切り替えるタイミング
スマホで快適に作業できるのは、テンプレートを差し替える程度の作業までです。
次のような作業になると、パソコンが有利になります。
- 人物や商品をきれいに切り抜く
- 文字の位置を1ピクセル単位で調整する
- 同じデザインを複数サイズに展開する
- 過去のサムネイルをまとめて管理する
自分のチャンネル用であれば、スマホだけでも十分に対応できます。
一方、継続的に、あるいは仕事として作るのであれば、パソコンでの制作環境を整えておくとよいでしょう。
クリックされるサムネイルの5原則
手順を覚えても、仕上がりが「なんとなく素人っぽい」と感じることがあります。
ここでは、サムネイルの見え方を整えるために押さえておきたい5つの原則を解説します。
原則1｜文字は少なく、大きく
サムネイルの文字は、じっくり読ませるものではなく、一瞬で目に入るものです。
長い説明は動画タイトルに任せ、サムネイルには引きの強い一言だけを置きましょう。
どの言葉を削るか迷ったときは、「これがなくても伝わるか」を基準に判断すると、文字を絞り込みやすくなります。
原則2｜文字の可読性を確保する
背景写真の上に文字を置くと、読みにくくなることがあります。
写真には明るい部分と暗い部分が混ざっているためです。
対処法は3つあります。
- 文字に縁取りをつける：手軽に取り入れやすい
- 半透明の帯を敷く：文字量が多いときに有効
- 背景写真を暗く（明るく）する：全体の統一感を保てる
大切なのは、背景と文字の明るさの差をはっきりつけることです。
たとえば、薄いグレーの背景に白い文字を置くと、縮小したときに文字が背景に溶け込んで読めなくなります。
原則3｜主役を1つに決める
主役を引き立てるうえで意識したいのが、ジャンプ率です。
ジャンプ率とは、要素どうしの大きさの差のことです。
文字・人物・商品のすべてを同じ大きさで並べると、視線の行き先が決まりません。
その結果、何の動画なのかが伝わりにくくなります。
主役を1つ決めて思い切って大きくし、ほかの要素は小さく抑えましょう。
この大きさの差が、視線を主役へ誘導します。
原則4｜色は3色までに絞り、チャンネルで統一する
色数が多いほど目立つわけではなく、むしろ色を増やすほど印象は散らばります。
ベース、メイン、アクセントの3色構成が基本です。
そのうえで、チャンネル全体で色のトーンをそろえておくと、統一感が生まれます。
同じ配色を使い続けることで、一覧の中で「あのチャンネルだ」と気づいてもらいやすくなるでしょう。
原則5｜検索結果や関連動画の一覧で見比べる
視聴者は、サムネイルを他の動画と並んだ状態で見ています。
そのため、サムネイルの良し悪しは単体ではなく、一覧の中で比べて判断することが大切です。
確認するときは、自分の動画が表示されそうなキーワードで検索し、並んでいるサムネイルの中に自作を置いてみてください。
そこで埋もれてしまう場合は、明るさや文字の太さ、色などで周囲と差をつける工夫が必要です。
サムネイルをクリック率とA/Bテストで改善する方法
サムネイルは、感覚だけで悩むものではなく、数字を見ながら改善できるものです。
ここでは、クリック率の確認方法と見方、公式のA/Bテスト機能の使い方、誇張してはいけない理由を解説します。
YouTube Studioでクリック率を確認する
まずは、YouTube Studioのアナリティクスで現状を把握しましょう。
「リーチ」タブを選ぶと、インプレッション数とインプレッションのクリック率を確認できます。
インプレッションは「サムネイルが表示された回数」、クリック率は「表示のうちクリックされた割合」です。
クリック率の見方と注意点
クリック率については、「○%が目安」といった一般的な数字を基準にしても、あまり参考になりません。
クリック率は、表示された場所や視聴者層、公開からの日数によって大きく変動するためです。
クリック率は、自分の過去の動画と比べて見るのが基本です。
同じチャンネルの似たテーマの動画同士で比べると、サムネイルによる違いが見えやすくなります。
公式のA/Bテスト機能でサムネイルを比較する
YouTubeには、サムネイルを比較できる公式のA/Bテスト機能があります。
概要は次のとおりです（2026年10月時点）。
| 項目 | 内容 |
|---|---|
| テストできる数 | 最大3案 |
| 利用環境 | パソコンのYouTube Studioのみ |
| 条件 | 上級者向け機能を有効にしている必要がある |
| 対象外 | ショート動画、予定されたライブ配信、プレミア公開動画など |
| 期間 | 数日〜2週間以内で完了 |
テストの手順は、次のとおりです。
- YouTube Studioにログインする
- テストする動画を選ぶ
- サムネイルの欄で「A/Bテスト」を選ぶ
- 「サムネイルのみ」などのテスト対象を選ぶ
- 最大3案をアップロードして完了する
（出典：YouTubeヘルプ「タイトルとサムネイルの A/B テスト」）
A/Bテストを使うときは、次の3点を意識しましょう。
- 似すぎた案を並べない：差が小さいと結果が出ない
- 古い動画から試す：チャンネル全体への影響を抑えられる
- テスト中にサムネイルを変更しない：変更するとテストは自動的に停止する
テスト結果は「ベスト」「ほぼ同じ」「有意な結果なし」の3種類で表示されますが、明確な差が出ないことも珍しくありません。
クリック率を上げるために誇張してはいけない理由
内容と関係のない過激な文字や画像を置けば、一時的にクリック率は上がるかもしれません。
しかし、それが成果につながるとは限りません。
YouTubeのA/Bテストでは、クリック率ではなく総再生時間をもとに結果を判定すると、公式ヘルプで説明されています。
視聴者が興味のない動画を誤ってクリックしないほうが、時間を有効に使えるという考え方です。
クリックさせるだけのサムネイルは、評価されません。クリックした人が最後まで見たくなるような、中身と一致したサムネイルこそが評価されます。
さらに、サムネイルにはポリシー上の制約もあります。
すべてのカスタムサムネイルは、コミュニティガイドラインに準拠する必要があります。
性的に挑発的な内容、ヘイトスピーチ、暴力、有害または危険な内容が含まれると、拒否や違反警告の対象になります。
違反を繰り返すと、カスタムサムネイルの使用が30日間停止される場合もあります。
目立たせる工夫と内容を偽ることは別物なので、混同しないよう注意しましょう。
サムネイル制作は副業になる？受注の入口と学ぶべきツール
サムネイルを作れるようになると、「自分でも受注できるのでは」と考える方もいるでしょう。
ここでは、サムネイル制作の需要と、無料ツールで足りる場合・専用ツールが必要になる場合の線引きについて解説します。
サムネイル制作の需要と、案件の入口
サムネイル制作は、副業の入口になりやすい仕事です。
その理由として、次の3つが挙げられます。
- 動画を投稿し続ける人には、毎回必要になる（継続案件になりやすい）
- 制作範囲が小さく、納期の管理がしやすい
- 成果物をポートフォリオに載せやすい
1点あたりの単価はそれほど高くありませんが、継続して受注できれば収入が安定しやすく、バナー制作やSNS投稿画像など隣接する仕事に広がることもあります。
「小さく始めて実績を積む」という点で、取り組みやすい仕事といえるでしょう。
無料ツールで足りる場合と、専用ツールが必要になる場合
無料ツールと専用ツールの使い分けは、用途によって次のように整理できます。
| 用途 | 無料ツール | 専用ツール（Photoshopなど） |
|---|---|---|
| 自分のチャンネル用 | 十分 | 不要 |
| 月に数点の受注 | 対応可能 | あると有利 |
| 継続的な受注・複数クライアント | 手間が増える | 有利 |
| 人物や商品の精密な切り抜き | 難しい | 必要 |
| クライアントの指定形式での納品 | 制限がある | 対応しやすい |
自分のチャンネル用や月に数点の受注であれば、無料ツールでも十分に対応できます。
一方で、受ける仕事の幅や単価を広げたい場合は、専用ツールも使えるようにしておくとよいでしょう。
学習の順番を含めて整理したい方は、Webデザインの独学は難しい？学習ロードマップとポイントもあわせてご覧ください。
学ぶ環境をどう選ぶか
Campusでは、Photoshop・Illustrator・Figma・Canvaといったデザインツールに加え、Premiere ProやAfter Effectsを使った動画編集も学べます。
見積もりや契約といったフリーランス実務も学べるほか、スクールプラン以上では講師への質問や課題・ポートフォリオの添削も利用できます。
受講生の中には、育児と両立しながら3ヶ月学び、バナーやLP制作で月15万円の副業収入を得た方（34歳・主婦）や、会社員を続けながら4ヶ月学び、副業で月10万円の収入を得た方（28歳）もいます。
なお、これらは個人の成果であり、全員が同様の成果を得られるものではありません。
Campusの受講継続率は95.8%です。
受講生の約7割は働きながら、または育児と両立しながら学んでおり、卒業期限がないため忙しい時期も自分のペースで進められます。
副業に向けたスクールの選び方は、副業におすすめのWebデザインスクール5選で詳しく解説しています。
＼AI×デザインを実務レベルで学ぶなら／
【Campus（キャンパス）】は月額5,500円で学び放題のWebデザインスクール
Webデザイン・動画編集に加えて、AIをWeb制作に活かす「AI×Web制作」のカリキュラム（スキル伴走プラン以上）も学べます。
卒業や受講期限がなく、現役フリーランス講師のサポートを受けながら自分のペースで続けられます。
サムネイルの作り方に関するよくある質問
Q. サムネイルはどうやって作るの？
サムネイルは、無料のデザインツールで16:9のサイズを指定して作れます。
背景画像を選び、短い文字を大きく置くだけでも形になります。
詳しくは、作り方5ステップをご覧ください。
Q. 無料でサムネイルを作れるサイトやアプリはありますか？
Canvaなど、無料でサムネイルを作れるアプリはあります。
選ぶときは「16:9で書き出せる」「太い日本語フォントがある」「文字に縁取りをつけられる」の3点を基準にするとよいでしょう。
Q. サムネイルを作るコツは何ですか？
サムネイルを作るコツは、文字を少なく大きくし、可読性を確保したうえで、主役を1つに絞ることです。
詳しくは、クリックされる5原則で解説しています。
Q. YouTubeのサムネイルは後から変更できますか？
YouTubeのサムネイルは、公開後でもYouTube Studioから変更できます。
ただし、ショート動画のカスタムサムネイルは、パソコン版のYouTube Studioからのみ追加できます（2026年10月時点）。
Q. サムネイルのサイズは何ピクセルですか？
YouTubeのサムネイルは、公式では解像度3,840×2,160ピクセル（最小幅640ピクセル）、アスペクト比16:9が推奨されています。
実務では、1,280×720ピクセル以上を目安にするとよいでしょう。
Q. サムネイル制作だけで副業はできますか？
サムネイル制作を継続案件として受注している方はいます。
ただし、1点あたりの単価は高くないため、バナーやSNS画像など隣接する制作物にも広げるのが現実的です。
まとめ
サムネイルづくりで大切なのは、センスよりも、伝える内容を絞ること、小さく表示されても読ませること、そして数字を見て直すことです。
まずは16:9のサイズで1枚作り、スマホの実寸で読めるかを確認してみてください。
公開後はクリック率を自分の過去の動画と比べ、必要に応じてA/Bテストで改善していきましょう。
A/Bテストはクリック率ではなく総再生時間で判定されるため、中身と一致したサムネイルを作ることが改善への近道です。
さらに、ここで身につく原則は、サムネイルだけのものではありません。
文字の可読性、ジャンプ率、配色の絞り込みは、バナーでもLPでも名刺でも同じように働きます。サムネイルづくりは、デザイン全体を学ぶ入口にもなるでしょう。
Campusは、PhotoshopやIllustrator、Figmaなどのデザインツールから、フリーランスとして働くための実務までを学べるオンラインスクールです。
選べる4つのプラン（すべて卒業期限なし）
本スクールは、ご自身の目的や予算に合わせて選べる4つのプランをご用意しています。
- 入会金0円プラン：月額5,500円（税込）のみで、手軽に始めたい方向け
- スタンダードプラン（3種）：月額5,500円（税込）＋ 選べる入会金（19.8万円 / 29.8万円 / 39.8万円）
どのプランを選んでも卒業期限はなく、ご自身のペースでじっくり学べます。
※最新の料金体系や各プランのサポート内容の違いは、必ず公式サイトでご確認ください。
まずは無料の動画講座で、講座の内容や講師の雰囲気を確かめてみてください。
申し込み後も8日間の全額返金保証（ライトプランを除く）があるので、お気軽にご相談ください。
LINE限定の特別セミナーやお役立ち情報などを配信中です。
下記より追加してみてくださいね。
投稿者プロフィール
-
未経験からWebスキルを学び半年で月収100万円達成、その後スクールを一から立ち上げ２年で500人が受講。メディア実績・美人百花へ掲載
・NewSweeksへ掲載
・トリンドル玲奈さんとテレビで対談
・日経電子版「私のみちしるべ」へ掲載
・アンタッチャブルさん・アルコ＆ピースさんの番組で放映
最新の投稿
ブログ2026年11月5日Photoshopの使い方｜初心者が最初に覚える7つの操作と習得までの道筋
ブログ2026年11月5日Canva（キャンバ）の使い方を初心者向けに解説｜無料の範囲とやってはいけない7つのこと
ブログ2026年11月5日名刺デザインでやってはいけない7つのNG｜おしゃれに見せる5原則と作り方
ブログ2026年11月5日バナー作成の手順5ステップ｜サイズ早見表とレイアウト4つの型【初心者向け】
