スマートフォン用のロゴ パソコン用のロゴ

崩れない、コーディングを。
scroll

もうコーディングで、
悩むことはありません。

色、フォント、サイズ、余白、配置などが再現されていない
画面幅を縮めたとき、広げたときのデザインが崩れている
見出しが2行になったときに、行間が広すぎる
アニメーションが、指示書とは違う動きをする
画像のサイズが大きすぎて、適切に圧縮されていない
スマホの入力フォームをタップすると、ページ全体が拡大されてしまう

advantages
bf coding
強み

崩れない、バグのない、
デザイン通りのコーディングを。

50個以上の項目でくまなくチェック!
信頼できる安全性の高い
コーディングを。

システムエンジニアの経験を活かして漏れがないよう考えたチェックシートを作成し、その項目にそってコードチェックを行います。 Webサイト制作の基本的なチェック項目の他に、システムエンジニア目線から考えた項目も追加しているため、安全性の高いコードを納品することができます。

デザインがすべて揃っていなくても対応
が可能!

デザイナーの意図を汲み取った
コーディングを。

  • デザインカンプが片方しかなくても対応可能!
  • アニメーションの細かな指示がなくても対応可能!
  • レスポンシブの明確なイメージがなくても対応可能!

このサイトのデザインも構成から考え制作しました。普段からデザインカンプ制作も行っているため、デザイナーの意図を汲み取ったコーディングをすることができます。

service
bf coding
できること

html・css

Sass対応

JavaScript
jQuery

SEO対策

PHP
フォーム

WordPress
対応

既存サイト
の改修対応

PCデザイン
のみの対応

SPデザイン
のみの対応

price
コーディング
料金&納期

新規制作(レスポンシブ対応)

Webサイト(複数ページ)
最短5
トップページ
入稿デザイン:
PC + SP
10,000円〜
入稿デザイン:
PC または SP
15,000円〜
下層ページ
入稿デザイン:
PC + SP
5,000円〜
入稿デザイン:
PC または SP
10,000円〜
LP(ランディングページ)
最短3
LP(ランディングページ)
入稿デザイン:
PC + SP
10,000円〜
入稿デザイン:
PC または SP
15,000円〜

PCまたはスマホのデザインデータのみの場合、もう片方のデザインをおまかせとなります。後から修正を行う場合、料金が発生することを予めご了承ください。

アニメーション数やページ数、他案件次第によって納期が延びる場合があります。ご了承ください。

既存サイトの改修、
コンテンツ追加・変更

既存サイトの
コーディングチェック
最短1
10,000円〜

チェックシートを用いて、正しいコーディングになっているかをチェックします。

既存サイトの
コーディング改修
最短2
30,000円〜

チェックシートで明らかになった問題点や、複雑になりすぎて収拾がつかなくなってしまっているコードを改修します。

既存サイトへの
コンテンツの追加・変更
最短2
10,000円〜

すでにあるコーディング規則にそって、コンテンツの追加・変更します。

アニメーション数やページ数、他案件次第によって納期が延びる場合があります。ご了承ください。

追加オプション

JavaScript・jQuery

1箇所 / 5,000円〜

スライドショー
(スライダー)

複数のスライドを順番に表示させることができます。

カルーセル
スライダー

横にスクロールするスライドギャラリーの一種です。

アコーディオン

項目をクリックしすることで、詳細を表示することができます。

タブ切り替え

タブをクリックすることでページ内の表示を切り替えます。

ライトボックス

サムネイル画像を拡大表示します。

スムース
スクロール

スクロールによる表示枠の移動処理を、滑らかに行えます。

ツールチップ

マウスオーバーした際に、補足情報が表示されます。

モーダル
ウィンドウ

元のウィンドウの上に別枠でウィンドウを表示します。

お問い合わせフォーム
35,000円〜

ホームページを閲覧しているユーザーのお問い合わせを受け付ける目的で設置するWebフォームのことです。

WordPress対応
100,000円〜

静的サイトをWordPressの管理画面使って更新できるサイトにすることができます。

flow
ご注文から
納品までの流れ

の番号がお客様フローになります。
step - 01

お見積もり依頼・お問い合わせ

まずはお見積りフォームより、スケジュールやページ数などご要望を記載の上、お気軽にお問い合わせください。

お問い合わせいただいてから、1~2営業日以内にご登録いただいたメールアドレスにご連絡をさせていただきます

step - 02
デザインカンプがある場合
データ入稿

各種デザインカンプ(Photoshop / Illustrator / Adobe XD / Figma 等)に対応しています。
コーディングに関してご指示がありましたら、指示書も併せてご入稿ください。

デザインカンプがない場合
打ち合わせ

オンラインでお打ち合わせをさせていただきます。その際、スケジュールや細かいご要望もお伝えください。
可能であれば、打ち合わせ時におおよそのボリュームが分かるようなデザインカンプ(jpgで構いません)をご提示ください。

step - 03

お見積りのご提示

デザインを確認させていただき、お見積金額をご提示させていただきます。
デザインカンプがない場合は、概算でご提示いたします。

step - 04

コーディング開始

デザインカンプの支給後、コーディングを開始いたします。
デザインが全て揃っていない場合は、進められそうなところから着手いたします。

step - 05

コードチェック

BF CODING独自のチェックシートにそってコードチェックを行います。
またチェックが完了したシートをお客様にもお渡しいたします。

step - 06

テストサーバーで確認

テストサーバーにて内容をご確認いただけます。
万が一、相違点や修正が必要な箇所があった場合はお問い合わせください。直ちに修正いたします。利用料は無料です。

step - 07

納品

完成したファイルを圧縮ファイルで納品いたします。納品したコーディングに不備がなければ、完了のご連絡をお送りください。
確認完了のご連絡をもって、納品完了とさせていただきます。

about me
私について

コーダー
河田 真吾
kawata shingo

大学卒業後、ソフトウェア開発の企業でシステムエンジニアを経験し、現在はフリーランスでコーダーとして活動しております。

趣味:カメラ、漫画、古着屋巡り

faq
よくある質問

  • 依頼前に打ち合わせは可能ですか?

    可能です。

    「結構短い納期なんだけどできる?」といった疑問点がある場合、制作の際のトラブルの元になってしまいます。そのため、発注いただく前からオンラインで打ち合わせを行うことができます。

  • レスポンシブデザインのコーディングはお願いできますか?

    レスポンシブデザインのコーディングも可能です。

    スマホのサイズ幅のブレイクポイントになったときにレイアウトを切り替える等の要望に合わせて、そのままコーディングを行えます。
    PC・タブレット・スマホと切り替える幅の指示があれば、そちらも対応することが可能です。

  • ランディングページのコーディングはお願いできますか?

    ランディングページのコーディングも可能です。

    ランディングページでは、制作する商品やキャンペーンをより魅力的に表現するために、アニメーションを利用することがあるかと思います。
    そのようなご要望があった場合でも、まずはお気軽にご相談くださいませ。

  • PCのデザインしかないのですか、スマホにも対応できますか?

    対応できます。

    ただしデザインがない場合、コーディング後の確認 → 修正のやりとりが通常より多く発生すると予想されるため、別途費用を頂く場合がございます。

contact
お問い合わせ

お急ぎの方、
コーディング代行を依頼したい方
まずはオンラインで相談したい方
※現在利用不可