1ページ 15,000円〜/最短3営業日

コーディング代行・HTMLコーディング外注

XD・Figma・PSDなどのデザインデータをご入稿いただき、HTML/CSSに起こします。 レスポンシブ対応込み、修正は回数無制限。WordPress化まで通しでのご依頼にも対応します。

PRICE

コーディング代行の料金

コーディング費用(レスポンシブ)1ページあたり(10ページまで)。11ページ目からは10,000円、31ページ目からは7,000円、51ページ目からは5,000円15,000円〜
PCまたはSPのみの場合1ページあたり(10ページまで)。ページ数が多いほど単価が下がります7,000円〜
最低利用料金10ページ以下は、ページの長さにより追加料金がかかる場合があります50,000円
WordPress化まで通しの場合オリジナルテーマとしての構築基本費用。上記コーディング費用に加算50,000円〜
コーディング済みHTMLの調整既にあるHTMLをWordPressに載せる場合のデータ調整20,000円〜

※ 表示価格はすべて税別です。ページ数・実装内容により変動しますので、詳細はお見積りにてご確認ください。ページ数ごとの料金表と概算お見積もりは 料金一覧 をご覧ください。

お取引の条件

納期
最短3営業日ページ数・実装する機能により変動します。お見積りとあわせて納品日をご提示します。
修正対応
回数無制限ご依頼の要件どおりに動作しない箇所は、回数を問わず対応します。仕様の追加・変更は別途お見積りとなります。
お支払い
PayPal(クレジットカード)/ 銀行振込銀行振込は月末締めの翌月末支払いです。請求書をお送りします。振込手数料はご負担をお願いしております。
SCOPE

コーディング代行の対応範囲

デザインデータXD / Figma / PSDお客様からご入稿ご入稿HTML / CSS に起こすここから担当レスポンシブ対応込みWordPress 化オリジナルテーマとして組み込むご希望があればここだけのご依頼も可納品修正は回数無制限。ページ単位・LP 1 枚だけといったご依頼にも対応します。
デザインデータをご入稿いただければ、HTML/CSS に起こすところから WordPress 化まで通しで担当します。HTML の納品まで、WordPress 化だけ、といった途中からのご依頼にも対応します。
01

入稿いただくもの

  • XD / Figma / PSD などのデザインデータ
  • または、コーディング済みのHTML/CSS
  • フォント・書き出し用の画像素材
  • 対応が必要なブラウザ・端末のご指定
02

コーディングの範囲

  • HTML / CSS のマークアップ
  • レスポンシブ対応(PC・タブレット・スマートフォン)
  • JavaScript による動きの実装
  • フォームの設置
  • ブラウザ表示確認
03

あわせて依頼できること

  • WordPressのオリジナルテーマ化
  • カスタム投稿・カスタムフィールドの実装
  • 既存サイトへのページ追加
  • オリジナルプラグインの開発
REASON

ワプラボのコーディング代行が
選ばれる理由

01

料金表があり、単価が明確

1ページ15,000円から。ページ数が多いほど1ページあたりの単価が下がります。お見積りは即日ご回答します。

02

最短3営業日で納品

ページ数と実装内容を確認して、お見積りとあわせて納品日をご提示します。

03

レスポンシブ込み・修正は回数無制限

レスポンシブ対応は料金に含まれます。ご依頼の要件どおりに動作しない箇所の修正は、回数を問わず対応します。

HYBRID

人とAIの
ハイブリッドコーディング

デザインデータから納品まで。画像の書き出しと指示書は人、大まかなコーディングはAI、仕上げと細部のブラッシュアップは人が担当します
  1. 人が担当

    画像の書き出しと指示書

    デザインデータから画像を書き出し、どう組むかの指示書を作ります。

  2. AIが担当

    大まかなコーディング

    指示書をもとに、AI が全体のコーディングを進めます。

  3. 人が担当

    仕上げと細部のブラッシュアップ

    AI が組んだものを人が見直し、細かいところまで整えて仕上げます。

作業を人と AI で分けることで、効率よく、スピード感のあるコーディングができます。

ENVIRONMENT

Gulp × EJS × Sass の環境で
コーディングします

タスクランナーの Gulp で EJS と Sass(.scss)をコンパイルしてコーディングしています。画像の圧縮など自動化できるところは自動化し、効率よく進めます。

EJS

  • コンパイル
  • 整形
  • コメントの削除

Sass (.scss)

  • コンパイル
  • ベンダープレフィックスの付与
  • 圧縮

JavaScript

  • Babel で変換
  • 圧縮

画像 (jpg / png / gif / svg)

  • 圧縮
  • WebP 形式への変換

class 名は BEM 記法で

Sass の class の命名は BEM 記法(block__element--modifier)に沿って行います。誰が見ても理解しやすい class 名になるよう心がけています。

モジュール化は最低限、
デザインに忠実に

お預かりするデザインデータは会社様ごとに仕様がさまざまです。画一的なルールでモジュール化すると、デザインどおりにコーディングできず、かえって品質が下がることがあります。

そのためモジュールは最低限にし、基本はページごとに CSS を設定して、デザインにできるだけ忠実にコーディングすることを重視しています。

TECHNOLOGY

対応できる実装

スライダーカルーセルアコーディオンタブ切り替えライトボックススムーススクロールヘッダー固定ツールチップ1文字ずつ表示動画背景スクロールフェードインカウントアップGoogleMap埋め込みYouTube埋め込みマーキー

JavaScript や CSS のエフェクトは、追加料金なしで対応します。

VOICE

コーディングをご依頼いただいた
お客様の声

東京都のWeb制作会社様
コーディング案件をお願いしています!短納期のものも柔軟に対応いただけていたり、費用も他社と比べると格安&料金表があるため算出もしやすく大変助かっています。PCデザインしか作成できていないものも「いい感じ」にレスポンシブ化してくれたり、クオリティも高く大満足しています!
大阪府のWeb制作会社様
コロナ渦という状況もあるかと思いますが弊社へのWebサイト制作の依頼が急増している中企画、デザイン、コーディングなどの様々な工程の中で特にコーディングにおけるリソースが不足しておりました。複数の案件が重なった場合もしっかりと調整いただき納期、進行に関しても柔軟にご対応いただき大変感謝しております。
東京都のWeb制作会社様
いつもスピーディーで丁寧なご対応ありがとうございます。自社内のメンバーかのように柔軟に動いてくださるので大変助かります。今後ともよろしくお願いします!
FLOW

ご依頼の流れ

STEP 1

お見積り・ご相談

デザインデータの形式、ページ数、納期のご希望をお知らせください。データがまだ無い段階でもご相談いただけます。

STEP 2

お見積り

ページ数と実装内容から金額と納品日をご提示します。ご不明な点はオンライン相談でもお答えします。

STEP 3

データ入稿・着手

デザインデータと素材をご入稿いただき、コーディングに着手します。

STEP 4

確認・修正

確認用のURLをお渡しします。ご依頼の要件どおりに動作しない箇所は、回数を問わず修正します。

STEP 5

納品

データ一式を納品します。サーバーへのアップロードまでご希望の場合は、あわせて対応します。

FAQ

よくある質問

Adobe XD・Figma・Photoshop(PSD)・Illustrator(AI)に対応しています。Sketch など上記以外の形式は、事前にご相談ください。デザインデータが無く、コーディング済みのHTMLをお持ちの場合も、そのままWordPress化のご依頼として承ります。

最短3営業日で納品します。ページ数や実装する機能によって変動しますので、納期のご希望を添えてご相談いただければ、お見積りとあわせて納品日をご提示します。スタッフの手が足りない案件やお急ぎの案件もご相談ください。

承ります。ページ単位でのご依頼が可能です(レスポンシブ1ページ15,000円〜)。ただし、最低利用料金を50,000円とさせていただいています。既存サイトへのページ追加や、LP1枚のみといったご依頼も対応しています。

可能です。HTML/CSSのコーディングのみで納品します。反対に、コーディング済みのHTMLをご入稿いただき、WordPress化だけをご依頼いただくこともできます(データ調整費用 20,000円〜)。

レスポンシブの単価(1ページ15,000円〜)に含まれています。PC・タブレット・スマートフォンの表示に対応します。PCのみ・スマートフォンのみのコーディングは、1ページ7,000円〜の単価でお受けします。デザインデータがPCのみの場合は、スマートフォン時の見せ方をご相談のうえ進めます。

回数無制限です。ご依頼いただいた要件どおりに動作しない箇所は、回数を問わず対応します。仕様の追加・変更にあたる内容については、別途お見積りのうえ対応いたします。

以下の2種類に対応しています。

  • PayPalによるクレジットカード決済
  • 銀行振込 ── 請求書をお送りします。お支払いサイクルは「月末締めの、翌月末支払い」です。振込手数料はご負担をお願いしております。
COLUMN

費用と依頼の進め方

費用・相場

コーディング代行の単価相場|1ページいくらが妥当なのか

コーディング代行の単価は 1ページ 5,000円から 50,000円まで開きます。何が違って差が出るのか、単価だけで選ぶと何が起きるのかをまとめます。

発注・実務

HTML/CSSコーディングの外注・代行|費用の決まり方と、渡すデータ

デザインはできているのに、HTML/CSSに起こす手が足りない。コーディングだけを外注するときの範囲の切り分け、費用の決まり方、渡すデータの整え方、受け取ったコードの確かめ方をまとめます。

費用・相場

自社でやるか外注するか|コーディングを内製したときの本当の費用

外注費と社内の人件費を単純に比べると、内製のほうが安く見えます。実際に何が積み上がるのかを、時間に分けて見ます。

発注・実務

コーディング代行の依頼から納品までの流れ|どの段階で何が決まるのか

見積り、入稿、実装、確認、納品。それぞれの段階で発注側が決めることと、決め忘れると後で効いてくることを整理します。

費用・相場

制作の見積書の読み方|「一式」と書かれていたら確認すること

相見積もりで金額だけを並べても比べられません。見積書のどこを見れば、同じ条件で比べられるのかをまとめます。

発注・実務

コーディングの納品物には何が含まれるのか|受け取るべきファイルと権利

サイトが公開されれば終わり、ではありません。手元に残しておくべきファイルと、確認しておくべき権利関係を整理します。

SERVICES

WordPressとECサイトの制作、
まとめてご相談いただけます

WordPress

WordPress制作・構築代行

デザインデータやコーディング済みHTMLを、オリジナルテーマとして構築します。プラグイン開発も対応。

構築基本費用 50,000円

詳しく見る
コーディング

コーディング代行

デザインデータをHTML/CSSに起こします。WordPress化まで通しでも、コーディングだけでも承ります。

1ページ 15,000円〜

いま見ているページ
React

Reactコーディング代行

デザインデータをReactのコンポーネントとして実装します。既存アプリへの画面追加・UI改修だけでも承ります。

1ページ 18,000円〜

詳しく見る
Next.js

Next.js制作・コーディング代行

検索エンジンに読まれるHTMLを返せるNext.jsで構築します。静的書き出しでレンタルサーバーでも公開できます。

1ページ 18,000円〜

詳しく見る
EC / WordPress

WelcartでのECサイト構築

WordPress専用のネットショップ構築プラグイン。機能面まで踏み込んだカスタマイズができます。

デザイン制作+構築 一式 120万円〜

詳しく見る
EC / EC-CUBE

EC-CUBEでのECサイト構築

国産オープンソースのECパッケージ。決済・受注・在庫まわりを業務に合わせて作り込めます。

デザイン制作+構築 一式 120万円〜

詳しく見る
EC / ASPカート

ECサイト制作代行

Shopify・MakeShop・カラーミーなどのカートに、オリジナルデザインを組み込みます。

構築基本費用 100,000円

詳しく見る

デザインデータをお預けいただければ、
そのまま形にします

ページ数と納期のご希望をお知らせください。
お見積りとあわせて納品日をご提示します。

直近2週間の受付状況制作のリソース

10/19(月)〜10/23(金)残りわずか
10/26(月)〜10/30(金)余裕があります
Chatworkで相談する