カンプまでは、御社で。
実装は、こちらで。
コーディング・動きの実装・改修を、工程単位で。
デザインから公開までの、まるごとのご依頼もお受けします。
- トップの実装28,000円〜
- 納期の目安4営業日〜
- お返事3営業日以内
税込・レスポンシブ込み。下層1枚 7,500円〜。横浜・神奈川なら伺います(横浜市内は交通費なし)。
エンドクライアント様とは、直接お取引しません。外部への再委託もしません。
ご依頼の形2つからお選びください
1カンプまでは御社で、実装はこちらでコーディング・動きの実装・改修。トップ28,000円から 2ホームページまるごとデザインから実装・公開まで一式。デザインは代表デザイナー。お見積りどちらも、ラフな段階で送ってください。
よくいただくご相談
こんなとき、
声をかけてください。
制作会社・デザイン事務所の方から、実際によく伺うことです。
- カンプは社内で作れる。コーディングと実装の手が足りない紙やパッケージが本業で、Webの仕事が重なる時期だけ、手を借りたい。
- 動きの実装まで、社内の手が回らないスクロールで順に出す、線を描く、数字を数える。カンプの意図どおりに動かすところまで。
- 改修が細切れで、常に人を置くほどではない1ページの追加や、ボタン1つの修正から、工程ごとに出したい。
- 今の外注先が埋まっていて、別の受け皿がほしい繁忙期だけ、1件だけでも。
- 打ち合わせは、顔を合わせてしたい横浜・神奈川なら、事務所に来てほしい。
- nysデザイン工程の一部だけで、構いません。小さな仕事も、条件は同じです。横浜・神奈川なら伺います(横浜市内は交通費なし)。条件と仕様は、このページに先に全部書いています。単価と足し算を見る
お受けする形 ① ・動きの実装まで
カンプに書いた指示を、
そのまま動きに。
動きは、カンプだけでは伝わりにくいところです。この見本は、カンプに書き込んだ3つの指示を、そのまま組んだものです。「もう一度動かす」を押すと、最初から動きます。
組める動きの例
- スクロールで、順に出す
- 線を描く・道すじに沿って進む
- 数字を数える・前と後を比べる
- ピン留め・視差・コマ送り
- WebGL の面(このページのいちばん上)
制作会社の案件では、GSAP(ScrollTrigger など)でも書きます。ご指定がなければ、素の JavaScript で軽く書きます。このサイトの動きは、自作の JavaScript だけで、gzip で実測 5KBです(表示のたびに実物を圧縮して測っています)。
作り込んだ動きの見本 5本(GSAP で組んでいます・お店と商品は架空です)
カンプ見本の焙煎所・トップ(架空のお店です)
港の焙煎所
朝の一杯を、港のそばで。
- 浅煎り
- 中煎り
- 深煎り
- 見出しは1行ずつ、下から
- 豆の3枚は、左から順に
- 見えたら、駅からお店へ線を描く
実物
どれも、公開中の
本物のサイトです。
サイトの制作と改修をあわせて、100件以上を手がけてきました。そのうち、いま公開中で、担当した範囲をはっきり書けるものを並べています。デザインだけ、コーディングだけの仕事は、そのとおりに書いています。
コーディング・構築5件
御社からお受けした案件は、許可をいただいたものだけをここに載せます。ご指示がなければ、載せません。
お受けする形 ②
ホームページを、
まるごとでも。
佐藤 のりこ代表・デザイナー
代表デザイナーの佐藤 のりこは、いまWebの制作に力を入れています。デザインから実装・公開まで、2人で一式お受けします。ECサイトの運営を7年経験してからWebデザイナーになったので、LP(1ページの紹介サイト)や通販の「買うまでの道すじ」を、運営する側の目で組みます。
Webの案件が重なる時期に、1件まるごとお預けいただけます。金額は、内容を伺ってお見積りします。
お受けする単位
一部の工程だけで、
構いません。
| 単位 | いただくもの | お返しするもの |
|---|---|---|
| 実装のみ | デザインデータと素材一式Figma/XD/Illustrator/Photoshop のどれでも | HTML/CSS/JS 一式(レスポンシブ込み)19種類の検査の結果を添えます |
| 動きの実装のみ | どこで・何が・どう動くかのメモ参考のURL・手描きのラフ・カンプへの書き込みで構いません | 組み込んだコード足したバイト数・レイアウトのずれ(CLS)の実測・確かめた端末を添えます |
| 改修・追加 | 対象サイトのファイル一式またはサーバーの情報 | 変えたファイルと、変えた点の一覧差分が追える形で |
| まるごとデザインから公開まで | 目的・原稿・参考のサイトラフや構成案があれば、それも | 公開まで一式(デザインは代表デザイナーの佐藤 のりこ)デザインデータもお渡しします。金額はお見積り |
WordPress のテーマ実装もお受けします(別途お見積り)。進行はメール・Chatwork・Slack のどれでも。納品の形は、ファイル一式・Git・サーバーへの反映からお選びください。
単価
見積りの前に、
足し算で分かります。
| トップページの実装 | 28,000円から |
|---|---|
| 下層ページ1枚 | 7,500円から |
| LP 1本(最初の画面+5段) | 36,000円から |
| 動きの追加 1か所 | 6,000円から |
- レスポンシブ対応を含みます
- WordPress のテーマ実装は別途お見積りします
- 19種類の検査結果とレポートを添えます
- 「から」は分量と仕様による幅です。デザインデータを拝見して、確定のお見積りを3営業日以内にお出しします(有効期限30日)。
| LP 1本(最初の画面+5段) | 4営業日 |
|---|---|
| トップページだけ | 4営業日 |
| トップ+下層5枚 | 6営業日 |
| 下層をさらに足す | 5枚ごとに+2営業日 |
| 動きを足す | 何か所でもまとめて+1営業日 |
| 修正(いただいた指摘の反映) | 3営業日 |
- データがそろって着手してから、初回の納品までの目安です。土日祝は数えません。
- 同時にお受けするのは2件までです。いまの空きは、お問い合わせのときにお答えします。
概算の足し算(例)
6ページ・動き7か所のサイト
トップページの実装28,000円 × 1 28,000円
下層ページ7,500円 × 5 37,500円
動きの追加6,000円 × 7 42,000円
合計107,500円から税込
すべて単価の「から」で足した、いちばん小さい額です。デザインデータを拝見してから確定します。
取引の条件
聞かれる前に、
先に書いておきます。
発注のご判断に要ることを、ここにまとめています。ここにないことは、案件の概要と一緒にお尋ねください。
- 秘密保持
- ご依頼があること自体を含めて、口外しません。NDA のご用意があれば締結します。無い場合も同じ基準で扱います。
- 実績への掲載
- ご指示がなければ、載せません。御社名・案件名・成果物は、許可をいただいたものだけを載せます。
- 直接のお取引
- エンドクライアント様とは直接お取引しません。お問い合わせをいただいた場合も、御社をご案内します。
- 再委託
- 外部には出しません。作業するのは事務所の2人だけです(コーディング=吉田 力/デザイン=佐藤 のりこ)。
- 打ち合わせ
- オンラインでも、対面でも。横浜・神奈川なら、事務所に伺います。横浜市内は交通費なし、それ以外の県内は実費です。事務所は神奈川県横浜市磯子区です。
- お支払い
- 月末締め・翌月末払いでお願いしています。御社のお支払いの規定があれば、ご相談ください。
- 納品後の不具合
- こちらのミスによる不具合は、納品後30日以内なら無償で直します。仕様の変更・追加は別にお見積りします。
- 請求書・見積書
- 書面(PDF)でお出しします。税抜の表記でも発行できます(社内の起票用)。適格請求書の登録番号 T3810256466908
- 続けられなくなったとき
- 着手済みの案件は、その時点までのデータと引き継ぎのメモをお渡しして精算します。御社の手元で、そのまま続けられる形にしてお返しします。
- お受けしない案件
- エンドクライアント様と直接のやり取りが要る案件/制作を伴わない保守だけの引き継ぎ/納期まで4営業日を切っている案件
19種類の検査の全項目と、レポートの実物を見る押すと開きます
- ページが開くか
- 文字コード・言語・viewport
- title と description
- title・description の重複
- h1
- 見出しの階層
- 画像の alt・寸法指定
- 画像の実寸と指定の照合(Retinaの2倍は正常)
- 内部リンク
- canonical
- OGP
- 構造化データ
- 検索避け(noindex)
- https の中の http
- 禁止語・書きかけの跡
- ページの重さ(転送量)
- 画像の改善余地(実際に変換して測る)
- コントラスト(CSSの色指定を機械的に見る)
- メールが届く形か(SPF / DKIM / DMARC)
下は、このサイトのトップページを検査した出力そのままです(手を入れていません)。末尾の「手でやること」まで含めて、この形でお渡しします。
webcheck https://nys-d.com
ページの集め方: --paths で指定(1件)
1. ページが開くか
✓ 1 / 1 ページが 200
2. 文字コード・言語・viewport
✓ lang / charset / viewport すべてあり
3. title と description
✓ title と description は全ページにあり
4. title・description の重複
✓ 重複なし
5. h1
✓ 全ページ h1 は1つ・文字あり
6. 見出しの階層
✓ 飛びなし
7. 画像の alt・寸法指定
✓ alt・width/height すべてあり
8. 画像の実寸と指定の照合(Retinaの2倍は正常)
✓ 照合した 6 枚は比率が一致
9. 内部リンク
✓ 内部リンク 14 本、切れなし
10. canonical
✓ canonical は全ページ自分自身を指している
11. OGP
✓ OGP の宣言と実体に食い違いなし
12. 構造化データ
✓ JSON-LD 1 件、すべて読める形
13. 検索避け(noindex)
✓ 本番で意図しない noindex は無し
14. https の中の http
✓ 混在なし
15. 禁止語・書きかけの跡
✓ 書きかけの跡は見つからず
16. ページの重さ(転送量)
✓ / 423 KB(HTML 8 / CSS 24 / JS 4 / 画像 386 KB)
! 上限を決めずに測っています(--budget=1500 のように付けると、超過を不合格にできます)
17. 画像の改善余地(実際に変換して測る)
✓ 6 枚を実際に変換して測定(いま 322 KB)
✓ 3割以上減らせる画像はありません(すでに最適化されています)
18. コントラスト(CSSの色指定を機械的に見る)
! body の色指定を CSS から読み取れませんでした(CSS変数や別の書き方の可能性。目視で確認してください)
✓ CSS 1 ファイルを読みました
19. メールが届く形か(SPF / DKIM / DMARC)
✓ 判定するドメイン: nys-d.com
✓ SPF あり
✓ DMARC あり(p=none = 様子見。まず1〜2週間レポートを見て、問題なければ quarantine へ)
✓ DKIM あり(セレクタ: default)
────────────────────────────────────────────────────
🔴 ここから先は手でやること(機械には見えません)
□ 1. CLS を測る(動きを実装した案件は必須)
Chrome で開く → DevTools → Performance タブ → リロードして記録 → CLS の値。0.1以下なら良好。1分
□ 2. W3C の構文検証
https://validator.w3.org/nu/ に URL を入れる。「実装のみ」の納品物として約束している項目
□ 3. 実機で見る
iPhone / Android の実機で1回。エミュレータでは出ない崩れがある
□ 4. alt の中身が合っているか
有無は機械が見ました。中身が画像と合っているかは人にしか分かりません
□ 5. 文章の事実確認
社名・電話番号・営業時間・金額。機械は「書いてあるか」しか見ていません
□ 6. 🔴 フォームから1通、実際に送って受信箱に届くか
項目19 は DNS を見ただけ。実際に届くかは送ってみないと分かりません。
🔴 受信箱か迷惑メールかまで見ること(送信は成功するので、届かなくても失敗ログに残りません)
□ 7. 🔴 迷惑メールフィルタのホワイトリスト
問い合わせの通知メールは「サイトのアドレス→サイトのアドレス」=自分から自分へ送る形が多く、
これはスパムの典型的な形なのでフィルタが真っ先に疑います。
🔴 サーバー側のフィルタを有効にするなら、そのアドレスをホワイトリストに入れること。
入れないと、お客様からの問い合わせが静かに消えます
────────────────────────────────────────────────────
検査 19 種類 / 対象 1 ページ / https://nys-d.com
見ていないもの: JS実行後の内容 / 表示速度そのもの / デザイン / 文章の正しさ / セキュリティ
✅ 合格(要確認 2 件)
- 案件の概要を送る種類・分量・希望の納期を。デザインデータがあれば、それも
- 可否とお見積り3営業日以内に、お受けできるか・金額・納期をお返しします
- 打ち合わせ要るときだけ。オンラインか、横浜・神奈川なら伺います(横浜市内は交通費なし)
- 制作・確認確認用のアドレスをお出しします。進行はメール・Chatwork・Slack のどれでも
- 納品・検収検査の結果を添えて。納品後30日は、こちらのミスなら無償で直します
よく確かめられること
見積りに要る情報は何ですか。
ページ数(またはデザインデータ)・レスポンシブの範囲・動きの有無・希望の納期の4つがあれば、概算をお出しできます。
Illustrator のデータからでも組めますか。
組めます。Figma・XD・Photoshop も同じです。書き出しの指定(画像の形式や大きさ)があれば、それに合わせます。
GSAP で書いてもらえますか。
はい。制作会社の案件では、ご指定があれば GSAP(ScrollTrigger など)で書きます。ご指定がなければ、素の JavaScript で書きます。あとから御社で直す前提なら、ふだんお使いのほうに合わせます。
検収はどのように進めますか。
確認用のアドレスをお出しします。ご指摘は回数ではなく期間(納品後30日)でお受けします。こちらのミスによる不具合は無償です。
WordPress は対応できますか。
テーマの実装をお受けします(別途お見積り)。それ以外の仕組みは、案件ごとにお返事します。
案件の概要を、
お送りください。
ラフな段階で構いません。可否とお見積りを、3営業日以内にお返しします。
フォームの「ご相談の内容」は「制作会社からのご依頼」を選んだ状態で開きます。
ホームページまるごとのご相談も、同じフォームからどうぞ。
神奈川県横浜市磯子区 / info@nys-d.com














