格安のホームページ制作や作成ツールでは、既製テンプレートへ文章と写真を入れてサイトを作ることがあります。
短期間で公開しやすい一方、完成した画面を見たときに「他社と似ている」「自社の雰囲気が伝わらない」「テンプレートへ無理に情報を詰め込んだように見える」と感じる場合があります。
テンプレートっぽい見た目を避けたいなら、既存レイアウトへの差し替えではなく、掲載内容やブランドに合わせて一からデザインする外注先を選びます。
ただし、完全オリジナルデザインを頼んでも、コーディングや公開作業まで自動的に含まれるわけではありません。デザインの範囲、PC・スマホ版の料金、納品形式を確認してから発注する必要があります。
- テンプレートっぽいホームページとは?
- テンプレートを使うこと自体が悪いわけではない
- テンプレート制作が向いているケース
- 完全オリジナルデザインが向いているケース
- オリジナルデザインなら何でも自由に作れる?
- テンプレートっぽさを避ける5つの設計要素
- デザインだけの外注とホームページ制作一式の違い
- PC版とスマホ版は別のデザインとして考える
- トップページとLPは料金が異なる
- 基本制作料金を整理する
- 料金が変わりやすい要素
- 完全オリジナルでも参考サイトは必要?
- テンプレートっぽさが残る依頼の仕方
- 発注前に用意する情報
- 漠然としたイメージを伝える整理表
- 修正無制限でも全面的な作り直しは別
- FigmaとXDのどちらで納品してもらう?
- 写真素材がなくても依頼できる?
- 原稿だけでもデザインを依頼できる?
- 実績掲載を希望しない場合は先に伝える
- 予定納期と実績日数に差がある場合
- 見積もり相談で比較する項目
- 見積もり相談に使える依頼文
- 完全オリジナルを依頼する前のチェックリスト
- 自社らしさを言語化してから外注する
テンプレートっぽいホームページとは?
テンプレートっぽく見える主な原因は、デザインが悪いことではなく、掲載内容とレイアウトが合っていないことです。
よくある特徴は次のとおりです。
- 他社サイトと同じような配置になっている
- どの業種でも使えそうな写真が並んでいる
- ブランドカラーが十分に反映されていない
- 必要な情報を既存の枠へ無理に入れている
- 見出しやボタンの形がすべて同じ
- ファーストビューから事業内容が伝わらない
- 不要なセクションが残っている
- PC版を縮小しただけのスマホ表示になっている
- 写真や文字の量に対して余白が合っていない
- サービスの価格帯とデザインの印象が一致していない
テンプレートは、あらかじめ用意された構成を使うため、制作時間と費用を抑えやすい方法です。
一方、事業ごとに情報量や優先順位が異なるため、テンプレートの構成と合わなければ、不自然な空欄や長すぎる文章が発生します。
テンプレートを使うこと自体が悪いわけではない
テンプレート制作とオリジナル制作には、それぞれ向いている用途があります。
重要なのは、予算の高低ではなく、ホームページの目的に合う方法を選ぶことです。
| 比較項目 | テンプレートを使う制作 | 完全オリジナルデザイン |
|---|---|---|
| 制作方法 | 既存の構成へ文章や写真を入れる | 内容に合わせて配置を設計する |
| 制作期間 | 比較的短い | ヒアリングと設計の時間が必要 |
| 初期費用 | 抑えやすい | テンプレート型より高くなりやすい |
| デザインの自由度 | 用意された範囲内 | ブランドに合わせて調整しやすい |
| ページ構成 | 既存の枠に影響される | 情報量や目的に合わせて作れる |
| 他社との差 | 素材や配色で調整 | レイアウトから差を作れる |
| 向いている用途 | 仮サイト、簡易な会社案内 | ブランディング、集客、採用、商品訴求 |
| 発注時の準備 | 文章と写真が中心 | 目的、対象者、強みまで共有する |
テンプレートは設計済みの構成を利用できるため、制作工程を抑えやすくなります。完全オリジナルでは、要望の整理やレイアウト設計が必要になる分、制作費も変わります。
テンプレート制作が向いているケース
次の条件なら、テンプレートを使ったホームページでも目的を達成できます。
- 名刺代わりのサイトを早く公開したい
- 掲載情報が少ない
- デザインより費用を優先する
- 事業内容が単純
- 短期間だけ使用する
- 検証用のサイトを作りたい
- 既存のレイアウトで問題がない
- 自社で文章や写真を差し替えたい
- 将来作り直す前提で公開する
たとえば、会社名、所在地、事業内容、問い合わせ先だけを掲載するサイトなら、大幅なオリジナル設計は不要な場合があります。
テンプレートを選ぶ際は、掲載したい情報が無理なく収まるかを確認してください。
完全オリジナルデザインが向いているケース
次の条件に当てはまる場合は、一からデザインを作る価値があります。
- 商品やサービスの世界観を重視する
- 競合サイトと似た見た目を避けたい
- 高価格帯の商品を扱っている
- 写真を大きく見せたい
- 掲載する情報量が多い
- 独自の申し込み導線が必要
- 採用サイトで社風を表現したい
- 複数事業を分かりやすく整理したい
- リニューアルで企業イメージを変えたい
- 既存テンプレートでは希望の構成を作れない
完全オリジナルデザインでは、色や写真だけでなく、情報の順番、余白、文字、ボタン、画面の動きまで事業に合わせて設計できます。
ただし、自由度が高いほど、発注者が伝える情報も重要になります。
オリジナルデザインなら何でも自由に作れる?
完全オリジナルと書かれていても、すべての素材や機能が一から制作されるとは限りません。
次の項目は分けて確認します。
- ページ構成
- Webデザイン
- ロゴ
- 写真
- イラスト
- アイコン
- 原稿
- キャッチコピー
- コーディング
- アニメーション
- 問い合わせフォーム
- WordPress
- サーバーへの公開
オリジナルデザインとは、一般的にはWebページの見た目やレイアウトを案件ごとに作ることです。
写真はフリー素材、フォントは利用可能な既存フォント、アイコンは素材サイトのものを使用する場合があります。
写真撮影やイラスト制作まで必要なら、基本料金に含まれるか確認してください。
テンプレートっぽさを避ける5つの設計要素
1.ファーストビュー
ファーストビューは、ページを開いて最初に見える範囲です。
次の要素を組み合わせて作ります。
- キャッチコピー
- メイン写真
- ロゴ
- サービスの概要
- 問い合わせボタン
- 実績や選ばれる理由
テンプレートへ短い言葉を入れるだけでは、自社の特徴が伝わらないことがあります。
誰に何を提供しているのかを決めたうえで、文字と写真の大きさを調整します。
2.写真の使い方
同じフリー素材を使っても、選び方と配置で印象は変わります。
確認する点は次のとおりです。
- 人物の年齢や服装
- 写真の明るさ
- 背景の場所
- 商品の見える大きさ
- 写真の切り取り方
- 同じ雰囲気で統一されているか
- ターゲットと合っているか
法人向けサービスなのに若者向けのカジュアルな写真を使うと、事業の印象と一致しません。
自社の店舗、スタッフ、商品、実績を撮影できる場合は、オリジナル写真を使用すると違いを作りやすくなります。
3.配色
色は、好みだけで決めるものではありません。
ロゴ、商品、業種、対象者、価格帯に合わせます。
たとえば、同じ青色でも次のような違いがあります。
- 明るい水色:軽さ、親しみやすさ
- 鮮やかな青:活発さ、先進性
- 濃紺:信頼感、落ち着き
- くすんだ青:上品さ、柔らかさ
「青系にしてほしい」だけでなく、参考画像や避けたい色も伝えてください。
4.文字と余白
フォント、文字サイズ、行間、余白によって、サイトの印象は大きく変わります。
- 太いゴシック体:力強さ、分かりやすさ
- 細いゴシック体:洗練、軽さ
- 明朝体:上品さ、伝統、落ち着き
- 丸みのある文字:親しみやすさ
- 広い余白:高級感、落ち着き
- 情報密度の高い配置:活発さ、機能性
テンプレートの初期設定をそのまま使わず、ブランドに合う文字と余白へ調整します。
5.情報の順番
ホームページでは、何を載せるかだけでなく、どの順番で見せるかが重要です。
問い合わせを目的とするトップページなら、次のような流れが考えられます。
- 誰向けのサービスか
- どのような悩みを解決するか
- サービスの特徴
- 選ばれる理由
- 実績
- 利用の流れ
- 料金
- よくある質問
- 問い合わせ
会社の信頼性を伝えるサイトなら、会社概要、代表者、実績、取引先などを優先する場合があります。
目的に合わせて掲載順を変えることが、オリジナル設計の中心です。
デザインだけの外注とホームページ制作一式の違い
今回のサービスは、基本的にWebデザインデータを制作する内容です。
デザインを受け取っただけでは、ブラウザで表示できるホームページにはなりません。
| 依頼範囲 | 主な納品物 | 別途必要になる作業 |
|---|---|---|
| デザインのみ | FigmaやXDのデータ | コーディング、公開 |
| デザイン+コーディング | HTMLやCSSなど | サーバーへの設置 |
| WordPress制作 | 更新可能なサイト | 初期設定、公開後の管理 |
| 制作から公開まで | 公開済みサイト | 保守、更新、集客 |
| テンプレート型制作 | 既存構成を使ったサイト | 内容更新、運用 |
社内や別の外注先にコーダーがいる場合は、デザインのみを依頼できます。
実装担当者がいない場合は、デザイン発注と同時にコーディング先も確保してください。
PC版とスマホ版は別のデザインとして考える
スマホ版は、PC版を小さく縮めた画像ではありません。
画面幅が狭いため、次の調整が必要です。
- 横並びを縦並びへ変える
- 写真の切り取り方を変える
- キャッチコピーの改行を変える
- 文字サイズを調整する
- ボタンを押しやすくする
- 表の見せ方を変える
- メニューをスマホ用にする
- 重要な情報の順番を変える
- 左右の余白を調整する
PC版とスマホ版が別料金のサービスでは、総額を比較するときに両方を含めて計算します。
PC版だけ依頼し、スマホ版をコーダーへ任せることもできますが、デザイン上の判断が実装担当者に委ねられます。
ブランドの見え方を細かく管理したい場合は、スマホ版デザインも依頼したほうが安全です。
トップページとLPは料金が異なる
トップページとLPは、どちらも縦長の画面に見えますが、役割が異なります。
ホームページのトップページ
複数の下層ページへ案内する入口です。
主な掲載内容は次のとおりです。
- 会社やサービスの概要
- 事業内容
- 実績
- お知らせ
- 会社情報
- 採用情報
- 問い合わせ
- 各下層ページへのリンク
LP
商品購入や申し込みなど、一つの行動へ誘導するページです。
主な掲載内容は次のとおりです。
- 商品の特徴
- 利用者の悩み
- 選ばれる理由
- 実績
- 料金
- 利用者の声
- よくある質問
- 申し込みボタン
LPは一ページ内の情報量が多く、縦幅が長くなりやすいため、トップページより高く設定される場合があります。
見積もりでは「1ページ」とだけ伝えず、トップページかLPかを明記してください。
このサービスでは、制作会社で約10年の経験を持つデザイナーへ、テンプレートを使わないオリジナルのトップページやLPデザインを相談できます。
漠然とした希望や原稿だけの状態からでも、目的、ターゲット、参考サイトなどを共有し、デザインを調整していく内容です。
基本制作料金を整理する
掲載されている主な料金目安は次のとおりです。
| 制作内容 | 料金の目安 |
|---|---|
| ホームページのトップ・PC版 | 50,000円から |
| ホームページのトップ・スマホ版 | 30,000円から |
| LP・PC版 | 60,000円から |
| LP・スマホ版 | 40,000円から |
たとえば、トップページのPC版とスマホ版を両方依頼する場合は、単純計算で80,000円からが一つの目安になります。
LPのPC版とスマホ版なら、100,000円からが目安です。
実際の料金は、ページの縦幅、掲載内容、写真加工、構成、希望納期などによって変わります。
購入画面には50,000円と表示されていますが、必要な画面をすべて伝えて見積もりを取る必要があります。
料金が変わりやすい要素
Webデザインの金額は、ページ数だけでは決まりません。
主に次の要素で作業量が変わります。
- ページの縦幅
- 掲載するセクション数
- PC・スマホ版の有無
- 写真加工
- グラフや図解
- 料金表
- 比較表
- オリジナルアイコン
- イラスト
- 複雑なフォーム画面
- デザイン案の数
- 希望納期
- 原稿の整理
- コピーライティング
- 修正内容
長いLPや情報量の多いトップページでは、表示価格より高くなる可能性があります。
見積もり相談時に、掲載原稿や構成案を送ると金額を判断してもらいやすくなります。
完全オリジナルでも参考サイトは必要?
参考サイトは、コピーするためではなく、希望する方向性を共有するために使用します。
2~4件程度用意し、参考にしたい部分を説明してください。
- A社は余白の取り方
- B社は写真の大きさ
- C社は落ち着いた配色
- D社はスマホのメニュー
- E社のようなアニメーションは不要
一つのサイトを丸ごと指定すると、似たデザインになりやすくなります。
複数サイトから要素を分けて伝え、自社に必要な構成へ調整します。
テンプレートっぽさが残る依頼の仕方
完全オリジナルのサービスへ依頼しても、発注内容が曖昧だと一般的な構成に寄りやすくなります。
「おしゃれにしてください」だけ伝える
おしゃれの基準は人によって異なります。
高級感、親しみやすさ、先進性、温かさなど、優先する印象を具体化します。
競合サイトだけを参考にする
同業他社だけを参考にすると、配色や構成が似やすくなります。
異業種でも、ターゲットや価格帯が近いサイトを含めます。
フリー素材を指定せず任せる
使用する写真の雰囲気を決めないと、一般的な素材写真が選ばれる可能性があります。
人物の年齢、服装、場所、明るさなどを伝えます。
掲載原稿を後から大幅に変更する
デザイン完成後に文章量が変わると、レイアウトの再調整が必要です。
仮原稿でも、最終的な文字量に近い状態で渡してください。
ターゲットを広く設定する
「男女問わず幅広い年代」とすると、誰にも強く響かない無難なデザインになりやすくなります。
最も優先する利用者を決めます。
発注前に用意する情報
見積もり相談では、次の内容をまとめます。
- ホームページの目的
- 想定するターゲット
- トップページかLPか
- PC版とスマホ版の必要性
- 掲載したい内容
- 原稿の有無
- ロゴの有無
- 写真素材の有無
- 参考サイト
- 希望する雰囲気
- 避けたいデザイン
- 希望する色
- 希望する横幅
- 納品形式
- 希望納期
- コーディング担当者
- 実績掲載の可否
すべてが決まっていなくても相談できます。
未定の項目は、「提案してほしい」「相談して決めたい」と書いてください。
漠然としたイメージを伝える整理表
頭の中にあるイメージを文章にしにくい場合は、次の形式で整理します。
| 項目 | 記入例 |
|---|---|
| 最優先の印象 | 信頼感 |
| 補助的な印象 | 先進性、親しみやすさ |
| 避けたい印象 | 堅すぎる、安く見える |
| 希望する色 | 濃紺、白、淡いグレー |
| 避けたい色 | 原色の赤、鮮やかな黄色 |
| 写真 | 自然光、実際の仕事風景 |
| 文字 | 読みやすく、細すぎない |
| 余白 | 広め |
| ターゲット | 中小企業の経営者 |
| 最終行動 | 無料相談 |
言葉だけで説明できない場合は、参考画像やスクリーンショットも添えます。
修正無制限でも全面的な作り直しは別
サービスでは、当初の依頼内容から大きく変わらない範囲で、修正回数無制限と案内されています。
調整しやすい内容は次のとおりです。
- 色の変更
- 文字サイズ
- 写真の差し替え
- 余白
- 軽微な文章修正
- ボタンの形
- 一部の配置
- 細部の装飾
一方、次の変更は当初の依頼内容から外れる可能性があります。
- ターゲットを変更する
- サイトの目的を変更する
- トップページからLPへ変更する
- 掲載内容を大量に追加する
- デザインの雰囲気を全面的に変える
- 完成後に構成を作り直す
- ページを追加する
修正無制限の意味は、購入前に確認してください。
回数だけでなく、無料で対応できる変更の範囲を聞くことが重要です。
FigmaとXDのどちらで納品してもらう?
このサービスでは、FigmaとXDによる制作が案内されています。
納品形式は、実装担当者が使用できるものを選びます。
確認する点は次のとおりです。
- コーダーが使用できるソフト
- 編集データを受け取れるか
- 画像を書き出せるか
- 使用フォントが分かるか
- PC・スマホ版が整理されているか
- デザイン上の数値を確認できるか
- ファイルを複製できるか
- 閲覧・編集権限
- 納品後の保管方法
JPEGやPDFだけでは、実装に必要な余白や文字サイズを正確に確認しにくい場合があります。
コーディングに使うなら、編集可能なデザインデータが納品されるか確認してください。
写真素材がなくても依頼できる?
商品や店舗の固有写真がなくても、フリー素材を使用してデザインを作れる場合があります。
フリー素材が使いやすいのは次の部分です。
- サービスのイメージ
- 背景
- オフィス風景
- 抽象的なビジネス写真
- ライフスタイル写真
- 装飾用の画像
一方、次の写真は発注者側で用意したほうが正確です。
- 商品
- 店舗
- スタッフ
- 施工事例
- 設備
- 実際の利用場面
- 代表者
- オリジナル作品
フリー素材だけで構成すると、他社サイトでも見たことのある写真が含まれる可能性があります。
オリジナル性を重視するなら、自社写真とフリー素材を使い分けます。
原稿だけでもデザインを依頼できる?
掲載原稿があれば、デザイナーが内容を読み取り、見せ方を整理してデザインすることは可能です。
ただし、原稿には次の情報を含めます。
- 最も伝えたい内容
- サービスの対象者
- 主な特徴
- 他社との違い
- 料金
- 利用の流れ
- 実績
- 問い合わせ先
社内資料をそのまま渡すと、Webページには長すぎる場合があります。
文章の整理やキャッチコピー作成も必要なら、対応範囲と追加料金を確認してください。
今回のサービスでも、希望に応じて原稿作成やコピーライティングを相談できます。
実績掲載を希望しない場合は先に伝える
制作したデザインは、デザイナーのホームページやSNSへ実績として掲載される場合があります。
公開前の商品、未発表の事業、再委託案件などでは、実績掲載を許可できないことがあります。
購入前に次の範囲を確認してください。
- デザイナーのホームページ
- SNS
- ココナラのポートフォリオ
- 営業資料
- 制作途中の画面
- 社名を隠した加工画像
- サイト公開後の掲載
- 永続的な非掲載
掲載不可を希望する場合は、追加料金の有無も確認します。
予定納期と実績日数に差がある場合
サービスページには、予定のお届け日数として10日、実績として約61日と表示されています。
この差だけで、制作が遅いとは判断できません。
実績日数には、次の期間が含まれる場合があります。
- 発注者の原稿準備
- 写真の提出待ち
- 初稿確認
- 複数回の修正
- 社内承認
- 連絡が止まっていた期間
- 長いLPの制作
- PC・スマホ両方の制作
急ぎの場合は、「10日で可能ですか」と聞くだけでなく、希望する日時と制作範囲を伝えます。
- 制作開始希望日
- 初稿希望日
- 最終納品日
- PC・スマホの範囲
- 原稿の準備状況
- 修正確認に必要な日数
- コーディング開始日
- 公開日
土日対応が必要な場合も、見積もり前に相談してください。
見積もり相談で比較する項目
相見積もりを取る場合は、各制作者へ同じ条件を伝えます。
| 比較項目 | 確認する内容 |
|---|---|
| 制作範囲 | トップ、LP、下層ページ |
| 画面 | PC、スマホ、タブレット |
| 制作方法 | テンプレートか完全オリジナルか |
| 構成 | 発注者が用意するか、提案されるか |
| 素材 | 写真やアイコンの費用 |
| 原稿 | 支給か、作成を依頼するか |
| 修正 | 回数と無料範囲 |
| 納品形式 | Figma、XD、画像など |
| 実装 | コーディングを含むか |
| 公開 | サーバーへの設置を含むか |
| 納期 | 初稿日と最終納品日 |
| 実績公開 | 非掲載にできるか |
「トップページ一式」と書かれていても、スマホ版やコーディングが含まれるとは限りません。
料金の安さだけではなく、納品物をそろえて比較してください。
見積もり相談に使える依頼文
「会社ホームページのトップページデザインを検討しています。
既製テンプレートへ文章を入れたような見た目を避け、当社の事業内容に合わせた完全オリジナルデザインを希望します。
ホームページの目的は、法人からの問い合わせを獲得することです。対象者は○○業界の経営者と担当者です。
掲載予定の内容は、事業概要、サービス、選ばれる理由、実績、利用の流れ、会社概要、問い合わせです。
PC版とスマホ版の両方を希望します。原稿とロゴは用意済みですが、イメージ写真はありません。
参考サイトを3件添付します。A社は余白、B社は写真の使い方、C社は配色を参考にしたいです。競合と似た○色中心のデザインは避けたいです。
納品形式は、コーディング担当者の希望によりFigmaを指定します。
希望初稿日は○月○日、最終納品日は○月○日です。
この内容での見積金額、無料修正の範囲、納品物、制作スケジュールをご提示ください。」
LPの場合は、予定している縦幅やセクション数も伝えます。
完全オリジナルを依頼する前のチェックリスト
- テンプレートを使わず制作されるか
- どこまでオリジナルで作るか
- トップページかLPか
- PC版の料金
- スマホ版の料金
- ページの長さ
- 構成案の有無
- 写真素材の費用
- 原稿作成の有無
- コピーライティングの有無
- 修正範囲
- 納品形式
- コーディングの有無
- 公開作業の有無
- 希望納期への対応
- 土日対応の可否
- 実績掲載の可否
- 著作権と利用範囲
完全オリジナルという言葉だけで判断せず、料金に含まれる作業を確認します。
自社らしさを言語化してから外注する
テンプレートっぽいホームページを避けるには、テンプレートを使わない制作者を選ぶだけでは不十分です。
発注者側も、次の内容を伝える必要があります。
- 誰に見てほしいか
- 何を伝えたいか
- 他社との違い
- 優先する印象
- 避けたい印象
- 使用したい写真
- 参考にしたいデザイン
- 最終的に取ってほしい行動
これらをもとに、ファーストビュー、写真、配色、文字、余白、情報の順番を設計することで、事業に合ったデザインへ近づきます。
トップページとLPのどちらを作るか、PC・スマホ版の必要性、原稿や写真の準備状況、希望納期を伝えて見積もりを相談できます。
完全オリジナルの範囲、デザインデータの形式、修正条件、実装担当者を確認し、公開までに必要な工程と総額を把握してから購入してください。

