ココナラの出品サービス画像は、横1220px×縦1240pxが推奨サイズです。ただし一覧表示では上下がトリミングされるため、重要情報を中央に配置する安全エリアの確保が欠かせません。この記事では画像サイズの基本から用途別仕様、Canvaでの作成手順まで解説します。
▶ 3日で初案件PR
この記事でわかること
画像サイズを1220×1240pxに設定するだけでは不十分な理由、安全エリアを確保して見切れをゼロにする具体的な方法、Canvaで5分以内にプロ品質の出品画像を作る手順の3点をまとめました。
今の仕事について、一番近いものは？
この記事の結論
ココナラ出品画像の推奨サイズは1220×1240pxですが、一覧表示では上下がトリミングされ、表示領域は約1220×1009pxになります。サービス名・価格・顔写真などの重要情報は、画像の上下10〜15%を避けた中央エリアに収めてください。サイズを合わせるだけでなく、安全エリアを意識したレイアウトを実践することが、クリック率を高める最短ルートです。
今日やるべき1つ
Canvaを開き、カスタムサイズで横1220px×縦1240pxのキャンバスを作成し、上下から124px（縦の10%）の位置にガイドラインを引いて安全エリアを確認してください（所要時間：5分）。
状況別ショートカット
| 状況 | 読むべきセクション | 所要時間 |
| まずサイズの数字だけ知りたい | ココナラ出品画像は1220×1240pxが基本 | 2分 |
| Canvaでの作成手順を知りたい | Canvaで出品画像を5ステップで作成 | 5分 |
| 見切れ・トリミングを防ぎたい | 出品画像の見切れは安全エリアで防止 | 3分 |
| プロフィールやブログ等の用途別サイズを知りたい | ココナラ画像サイズは用途別に4種類 | 3分 |
| クリック率を上げたい | ココナラ出品画像は5つの仕組みでクリック率向上 | 7分 |
ココナラ出品画像は1220×1240pxが基本
出品サービス画像の推奨サイズは横1220×縦1240px
ココナラの出品サービス画像として広く使われている推奨サイズは、横1220px×縦1240pxです。この比率はほぼ正方形に近い縦長で、サービス一覧ページでの表示を想定して設計されています。このサイズを基準に画像を作成すれば、PCとスマートフォン問わず表示崩れが起きにくい状態で出品できます（ココナラ利用者による画像サイズ一覧）。
1220×1016pxとの違いは表示領域の計算方法
「1220×1016px」という数字を見かけた方もいるはずです。この数値は、6:5という横縦比率を基本とした場合に導き出されるサイズです。1220×1240pxで作成した場合でも、一覧表示では上下がトリミングされ、実質的な表示領域が1220×1009px前後になるとされています（ココナラ出品画像の構成と余白に関する解説）。つまり「1220×1016px」は一覧表示後の実際の見え方を基準にした数値です。作成時は1220×1240pxを使い、レイアウト設計は1220×1016px相当の表示領域を意識するという使い分けが実務的なアプローチです。
ファイル形式はJPGとPNGの2択で選ぶ
対応ファイル形式はJPG、PNG、GIFです。写真素材や背景色がある画像にはJPGが適しており、ファイルサイズを抑えやすい点が利点です。透過処理が必要な場合や、ロゴとテキストの輪郭をくっきり見せたい場合はPNGが向いています。デザインツールで作成したテキスト多めの画像はPNGで書き出す方が文字の滲みが出にくく、読みやすい仕上がりになります。ファイル容量の上限は100MBとされていますが、アップロード速度と表示品質のバランスを考えると、1〜3MB程度に収めるのが現実的です。画像圧縮で画質を落とさずファイルを軽量化する方法も参考にしてください。
CHECK
▶ 今すぐやること: 現在の出品画像のサイズをPC上で確認し、1220×1240pxと一致しているかチェックする（2分）
Q: 出品画像は何枚まで登録できますか？
A： はい、メイン画像1枚＋サブ画像最大14枚の合計最大15枚まで登録できるとされています。最新の枚数制限はサービス出品画面で確認してください。
Q： GIFは動く画像としてアップロードできますか？
A： 対応形式にGIFが含まれますが、アニメーションGIFが一覧表示で再生されるかはカテゴリや表示設定によって異なります。静止画として表示される場合を想定した上で利用してください。
Canvaで出品画像を5ステップで作成
Canvaでのカスタムサイズ設定は3ステップで完了
Canvaでのキャンバス作成はシンプルです。トップページ右上の「デザインを作成」をクリックし、「カスタムサイズ」を選択します。次に幅を「1220」、高さを「1240」、単位を「px」に設定して「新しいデザインを作成」を押せばキャンバスが開きます。単位の確認が最重要です。cmやmmのまま数字を入力すると全く異なるサイズになるため、かならずpxに切り替えてから数値を入力してください。Canva初心者の使い方と5ステップで最初のデザインを完成させる方法も参考にするとスムーズです。
安全エリアはガイドラインで視覚化する
Canvaにはガイドライン機能があり、「ファイル」→「設定」→「ガイドを追加」から水平線を引けます。縦1240pxに対して上から124px（10%）と下から124px（同様に10%）の位置にガイドを追加することで、安全エリアが視覚的に確認できます。この2本のガイドラインの内側に全ての重要情報を収めることで、トリミングによる見切れリスクをほぼゼロにできます（ココナラ出品画像のデザイン・見切れ対策解説）。
書き出し設定はPNG・高品質で統一する
デザインが完成したら右上の「共有」→「ダウンロード」から書き出します。ファイル形式の選択で「PNG」を選び、「高品質」を有効にした状態でダウンロードしてください。写真を多用している場合はJPGでも問題ありませんが、品質設定を最大に近い状態にすることで、縮小表示時の画像劣化を防げます。ダウンロード後はファイルサイズを確認し、5MBを超えている場合はCanvaの「ファイル圧縮」オプションか、Squooshなどの無料ツールで圧縮してからアップロードしてください。
CHECK
▶ 今すぐやること: Canvaで1220×1240pxのキャンバスを新規作成し、上下10%の位置にガイドラインを2本追加する（5分）
Q: Canva以外のツールでも同じサイズで作れますか？
A： はい、PowerPoint・Keynote・Photoshopなどでもカスタムサイズ設定が可能です。単位をpixelに設定し、幅1220・高さ1240と入力するだけで同じキャンバスが作れます。
Q： スマートフォンのCanvaアプリでも作れますか？
A： アプリ版でも「カスタムサイズ」の入力は可能です。ただしガイドライン機能や細かいテキスト編集はPC版の方が操作しやすいため、最終的な仕上げはPCで行ってください。
出品画像の見切れは安全エリアで防止
上下10〜15%は重要情報を置かない
出品サービスの一覧ページでは、1220×1240pxで作成した画像の上下がトリミングされて表示されます。トリミングされる量は表示デバイスや画面幅によって変わりますが、上下それぞれ10〜15%（縦1240pxの場合は約124〜186px）を空白または装飾のみにしておくのが安全策です。この領域に価格・サービス名・顔写真が入ると、一覧表示で見えなくなるリスクがあります（ココナラ出品画像の構成と余白に関する解説）。余白を設けた画像の方が「伝わりやすく見える」という評価を受けやすい傾向があります。なお、画像トリミング無料サイトを使って事前に表示イメージを確認するのも効果的です。
画像の左右端も同様に余白を確保する
見切れの問題は上下だけではありません。スマートフォンでの縦向き表示時には、画面幅に応じて左右もトリミングされる場合があります。左右それぞれ5〜8%程度（横1220pxの場合は約60〜100px）を余白にすることで、重要情報がフレームアウトする可能性を下げられます。テキストや数字を画像の左右端ギリギリに配置するのは避けてください。
アップロード後はPCとスマートフォンの両方で確認する
画像をアップロードしたあとは、必ずPCとスマートフォンの両方でサービス一覧ページを確認してください。PCのブラウザと実際のアプリでは表示サイズが異なることがあります。スマートフォンのブラウザとアプリ版でも見え方が変わる場合があるため、ここで時間をかけて確認することで後からの修正作業を省けます。画像が更新されても表示が変わって見えない場合はキャッシュが残っている可能性があるため、シークレットモードや別端末で確認してください。
CHECK
▶ 今すぐやること: 出品中サービスのサムネイルをスマートフォンのアプリとPCブラウザの両方で開き、文字や重要情報が切れていないか目視確認する（3分）
Q: 文字が小さくて読みにくいと感じたらどうすればいいですか？
A： サムネイル上の文字は一覧表示では縮小されます。フォントサイズは50px以上（Canvaではpt換算で約37pt以上が目安）に設定し、太めのウェイトを使用することで視認性が上がります。
Q： 画像を更新したのに見た目が変わらない場合はどうすれば？
A： ブラウザのキャッシュが原因であることが多いです。「強制リロード（Ctrl+Shift+R またはCmd+Shift+R）」を試すか、プライベートブラウズで確認してください。
事務作業に時間を取られている方へ
フリーランスの働き方をLINEで受け取る
LINEで無料で届くもの
- 20本Webデザインの無料レッスン
- 全工程Photoshopの解説動画
- 4本限定のPDF・動画
登録1分・情報収集だけでもOK・セミナー参加は自由
タップするとLINEの友だち追加画面が開きます
LINE登録のよくある質問
- お金はかかりますか？
- LINEの登録と、届くレッスン・動画・PDFは無料です。
- どんな連絡が来ますか？
- レッスンや動画のほか、無料セミナーの案内が届きます。参加するかは自由です。
- やめたいときは？
- LINEでブロックすれば、それ以上は届きません。
PR提供: 日本デザインスクール（デザスク）
ココナラ画像サイズは用途別に4種類
プロフィールカバー画像は1280×420pxが基本
プロフィールページの上部に表示されるカバー画像の推奨サイズは横1280px×縦420pxです。実際の表示では画面幅に応じて左右が拡張される場合があり、中央部分が常に表示される設計です（ココナラ利用者による画像サイズ一覧）。プロフィールカバーに名前・ロゴ・専門分野などを入れる場合は、左右の余白を広めに取り、中央寄りに配置するとデバイス間での見え方のブレを最小化できます。
ポートフォリオ画像は1200×1200pxが標準
過去の制作実績を掲載するポートフォリオ画像は、横1200px×縦1200pxの正方形が標準サイズとして広く使われています。最大3600×3600pxまで対応するとされており、高解像度の作品を掲載する場合は大きめのサイズで登録しておくと、PCの大画面での閲覧時に品質が確保できます（ココナラ用途別の画像サイズと表示画角を整理した解説）。正方形フォーマットであるため、横長や縦長の作品を掲載する場合は余白を加えてトリミングなしで収まるように調整してください。
ブログ画像は630×354px以上の16:9が推奨
ブログ投稿のカバー画像は横630px×縦354px以上、比率は16:9が推奨されています。この比率はYouTubeのサムネイルや一般的なウェブ記事のヘッダー画像と同じ規格で、横長のワイドな見た目になります。出品サービス画像（縦長）と同じ比率で作ると上下が切れるため、ブログ画像専用のテンプレートをCanva内で別に保存しておくと作業効率が上がります。
コンテンツマーケットは用途ごとにサイズが異なる
ファイル販売や記事販売を行うコンテンツマーケットでは、出品サービス画像のサイズとは異なる設定が必要です。ファイル販売のサムネイルは620×620px、記事販売のカバー画像は1280×670pxとされています（ココナラコンテンツマーケットの画像サイズ解説）。「出品サービス」と「コンテンツマーケット」を混同したまま1220×1240pxで作成した画像を流用すると、余白や比率のズレが生じます。
CHECK
▶ 今すぐやること: 自分が利用している、または利用予定のすべての機能を洗い出し、それぞれの推奨サイズをメモに整理する（5分）
Q: すべての用途で同じ1220×1240pxを使ってもいいですか？
A： いいえ。プロフィールカバーやブログカバーは比率が大きく異なるため、流用すると重要部分が切れたり、余白が不自然に広くなったりします。用途ごとに専用サイズで作成してください。
Q： ポートフォリオに横長の作品を登録したいのですが、どうすれば？
A： 1200×1200pxの正方形キャンバスに横長の作品画像を中央配置し、上下に余白色（白や黒）を加えてからPNG書き出しするのが現実的です。作品の縦横比は崩れず、正方形フォーマットに収まります。
ココナラ出品画像は5つの仕組みでクリック率向上
ハック1: 訴求文を3語以内に凝縮してクリック率を改善
【対象】: サービス画像に文章をそのまま入れていて読まれていないと感じている出品者
【手順】: まず現在の画像に使っているテキストを書き出します（1分）。次に「誰の」「何を」「どうする」の3要素を各1語に圧縮し、合計3語以内の短い訴求フレーズを作ります（5分）。最後にCanvaのテキストボックスを短い訴求文に差し替え、フォントサイズを元より1.5倍以上に拡大してから書き出します（5分）。
【ポイント】: 一覧表示では数十のサービスが並ぶため、読者が1枚の画像を見る時間は非常に短いです。その瞬間に「自分のことだ」と感じさせるには、主語をはっきりさせた3語以内の訴求文が機能します。文字数が多いほど読まれない可能性が上がるため、削ることを優先してください。
【注意点】: テキストを増やして情報量を補おうとする必要はありません。
ハック2: 背景色と文字色のコントラスト比を4.5:1以上に設定
【対象】: 画像の文字が読みにくい、または他のサービスと見分けがつかないと感じている出品者
【手順】: Canvaで現在の画像を開き、文字色と背景色の組み合わせを確認します（1分）。次にブラウザでContrast Checkerを開き、背景色と文字色の16進数カラーコードを入力してコントラスト比を確認します（2分）。コントラスト比が4.5:1未満の場合は、文字色を白（#FFFFFF）か黒（#000000）に近い方向に調整し、再チェックします（3分）。
【ポイント】: コントラスト比4.5:1以上はWebアクセシビリティの国際規格であるWCAG 2.1のAA基準に相当し、モバイル画面での視認性確保に直結します。ブランドカラーが淡い水色や薄いベージュの場合、白背景と組み合わせると一覧表示でほぼ読めなくなります。背景をシンプルな単色・グラデーションにして文字を白抜きにするだけで、コントラスト比を確保しやすくなります。また、見やすい配色の基本ルールも参考にしてください。
【注意点】: 全面を高彩度の原色で塗りつぶす必要はありません。
ハック3: メイン画像に入れる情報を「サービス内容・対象者・メリット」の3点に限定
【対象】: 画像に情報を詰め込みすぎて、結局何のサービスか分かりにくくなっている出品者
【手順】: 現在のメイン画像に含まれている要素を書き出し、「サービス内容（何ができるか）」「対象者（誰向けか）」「メリット（どう変わるか）」の3項目に該当しない要素を削除リストに入れます（3分）。次にCanvaで削除リストの要素を非表示にし、残った3点の情報を安全エリア内に再レイアウトします（5分）。書き出して一覧表示のサムネイルサイズ（200px前後に縮小）でどう見えるか確認します（2分）。
【ポイント】: 「サービス概要はタイトルと説明文で補う」方針を取ることで、画像が担う役割を「興味を引く」1点に絞れます。サブ画像に実績や納品物の詳細を掲載する設計にすれば、メイン画像をシンプルに保ちながら全体の情報量は維持できます。
【注意点】: 価格をメイン画像から外す必要はありません。価格を入れる場合は安全エリア内の中央寄りに、他の要素と明確に区別できる大きさで配置してください。
ハック4: サブ画像で実績・納品物・手順を補完し全15枚を戦略的に構成
【対象】: メイン画像だけを登録していて、サービス詳細の伝達をテキスト説明文に依存している出品者
【手順】: 登録可能な最大枚数を確認し、使っていない枠の数を把握します（1分）。次に「制作実績（ビフォーアフター）」「納品物のサンプル」「依頼から納品までの流れ」「よくある質問の視覚化」「購入者の声（テキスト引用）」の5カテゴリをサブ画像として1枚ずつ作成します（30〜60分）。最後に登録順を「メイン→実績→納品物→フロー→FAQ→声」の順に設定します（5分）。
【ポイント】: 納品物のサンプルや依頼フローを画像で見せることで、テキストを読まない層にも内容が伝わります。サブ画像は購入の不安を取り除く上で効果的な場所です。
【注意点】: 制作実績がない段階で架空のサンプルを「実績」として掲載する必要はありません。「制作例」「イメージサンプル」と明示した上でサンプル画像を掲載してください。
ハック5: 競合上位3サービスの画像を分析して配色・構成・訴求軸の差分を特定
【対象】: 自分の画像が競合と似た見た目になっており、一覧の中で目立てていないと感じている出品者
【手順】: 自分のサービスと同じカテゴリ・価格帯のサービスを検索し、上位表示3〜5件の画像をスクリーンショットで保存します（5分）。次にスプレッドシートを開き、「背景色」「メインカラー」「フォントの太さ」「訴求文のパターン（課題型/成果型/ターゲット型）」の4軸で各サービスを比較します（10分）。競合の大多数が使っている色・構成と「真逆」の組み合わせを1つ試作します（15分）。
【ポイント】: 競合が揃って同じ色・フォントを使っているカテゴリでは、シンプルな白背景が逆に目立つケースも見られます。差別化は「より派手にする」のではなく「周囲と違う軸を選ぶ」方向が効果的な場合があります。配色の組み合わせパターンを参考にすると、差別化しやすい色選びのヒントが得られます。
【注意点】: 分析の目的は「自分の差別化軸を見つける」ことです。競合の画像をコピーする必要はなく、パターンを把握した上で意図的に外す要素を選んでください。
CHECK
▶ 今すぐやること: 自分のサービスと同カテゴリの上位3件の画像を見て、背景色・訴求文の型・主要カラーを書き出す（10分）
Q: 画像を作り直しても順位や閲覧数に変化が出るまでどのくらいかかりますか？
A： 画像更新後のアルゴリズムへの反映には数日から1〜2週間程度かかるとされています。更新後2週間のクリック率と更新前2週間を比較するのが適切な評価方法です。
Q： 訴求文を変えてみたいが、どれが効果的か分からない場合はどうすればいいですか？
A： 訴求文のパターンを変えた画像を2〜4週間ごとに差し替えて、期間ごとのクリック率・閲覧数・購入数を記録するA/Bテストが有効です。数値を記録し、改善サイクルを回してください。
ここで自己診断：あなたの出品画像の状態を3分で確認
Q1: 出品画像のサイズは1220×1240pxに設定されていますか？
Yesの場合はQ2へ進んでください。Noの場合は、まずサイズを修正してください。Canvaでカスタムサイズ1220×1240pxで作り直すことが先決です。
Q2: 重要な情報（サービス名・価格・顔）は画像の上下10%を避けた中央に配置されていますか？
Yesの場合はQ3へ進んでください。Noの場合は、安全エリアの設定が必要です。上下10%にガイドラインを引いて中央配置に修正してください。
Q3: メイン画像のテキストは3語以内の短い訴求文になっていますか？
Yesの場合はResult Aです。Noの場合はResult Bです。
Result A: サイズ・レイアウト・テキストの基礎が整っています
次のステップはコントラスト比の確認（Contrast Checkerで4.5:1以上か確認）とサブ画像の充実化です。競合分析と画像のA/Bテストに進んでください。
Result B: テキストの整理がクリック率改善の最優先課題です
現在の画像をCanvaで開き、テキストを「サービス内容・対象者・メリット」の3点のみに絞り込んでから書き出し直してください。所要時間は約15〜20分です。
CHECK
▶ 今すぐやること: 上記Q1から順番に答え、どのResultに該当するかを確認する（3分）
Q: 複数のサービスを出品している場合、すべての画像をチェックすべきですか？
A： 閲覧数や問い合わせが少ないサービスから優先的に確認することをおすすめします。販売実績が高いサービスの画像は変更リスクも伴うため、慎重に判断してください。
Q： 診断でResult Aになったが、それ以上改善する余地はありますか？
A： あります。コントラスト比・サブ画像の充実・競合との差別化・訴求文のA/Bテストの4つが次の改善ステップです。Result Aはスタートラインであり、終点ではありません。
ここを整えれば見切れゼロ：ココナラ出品画像まとめ
ここまで解説した設定のうち、最初に着手すべき順で整理しました。
| 状況 | 次の一歩 | 所要時間 |
| まだ画像を作っていない | Canvaで1220×1240pxのキャンバスを新規作成 | 5分 |
| 画像のサイズが合っていない | カスタムサイズで作り直し | 15〜20分 |
| 文字が切れている | 安全エリアを確認してレイアウト修正 | 10〜15分 |
| クリック率を上げたい | 競合3件を分析して差別化軸を特定 | 20〜30分 |
| 情報を整理したい | サブ画像5カテゴリを作成 | 30〜60分 |
サイズの数字を覚えるだけでなく、なぜトリミングが発生するのかを理解してレイアウトを設計することが、クリック率改善の本質です。Canvaでキャンバスを作成し、ガイドラインを引き、3語以内の訴求文を中央に配置するという一連の作業は、今日中に完了できます。まず1サービス分の画像を作り直し、2週間後のクリック率の変化を記録することから始めてください。また、画像とあわせてフリーアイコンの商用利用安全サイトを活用すれば、デザインの質をさらに高められます。
ココナラ出品画像サイズに関するよくある質問
Q: 1220×1240pxと1220×1016pxのどちらで作ればいいですか？
A： 作成時は1220×1240pxを使用してください。1220×1016pxは一覧表示時の実際の表示領域の目安であり、作成サイズではありません。1220×1240pxで作成し、上下10〜15%を余白や装飾のみにするレイアウトで対応してください。
Q： 画像の容量が大きすぎる場合はどうすればいいですか？
A： SquooshやCanvaのファイル圧縮オプションを使い、1〜3MB以内に収めることを目安にしてください。PNG形式で容量が大きい場合はJPG形式に変えるだけで大幅に削減できます。
Q： プロフィール画像とサービス画像は同じサイズですか？
A： 異なります。プロフィールのアイコン画像は正方形が基本、プロフィールカバーは1280×420px、出品サービス画像は1220×1240pxです。それぞれ専用サイズで作成してください。
Q： 画像を更新すると既存の評価やブックマーク数に影響がありますか？
A： 画像の差し替えは既存の評価件数・ブックマーク数・サービス順位に直接影響しないとされています。ただし急激なクリック率の変化はアルゴリズムに影響する可能性があるため、大幅な変更をした場合は2週間単位で効果を測定してください。