LPコーディングの費用相場は？依頼先別の料金と発注前に準備すべきこと

LP（ランディングページ）のデザインは手元にあるものの、それをブラウザで動く形にするコーディングをどこにいくらで頼めばよいのか判断がつかない、という相談は少なくありません。同じ「LPコーディング1ページ」でも、依頼先によって見積もりが十倍以上に開くことがあるためです。

価格差が生まれる理由は、依頼先の規模だけではありません。「どこからどこまでを依頼するか」という依頼範囲と、ページの長さ・レスポンシブ対応・素材の支給状況によって、同じLPでも見積もりは数倍変わります。

本記事では、LPコーディングで依頼できる作業範囲を整理したうえで、依頼先別・依頼範囲別の費用相場、費用を左右する4つの要素、そして発注前に準備すべきデータと納品時の確認項目までを解説します。
コーディングは「デザインどおりに組めばよい作業」と思われがちですが、実際には表示速度・スマートフォン対応・計測タグの実装精度がそのまま広告の成果に跳ね返る工程です。

LPコーディングで依頼できる作業範囲

LPコーディングとは、デザイナーが作成したデザインカンプ（完成イメージのデザインデータ）を、ブラウザで実際に表示・操作できる状態に組み上げる工程を指します。見積もりを比較する前に、どこまでを依頼するのかを揃えておくことが重要です。

HTML・CSSによる基本実装

HTMLは見出し・本文・画像といった要素の構造を定義し、CSSは配色・余白・文字サイズなどの見た目を指定します。デザインカンプの再現に加え、画面幅に応じて表示を切り替えるレスポンシブ対応もここに含まれるのが一般的です。
ただし、スマートフォン用のデザインが用意されていない場合、要素の再配置を実装側で判断することになるため、追加の工数として見積もられることがあります。

JavaScriptによる動的な機能

スクロールに合わせたアニメーション、画像を切り替えるスライダー、開閉式のFAQ、ポップアップ表示、画面下部に追従するボタンなどはJavaScriptで実装します。
見積もりが極端に安い場合、こうした動きの実装が範囲外になっていることがあります。デザインに動きを想定しているなら、どの挙動まで含まれるのかを個別に確認しましょう。

フォーム・料金シミュレーターなど入力を伴う機能

問い合わせフォームの設置、必須項目の入力チェック、送信完了ページへの遷移、料金や見積もりを自動計算するシミュレーターも依頼できます。
ただしフォームは「見た目を作る」だけでは動きません。送信先メールアドレスの設定、迷惑メール判定への対策、送信完了を計測タグで拾う設定まで含まれているかで金額が変わります。

「コーディングのみ」と「デザインから一括」の違い

コーディングのみの発注は、すでに確定したデザインデータを渡して実装だけを任せる形です。社内やパートナーにデザイナーがいる場合はコストを抑えられますが、構成やコピーの改善提案は基本的に含まれません。
一方の一括発注は、ヒアリング・構成設計・コピーライティング・デザイン・コーディング・公開作業までをまとめて依頼する形です。成果が出ていないLPの作り直しであれば、実装だけを切り出しても結果は変わりにくいため、構成の見直しから相談できる依頼先を検討したほうが効果的です。

LPコーディングの費用相場【依頼先別・依頼範囲別】

LP1ページのコーディング費用は、クラウドソーシングの数千円台から、大手制作会社の50万円以上まで幅があります。価格差の大半は、品質保証・進行管理・公開後の対応をどこまで担ってもらえるかの違いです。

依頼先別の費用相場と制作期間

依頼先	費用相場（1ページ）	期間の目安	特徴
クラウドソーシング・スキルマーケット	数千円〜3万円程度	数日〜2週間	最も安価。品質のばらつきが大きく、指示書作成と検収は発注側の負担になる
フリーランス	3万円〜10万円程度	1週間〜1ヶ月	直接やり取りでき柔軟。稼働状況に左右され、繁忙期は着手が遅れることがある
コーディング専門会社	5万円〜15万円程度	1〜3週間	品質基準とチェック体制が明確。短納期の依頼にも対応しやすい
中小のWeb制作会社	10万円〜30万円程度	1〜2ヶ月	デザイン修正・広告運用・公開後の改善まで一括で相談できる
大手制作会社	50万円程度〜	1〜3ヶ月	大規模案件・多言語対応・厳格な品質基準が必要なケース向け

依頼範囲別の費用相場

同じ依頼先でも、どこから任せるかによって金額は大きく変わります。デザインが確定している状態で実装だけを依頼するのが最も安く、要件定義や構成設計から任せるほど費用は上がります。

依頼範囲	制作会社	フリーランス
コーディングのみ（デザイン確定済み）	10万円〜15万円程度	2万円〜10万円程度
デザイン制作から	30万円〜50万円程度	10万円〜30万円程度
要件定義・構成設計から	30万円〜60万円程度以上	20万円〜30万円程度

ディレクション費が別計上かどうかを確認する

制作会社に依頼する場合、実装費とは別に進行管理を担うディレクション費が計上されることがあります。制作費の10〜20%程度が目安ですが、見積書に「制作一式」とだけ書かれていると内訳が判断できません。
見積もりを比較する際は、依頼先の種類よりも「どこまでが基本料金に含まれるか」を揃えることが先決です。ディレクション費込みの総額で比べないと、安く見えた見積もりが最終的に高くつくことがあります。

追加費用が発生しやすい項目

追加されやすい項目	費用目安
スクロール連動などのアニメーション実装	1万円〜5万円程度
問い合わせフォームの設置・メール送信設定	2万円〜5万円程度
GA4・広告コンバージョンタグの設置	1万円〜3万円程度
WordPressへの組み込み（CMS化）	5万円〜15万円程度
サーバーへのアップロード・公開作業	1万円〜3万円程度
公開後の修正対応（回数・期間の超過分）	1回あたり5,000円〜2万円程度

LPコーディングの費用を左右する4つの要素

「1ページいくら」という単価だけで依頼先を比較すると、条件の違いを見落とします。見積もりが動く要因は、主に次の4つです。

1. ページの長さ（縦幅）

LPは1ページで完結する代わりに縦に長く、一般的なLPで縦8,000px前後になることも珍しくありません。実装工数はセクション数と縦幅にほぼ比例するため、料金表に「1ページ〇万円」とあっても、想定している縦幅の上限が設定されているのが通常です。
見積もりを取る際は、デザインカンプの縦幅かセクション数を伝えたうえで金額を出してもらうと、比較の精度が上がります。

2. デザインの作り込みと動的機能の有無

グラデーションや変形した図形を多用したデザイン、スクロール連動のアニメーション、切り替え式のタブなどは、単純な要素の配置に比べて実装工数が増えます。
フォームやシミュレーターのように入力・送信を伴う機能は、表示の実装に加えて動作テストが必要になるため、別項目として加算されるのが一般的です。

3. レスポンシブ対応の範囲

PCとスマートフォンの2パターンだけか、タブレットを含む3パターンかで工数は変わります。スマートフォン専用のデザインカンプがある場合と、PC版から実装側が再構成する場合でも金額は変わります。
広告からの流入はスマートフォンが大半を占めるため、費用を抑える目的でスマートフォン対応を削るのは本末転倒です。削るなら、タブレット向けの個別調整から検討しましょう。

4. 素材・データをどこまで支給するか

写真・イラスト・ロゴ・原稿を発注側で用意して支給すれば、その分の費用はかかりません。逆に、素材の選定や原稿の作成まで依頼すると加算されます。
支給するデータの整理状況によっても工数は変わり、同じデザインでも数万円単位で見積もりが動きます。多くの依頼先は入稿データの形式に規定を設けているため、発注前に確認しておきましょう。

発注から公開までの流れと制作期間の目安

デザインが確定しているLP1ページのコーディングであれば、着手から納品まで3日〜10日程度が一つの目安です。ページの長さ、アニメーションの量、フォームやCMS化の有無によって前後します。

発注から納品までの7ステップ

依頼先によって期間が変わる理由

フリーランスやコーディング専門会社は工程が少ない分、着手から納品までが短く済みます。一方で制作会社は、ディレクターによる進行管理と社内チェックの工程が入るため、1〜2ヶ月を見込むケースが一般的です。
期間の長さは必ずしも非効率を意味せず、複数人での確認体制があるかどうかの違いでもあります。急ぎなのか、品質担保を優先するのかで依頼先を選び分けましょう。

着手後のデザイン変更が最大の遅延要因

コーディング着手後にデザインを変更すると、すでに組んだHTML・CSSの作り直しが発生し、納期と費用の両方に影響します。
「文言はあとで差し替える」「写真は仮のまま進める」といった進め方は追加費用の原因になりやすいため、入稿時点でデザインを確定させておくことが結果的に最短ルートです。広告の配信開始日が決まっている場合は、確認・修正の往復と計測タグの動作テストの時間まで見込んで逆算しましょう。

発注前に準備すべきデザインデータと指示内容

見積もりが依頼先によってばらつく原因の一つが、渡されるデザインデータの状態です。入稿データが整理されているかどうかで、同じデザインでも工数が変わります。

Figma・Adobe XD・PSDの入稿形式

近年はFigmaでの共有が主流で、閲覧権限を付与したURLを渡すだけで済むケースが増えています。Adobe XDやPhotoshop（PSD）で作成している場合は、フォントをアウトライン化する前のデータと、リンク画像を含めた一式を渡す必要があります。
レイヤーに名前が付いておらず構造がわからない、テキストが画像化されていて文字を抽出できないといった状態だと、実装側で解析の手間が発生し工数が膨らみます。

フォント・画像素材の受け渡しで確認すること

デザインで使用しているフォントがWebフォントとして利用可能か、ライセンス上Webでの使用が許諾されているかは、発注側で確認しておく項目です。
写真・イラストについても、購入した素材のライセンス範囲（Web利用可・二次配布不可など）を制作会社に伝えておくと、公開後のトラブルを防げます。ロゴはPNGではなくSVGやAI形式で渡すと、高解像度ディスプレイでも鮮明に表示されます。

手戻りを防ぐ指示書に入れるべき項目

デザインデータだけでは伝わらない要件は、あらかじめ文書で共有しておきます。最低限、以下の項目を指示書にまとめておくと認識のズレを防げます。

指示書の項目	記載する内容の例
対応ブラウザ・端末	Chrome・Safari・Edgeの最新版、iOS・Androidの実機確認範囲
スマートフォン用デザイン	専用デザインの有無。ない場合はPC版をどう再配置するか
動き・アニメーション	スクロール時のフェードイン、追従ボタン、FAQの開閉など
リンク先・遷移先	各ボタンの遷移先URL、電話番号タップ時の挙動
フォーム	入力項目、必須項目、送信先メールアドレス、送信完了ページ
計測タグ	GA4、Google広告・Yahoo!広告のコンバージョンタグ、Meta広告のピクセル

納品前後に確認すべき品質チェックポイント

コーディングの成果物は、デザインどおりに見えていれば合格というものではありません。広告の成果に直結する3つの観点から確認しましょう。

スマートフォン対応は実機で確認する

PCブラウザの画面幅を狭めた確認だけでは、実際のスマートフォンでの表示崩れを見落とすことがあります。特に、フォームの入力欄が拡大表示される、追従ボタンがキーボードに隠れるといった問題は実機でしか気づけません。
切り替えの基準となる画面幅（ブレイクポイント）をどこに設定しているか、タブレットサイズでの表示をどう扱うかも、納品前に確認しておきたい項目です。

表示速度はCore Web Vitalsの基準で測る

Googleは、ページの読み込み体験を測る指標としてCore Web Vitalsを公開しており、良好とされる基準はLCP（主要なコンテンツの表示完了）2.5秒以内、INP（操作への反応速度）200ミリ秒以内、CLS（表示のずれ）0.1以下とされています。
LPは画像を多用するため、画像の圧縮と適切なサイズでの書き出しができているかどうかで読み込み時間が大きく変わります。PageSpeed Insightsなどの無料ツールで納品時のスコアを確認し、基準を満たしていない場合は改善を依頼しましょう。

フォーム送信と計測タグの動作テスト

公開直後に多いトラブルが、フォームからのメールが届かない、コンバージョンが計測されないという2点です。
公開前に自社で実際にフォームを送信し、受信メールの内容と迷惑メール判定の有無、そして広告管理画面でコンバージョンが記録されるかまでを確認してください。計測が動いていないまま広告を配信すると、その期間のデータが使えなくなります。

依頼先の選び方とケース別の判断軸

依頼先は「安いかどうか」ではなく、自社の体制で不足している部分を補えるかどうかで選ぶと失敗しにくくなります。

実績とマーケティング視点の提案があるか

LPの制作実績が豊富で、成果につながる構成や導線を提案できる依頼先であれば、実装以上の価値が期待できます。
実績を確認する際は件数だけでなく、自社と近い商材・業界の事例があるか、公開後の改善まで関わった案件があるかを見ましょう。

料金体系と納品条件が明示されているか

基本料金に含まれる範囲、追加費用が発生する条件、ディレクション費の有無が事前に開示されているかは、やり取りの効率にも直結します。
あわせて、納品されたソースコードを自社で自由に修正・流用できるか（著作権や二次利用の扱い）と、納品形式（zipでの受け渡しか、サーバーへのアップまで含むか）を契約前に確認しておきましょう。将来的に別の会社へ改修を依頼する可能性がある場合、この確認を怠ると引き継ぎができなくなります。

公開後のサポート範囲と保守費用

納品後の無償修正がいつまで・何回まで対応されるのか、文言差し替えや画像交換といった軽微な更新が有償かどうかは、依頼先ごとに条件が異なります。
LPは広告運用に合わせてキャッチコピーやオファーを差し替えることが多いため、更新頻度が高い場合は月額の保守契約（相場1万円〜3万円程度）を結んだほうが割安になることがあります。

ケース別に見た依頼先の選び分け

自社の状況	向いている依頼先
デザインが確定していて、指示書作成と検収を自社で行える	フリーランス・コーディング専門会社
とにかく費用を抑えたい／小規模なテスト用LP	クラウドソーシング（実績・評価を確認したうえで）
構成やデザインの提案も含めて任せたい	中小のWeb制作会社
広告の配信・改善まで一貫して任せたい	制作とマーケティングの両方に対応する制作会社
更新頻度が高く、社内にコーディング人材がいる	内製化（外注は繁忙期のみ）

フリーランス・クラウドソーシングを使う際のリスクと対策

フリーランスやクラウドソーシングは費用面で有利な一方、担当者と連絡が取れなくなる、修正指示の往復が長引く、スマートフォン表示だけ崩れている、といったリスクがあります。
実績と評価を確認する、着手前に指示書と検収基準をすり合わせる、支払いをエスクロー（仲介）方式にするといった対策で、リスクはある程度抑えられます。広告費を投下する予定のLPであれば、検収体制のある依頼先を選ぶほうが総額を抑えられるケースが多くあります。

よくある質問

LPコーディングの費用はどのくらいかかりますか？

デザイン確定済みで実装のみを依頼する場合、フリーランスで2万円〜10万円程度、制作会社で10万円〜15万円程度が目安です。大手制作会社では50万円以上、要件定義や構成設計から任せる場合は30万円〜60万円程度以上になります。フォーム設置や計測タグの実装が別料金のことが多いため、作業範囲を揃えて比較してください。

コーディングだけを依頼することはできますか？

可能です。デザインが確定していれば、実装のみを切り出して発注できます。ただし構成やコピーの改善提案は含まれないのが一般的なので、成果が出ていないLPの作り直しであれば、構成の見直しから相談できる依頼先を検討したほうが効果的です。

制作期間はどのくらいかかりますか？

デザイン確定済みのLP1ページであれば、着手から3日〜10日程度が目安です。実装量が多い場合やコーディング専門会社では1〜3週間、制作会社では社内チェックの工程が入るため1〜2ヶ月を見込むのが一般的です。アニメーションが多い場合やWordPressへの組み込みを伴う場合はさらに時間がかかります。

デザインデータはどの形式で渡せばよいですか？

Figmaの共有URL、Adobe XD、Photoshop（PSD）のいずれかが一般的です。レイヤーが整理されていること、テキストが画像化されていないこと、使用フォント名がわかることが揃っていると工数を抑えられます。多くの依頼先が入稿データの形式に規定を設けているため、発注前に確認しておきましょう。

スマートフォン用のデザインも用意する必要がありますか？

専用デザインがあるほうが確実ですが、ない場合はPC版をもとに実装側で再配置する形になります。その際、どの要素を省略するか、ボタンの配置をどうするかの判断が必要になるため、方針だけでも事前に共有しておくと手戻りを防げます。広告流入の大半がスマートフォンであることを考えると、スマートフォン表示を優先して設計するのが現実的です。

計測タグの設置も依頼できますか？

多くの依頼先で対応していますが、基本料金に含まれず1万円〜3万円程度の追加になることが一般的です。GA4や広告のコンバージョンタグは広告の費用対効果を判断する土台になるため、必ず実装範囲に含めたうえで、公開前に実際に計測されるかテストしてください。

納品されたLPを自社で修正することはできますか？

HTML・CSSの知識があれば可能ですが、契約内容によってソースコードの二次利用が制限されている場合があります。自社で更新したい、将来的に別会社へ改修を依頼する可能性がある、といった場合は、発注前に納品物の取り扱い条件を確認しておきましょう。頻繁に文言を差し替えるならWordPressへの組み込みを検討する方法もあります。

株式会社ロックビルは、東京を拠点にHP・LP制作、Webマーケティング（PPC・SEO・SNS）、Webコンサルをワンストップで提供しています。コーディングのみのご依頼から、構成設計・デザイン・広告運用までの一括対応まで、体制に合わせてご提案が可能です。表示速度や計測タグの実装も含めて、公開後に成果を確認できる状態でお引き渡しします。営業電話による売り込みは行わず、無料相談からご提案します。

ご相談・お見積もりは、お問い合わせフォーム（ https://rockvil.jp/contact/ ）またはお電話（03-5422-7833／平日10:00〜19:00）よりお気軽にご連絡ください。資料のダウンロードは https://rockvil.jp/whitepaper/ から可能です。