ソファの商品ページで張地を見比べ、気になった布の見本を請求する。しかしフォームには「希望するサンプル」と住所欄しかなく、どのソファに使いたいかが残らない。担当者は見本を送れても、その製品に選べる張地なのか、希望が塗装色にもあるのかを確認し直すことになります。
家具製造・木工の事業者がサイトを見直すなら、見本を選ぶ画面と対象製品を切り離さないことが出発点です。この記事では、製品番号と見本番号をつなぐ受付票を設計例に、製品ページ、見本一覧、フォーム、受付後の案内をどうつなぐかを整理します。見本の対応、送付条件、在庫は自社の製品担当が確認するもので、この記事の番号や画面例は実在の製品を示しません。
製品ページから「その製品の見本」へ進める
最初に、今の商品ページを開き、塗装や張地の選択肢がどこにあるかを確認します。色名や布の写真が見えても、見本請求へのリンクが共通のお問い合わせページだけなら、製品との対応はそこで途切れます。ボタンの文言を「見本を請求する」へ変えるだけでは、次の画面に製品番号が引き継がれるかは分かりません。製品ページで選んだ候補を、申込みの確認画面まで追います。
同じ張地名でも、すべての製品や部位で選べるとは限りません。自社の仕様表を基に、製品ごとに選択可能な見本を表示するか、見本の詳細に対応する製品を示します。まだ適合を確定できない組合せなら「請求すれば選べる」と見せず、担当者へ確認する経路を用意します。見本を送付できることと、その仕様で製作できることは別の判断です。
みやあじよの家具製造・木工向け制作ページは、素材・仕上げの説明と写真、サンプルや展示へ進む導線を扱っています。本稿が具体化するのは、商品と見本の識別情報が、画面を移っても担当者の受付まで残るかという一点です。木目や色差をどう写真で見せるかは、別の無垢材家具の写真記事で扱われています。
製品と見本の番号を、一行ずつ対応させる
受付票を作る前に、製品担当から現行の製品番号、塗装見本、張地見本の一覧を受け取ります。見本番号が同じでも旧版と新版で材質や色名が変わるなら、その区別も必要です。Web担当が写真の見た目だけで番号を付け直したり、製品名から適合を推測したりしないようにします。
次の表は説明用の設計例です。F-204、UF-08、CT-12は架空の番号で、実在の家具や見本を表しません。見本の請求可否や製品への適合も、この例から判断できません。
表は左右にスクロールできます。
| 受付票の欄 | 記入例 | 自社で確認すること |
|---|---|---|
| 対象製品 | F-204/一人掛け椅子 | 現行の製品番号と商品ページ |
| 見たい部位 | 木部、座面 | その製品で選べる部位 |
| 塗装見本 | UF-08/木部用 | 製品・樹種との対応、見本の現行版 |
| 張地見本 | CT-12/座面用 | 製品・部位との対応、在庫 |
| 確認状態 | 送付前に担当者が対応を確認 | 自動で確定できる組合せと個別確認 |
| 受付後の案内 | 見本の可否と送付条件を返答 | 対応する担当、費用・件数・送付範囲 |
受付票では、塗装見本と張地見本を同じ「色番号」欄へ詰め込まない方が、担当者も依頼者も確認しやすくなります。商品ページで二つの見本を選べるなら、片方だけに戻っても製品番号を失わないことが重要です。複数製品を比較したい依頼者には、見本ごとに対象製品を一行にするか、各製品の候補を分けて表示します。一つの見本が複数製品に使える場合も、申込み上の対象を曖昧にしません。

メーカーの公式サイトにも、見本の見せ方は複数あります。冨士ファニチアのサンプル請求ページは張地と塗装を分類し、選択中の数と同社の請求条件を表示しています。マスターウォールのサンプルサービスは生地と木材を別の入口で案内しています。これらは各社の運用例です。無料の枚数、送付先、提供可否を自社サイトへそのまま転用するものではありません。
見本の写真には、番号と種別を文字でも添えます。布のアップ写真だけ、塗装した板の写真だけでは、何を請求するか分かりにくくなります。画面の色や照明は実物の見え方と異なる場合があるため、写真だけで仕上がりを確定させず、見本を手にして確認する目的を説明します。見本そのものと、完成した家具の木目や張り上がりも同一ではありません。どこまでを見本で確かめられ、最終仕様はどの段階で決めるかを、自社の販売手順に合わせて記載します。
見本一覧から入る人にも、対象製品を聞く
製品ページからの経路だけでなく、素材の一覧から色や質感を探す人もいます。その場合、見本を選んだ後に対象製品を尋ねる画面を用意します。商品番号が分かる人には検索や選択で指定してもらい、番号が分からない人には商品ページのURLや製品名を任意で伝えられるようにします。対象製品をまだ決めていない人向けの見本提供を受けるかは、自社の方針に合わせて明記します。
「張地CT-12」を選んだだけで、一覧にある全ての椅子へ使えると読ませないようにします。見本詳細には、材質や色名とともに、製品との対応をどこで確認できるかを示します。対応製品の一覧を表示するなら、その一覧が最新の仕様表と一致するかを製品担当が管理します。自動で絞り込む仕組みがなくても、受付票に対象製品と確認状態を残し、返信前に担当者が照合する方法を選べます。
カリモク家具の製品表示例では、品番、塗装色、張地、サイズが一つの行で示されています。参考になるのは、家具の識別情報と仕上げ・張地を一組で扱う点です。他社の品番の作り方や選べる組合せを自社の条件として利用するわけではありません。自社では製品の仕様表と見本台帳のどの項目が対応するかを先に決めます。
フォームで番号を保持し、分からない場合も止めない
製品ページから見本を選ぶときは、フォームに製品番号、製品名、見本種別と番号を引き継ぎ、送信前に確認できるようにします。隠れた値だけで担当者へ送ると、依頼者は誤った製品が入っていても気づけません。画面で見える形にし、修正が必要なら商品ページや見本一覧へ戻れるようにします。戻っても住所や選択済みの見本が消えないか、実際の動作で確認します。
手入力の番号欄を用意する場合は、何の番号かをラベルに書きます。「品番」とだけ示すと製品番号と見本番号が混ざります。例えば「製品番号(分かる場合)」「塗装見本番号」「張地見本番号」と分け、どこで番号を見つけられるか短く添えます。必須項目には必須と表示し、番号不明の人を受け付ける方針なら、送信時に必須エラーを出さないようにします。W3Cのフォーム案内も、入力に必要な説明を欄と結び付ける方法を示しています。
見本番号を大量の自由記入欄へ詰め込ませると、似た記号の読み違いや、色名だけの入力が起こり得ます。画面で選べる見本なら、選択肢の名称と番号を一緒に表示します。カタログや紙の見本帳から来る依頼者には手入力の経路も残し、読めない場合は見本帳名、ページ、色名などを分かる範囲で伝えられるようにします。自社で照合できない形式の番号を、そのまま確定した見本として扱わないことが大切です。

送付条件と返信を、製品の確認と同じ画面で伝える
見本を選べるページには、請求できる枚数、費用、送付範囲、発送までの確認方法を、自社の実際の条件で掲載します。無料か有料か、購入前の人も申し込めるか、法人向けと個人向けで違うかなどを、フォーム送信前に確認できる位置へ置きます。他社の無料サービスを見て来た人がいるとしても、自社の条件を推測させません。条件が変わる場合は、見本一覧とフォームの案内を同時に更新します。
送信完了画面や自動返信には、製品番号、選んだ見本番号と種別、受付日時を確認できるようにします。ただし送信できたことと、見本の在庫・適合・発送が確定したことは同じではありません。担当者が照合してから送る運用なら、「受付後に組合せと送付条件を確認して返答する」と実際の順序を示します。発送予定や納期を一律に約束する文言は、社内で確認できる場合に限ります。
希望した見本が終了していた場合、担当者が別の番号を黙って送る設計にしません。代替候補があるか、同じ製品に使えるか、色や材質の違いをどう説明するかを担当が確認し、依頼者に選び直してもらう流れを考えます。製品自体が廃番なら、見本一覧だけ残って請求を受け続けないよう、製品ページ、見本台帳、フォームの対象を一緒に見直します。
返答後は、見本を手にした人が、どの製品のどの部位を確かめていたかに戻れると役立ちます。受付メールや案内から商品ページへ戻す、展示品の確認先や担当者への相談を案内する、といった次の動きを自社の販売方法に合わせて決めます。見本を請求しただけで製品の仕様や注文が確定したように見せず、最終的な仕様と価格は別の確認段階で扱います。
一つの製品で通し、運用できる導線へ直す
改修の受入確認は、製品F-204のように一つの設計用例を決め、製品ページから塗装と張地を選んでフォームへ進むところから始めます。選択した番号が確認画面と担当者の受信内容に同じ形で残るか、途中で戻って選び直すと古い番号が消えるか、スマートフォンでも製品名を見失わないかを点検します。次に見本一覧から入る経路も試し、対象製品が未定のときの案内を確認します。
正常な組合せだけでなく、確認が必要な場合も試します。見本番号は現行だが対象製品に使えない、製品番号が旧版、二枚目の見本を選ぶと最初の見本が消える、といった条件です。画面が自動で判断できる条件なら理由を示して選び直せるようにし、個別確認が必要なら受付状態を「確認中」として担当へ渡します。送信できない理由を色だけで示したり、入力欄を初期化したりしないようにします。依頼者が見た番号と担当に届いた番号の一致までが、フォームの受入条件です。
受付担当の画面でも、一件の請求に製品番号と複数の見本番号が対応して表示されるか見ます。表計算へ出力する運用なら、塗装と張地が同じ列に結合されて照合しにくくなっていないか、製品を二つ選んだときにどの見本がどちらに属するか失われないかを確認します。Web上の表示が整っていても、担当が受け取るデータから関係が消えれば、申込み後に聞き直すことになります。
製品担当、見本を発送する担当、Web担当の間では、番号の変更や廃番を誰が伝えるかを決めます。画像だけ差し替えて旧番号を残すと、受付票の意味が崩れます。見本の追加、在庫切れ、対応製品の変更があった際に、商品ページと一覧、フォーム選択肢、自動返信を同じ更新案件として確認します。更新日と確認者を残せば、古いカタログからの請求にもどの資料を見たか照合できます。
最初から全製品の絞り込み機能を作る必要はありません。現在の製品と見本台帳で対応が確かめられる範囲を選び、番号を保った受付票と担当者の確認手順を先に整えます。どこまで自動表示し、どこから個別確認にするかを決めれば、Web制作へ依頼するページ、データ、フォームの範囲も具体的になります。
製品と見本を、一件の受付としてつなぐ
製品番号、塗装・張地の見本番号、確認状態をそろえると、見本を送る前に何を照合するかが見えます。みやあじよの家具製造・木工向けホームページ制作では、製品情報と素材の説明、見本・展示への導線、フォームや更新方法を相談できます。実際の対応製品、送付条件、担当分担は自社の資料で確かめてください。
参考にした公開情報
- みやあじよ:家具製造・木工向けホームページ制作:素材・仕上げとサンプル・展示をつなぐ制作範囲を確認。
- 冨士ファニチア:サンプル請求:張地と塗装の分類、選択中の件数、同社固有の請求条件を確認。
- マスターウォール:サンプルサービス:生地と木材の見本を別入口で案内する構成を確認。
- カリモク家具:製品表示例:品番、塗装色、張地と製品の対応を確認。
- W3C WAI:Form Instructions:番号入力と必須項目の説明を確認。
F-204、UF-08、CT-12は受付票の設計例です。見本の可否・費用・在庫・納期・製品への適合は、自社の製品・見本担当が確認してください。