Form 表單
概述
表單是一種用於蒐集使用者輸入資訊的複合型組件，通常包含多個輸入欄位 (Input Fields)、標籤 (Labels) 和提交按鈕 (Submit Button) 等。
使用時機
表單常用於以下情境：
- 註冊/登入：收集使用者帳號資訊。
- 聯絡我們：蒐集使用者聯絡資訊和留言。
- 問卷調查：蒐集使用者對特定問題的回答。
- 設定：讓使用者修改個人資料或偏好設定。
- 結帳：蒐集訂單資訊，如收貨地址、付款方式等。
使用規範
當您取用表單進行設計時，應考慮以下原則：
- 標題：提供簡潔、清晰的標題說明欄位用途，讓使用者一眼就能理解該輸入什麼資訊。
- 提示文字（選擇性）：在輸入欄位内以提示文字（Placeholder）方式提供輸入範例，幫助使用者理解輸入格式或預期的內容類型。當使用者開始輸入時，提示文字消失。
- 驗證訊息：在表單提交成功或失敗後，提供明確的回饋訊息。
- 提交按鈕：提供一個明確的提交按鈕，讓使用者知道如何提交表單。
- 進度指示器（選擇性）：如遇多步驟表單或涉及大量資料處理的表單，請考慮新增進度指示器，並將其放置在表單的頂部或明顯位置，讓使用者清楚知道目前所在步驟和剩余步驟，減少焦慮感。
設計範例
![]()
- 容器 (Container)：整體包裝表單的區域。
- 標題 (Headline)：為使用者提供清楚的表單概述。
- 說明文（選擇性）：提供額外說明或指導。
- 輸入欄位 (Input Field)：用於收集使用者輸入的文字、數字、日期等資訊。
- 標籤 (Label)：描述輸入欄位用途的文字。
- 輸入提示 (Placeholder)（選擇性）：在輸入欄位內顯示的提示文字。
- 輔助文字 (Supporting Text)（選擇性）：提供輸入欄位的額外說明或提示，例如驗證訊息。
- 提交按鈕 (Submit Button)：觸發表單提交的按鈕。
- 次要動作按鈕 (Secondary Action Button)：依規格需求與欄位設計而定，常見為重置、返回、取消操作按鈕。
