1. 首頁
2. 知識庫
3. Sharing AI 架站平台教學
4. 網站表單怎麼設計？欄位、感謝頁與通知設定

Sharing AI 架站平台教學

網站表單怎麼設計？欄位、感謝頁與通知設定

作者：JamXu更新日期：2026-10-09

先決定表單的任務：誰會來填、填完要發生什麼

多數網站的表單問題，不是欄位太醜，而是一開始就沒有想清楚「這張表單要完成哪件事」。同一張「聯絡我們」同時要收詢價、客訴、合作提案與求職，結果每個人都得填一堆和自己無關的欄位，收到的人也很難判斷該轉給誰。動手設計之前，先替每一張表單寫下三句話：誰會來填、他想得到什麼、我們收到後由誰在多久內處理。

這張表的最後一欄最常被忽略。如果寫不出「收到後由誰處理」，代表這張表單還不該上線：訪客送出後石沉大海，比沒有表單更傷信任。反過來，任務清楚之後，欄位、按鈕文字、感謝頁內容與通知對象幾乎都能直接推出來，後面每一節都是在把這三句話落實到畫面上。

欄位怎麼取捨：每多一個欄位，都要說得出理由

欄位數量沒有標準答案，但有一個簡單的判斷方式：逐欄問自己「如果沒有這個資訊，我們還能不能做出第一次回覆？」能的話，這個欄位就不必出現在第一張表單上，等到真正需要時再問。預算、公司規模、職稱、地址這些資訊，多數在第一次通話或回信時問更自然。

這不只是轉換率的問題，也和個人資料保護有關。依個人資料保護法第 5 條，個人資料的蒐集、處理或利用，不得逾越特定目的的必要範圍，並應與蒐集目的具有正當合理的關聯。換句話說，詢問表單問身分證字號、生日或住址，若與回覆詢問無關，就是多收了不需要的個資，也多了一份保管責任。以下說明以台灣法規為例，不構成法律意見；涉及特殊行業或敏感資料時，請另洽專業人士。

必填欄位要少，選填欄位要有意義

必填代表「沒有這一項，我們無法回覆」。常見的錯誤是把所有欄位都設成必填，訪客只好亂填一個電話或寫「無」，資料反而更不可靠。另一個錯誤是放了很多選填欄位卻沒人看，這些欄位只會讓表單變長。定期回頭看留言內容：如果某個選填欄位幾乎沒人填、填了也沒人用，就把它拿掉。

聯絡方式至少要有一種一定能回得到

回覆不到訪客，是表單最昂貴的失敗。Email 欄位要能檢查格式，電話欄位要提示是否需要區碼或分機。如果你的回覆方式主要是電話，就把電話設為必填，並在說明文字寫上「我們會在上班時間來電」；主要用 Email 回覆，就把 Email 設為必填，避免收到一筆只有 LINE ID、卻查不到人的留言。

欄位的寫法：標籤、說明文字、選項與錯誤訊息

欄位決定之後，接著是每一欄怎麼寫。表單是訪客和你之間的第一次對話，用字要像真人在問問題，而不是資料庫的欄位名稱。下面四個重點，同時兼顧填寫體驗與無障礙。

一、每個欄位都要有看得見的標籤

W3C 網頁無障礙倡議的表單標籤教學指出，文字欄、勾選框、單選鈕與下拉選單等每一個表單控制項都要提供標籤，標籤能幫助每一位使用者理解欄位用途。W3C 在表單說明的教學中也提醒，欄位裡的灰色提示文字（placeholder）不能取代標籤，螢幕閱讀器不會把它當作標籤，而且訪客一開始輸入，提示就消失了。所以「請輸入 Email」這類提示可以有，但欄位上方仍要有「Email」這個標籤。

二、必填怎麼標示，要先說清楚

多數表單用紅色星號標示必填。星號的意思要在表單開頭說明一次，例如「標示 * 的欄位為必填」，不要只靠顏色區分，色弱或用螢幕閱讀器的訪客可能看不出差別。格式要求也一樣：電話要不要加區碼、日期要用什麼格式，寫在標籤旁或欄位下方，而不是等訪客填錯才告訴他。

三、選項型欄位：選項要用訪客的語言

選項文字要用訪客的語言，而不是公司內部的分類。例如「我想做一個新網站」比「網站建置專案」容易懂；最後加上「其他」或「還不確定」，讓還沒想清楚的人也能送出。只能選一個且選項不多時用單選，可以複選時用勾選，選項很多（例如縣市）才用下拉選單；各類型在 Sharing 後台的對應方式，後文有一張對照表。

四、錯誤訊息要說明怎麼改

W3C 的表單驗證教學建議善用 HTML 內建的格式檢查，例如 Email 與日期，並提醒驗證也必須在伺服器端進行，不能只靠瀏覽器。對訪客來說，重要的是錯誤訊息的寫法：「Email 格式不正確，請確認是否少了 @」比「輸入錯誤」有用得多，而且訊息要出現在出錯的欄位旁邊，不要只在頁面最上方顯示一行紅字。送出失敗時，已經填好的內容不應該被清空。

輸入類型與自動填入

在可以自訂程式碼的情境下，Email 欄位使用 email 類型、電話欄位使用 tel 類型，手機會自動切換成適合的鍵盤；Google 的 web.dev 表單課程也說明，為欄位加上正確的 autocomplete 值，瀏覽器就能建議正確的已存資料，讓填寫更快、也減少記憶負擔。使用架站平台的內建表單時，這些通常由系統處理，你要做的是在手機上實際填一次，確認鍵盤與自動填入的表現符合預期。

手機上的表單：單欄排列、好點的按鈕與送出前的確認

詢問表單往往是在手機上填完的：訪客在通勤或午休時看到你的網站，順手留下聯絡方式。桌機上看起來整齊的雙欄表單，到了手機可能變成擠在一起的小框框。手機版的整體設計原則可以參考RWD 響應式網站為什麼重要，表單另外要特別注意以下幾件事。

• 單欄由上往下排列：視線只需要往下移動，不必左右來回找下一個欄位
• 欄位與按鈕要夠大：手指點得到，勾選框不要小到需要放大才點得中
• 選項文字不要太長：手機一行放不下時，勾選項會被擠成兩三行，難以分辨
• 送出按鈕寫出結果：用「送出諮詢需求」「預約這個時段」取代單純的「送出」
• 按鈕附近放一句回覆說明：例如「我們會在 1 個工作天內回覆」（請寫你真的做得到的時間）
• 表單前後不要有會蓋住欄位的浮動元件：聊天按鈕、Cookie 橫幅與固定列都要在手機上確認

位置也要一併考慮：除了獨立的聯絡頁，服務頁最下方也適合放表單，並在表單標題寫出服務名稱；全站的「免費諮詢」按鈕則一律連到同一個聯絡頁，方便日後統一維護。

個資告知與同意：表單旁邊要寫清楚的事

表單一定會收到個人資料，至少有姓名與聯絡方式。依 個人資料保護法第 8 條，直接向當事人蒐集個資時，應明確告知蒐集者名稱、蒐集目的、個資類別、利用的期間地區對象及方式、當事人可以行使的權利與方式，以及不提供時對其權益的影響。網站表單是最典型的「直接向當事人蒐集」，所以告知內容最好就放在表單旁邊或送出按鈕上方。

一段可以改寫使用的告知文字範例

以下是一般詢問表單的告知架構範例，請依你的實際狀況調整，不要原封不動照抄：「本表單由（公司名稱）蒐集您的姓名、聯絡方式與需求內容，僅用於回覆本次詢問與後續服務聯繫，資料保存於本公司系統，於處理完畢後依內部規定保存或刪除。您可以隨時來信查詢、更正或要求刪除您的資料。若未填寫必填欄位，我們將無法回覆您的詢問。」後面再連到網站的隱私權政策，讓想看細節的人找得到完整說明。

行銷訂閱要另外勾選

「回覆詢問」與「寄送電子報或活動訊息」是兩個不同的目的。如果想把留言者加入行銷名單，請另外放一個預設不勾選的選項，例如「我願意收到產品與活動資訊」，不要把它藏在告知文字裡、也不要預設打勾。這樣做對訪客透明，日後整理名單時也能清楚分辨誰同意過。

收到資料之後的保管同樣重要：只讓需要處理的人看得到留言、不要把含個資的留言截圖傳到群組、離職同仁的帳號要即時移除。AI 客服或其他自動化工具若也會接觸到表單資料，告知與保管的原則相同，AI 客服怎麼導入一文整理了轉真人時的個資告知與交接方式，可以一起參考。

在 Sharing AI 建立表單：表單管理的五個設定分頁

使用 Sharing AI 架站平台時，表單在後台左側的「表單管理」建立與維護，列表會顯示每張表單的名稱與欄位數，並可編輯或刪除。按「新增表單」或「編輯」後會開啟「編輯表單內容」視窗，左邊是五個設定分頁，右邊是即時預覽，改什麼都能馬上看到前台的樣子。

1. 基本資訊：填寫「表單標題」，也就是前台表單上方顯示的文字。用訪客看得懂的說法，例如「聯絡我們」或「預約免費諮詢」，而不是內部代號
2. 預設欄位：姓名、Email、手機三個基本聯絡欄位，各自可以選擇「顯示」或「隱藏」，以及「選填」或「必填」。依前文的原則，只把「沒有就無法回覆」的欄位設為必填，用不到的直接隱藏
3. 自訂欄位：從「欄位池」點選已建立過的欄位加入，或按「建立新欄位」填寫欄位名稱、欄位類型、提示文字與是否必填；已加入的欄位可以拖曳左側手柄調整顯示順序
4. 送出後動作：選擇送出成功後要「顯示訊息」還是「跳轉至網址」。選後者時，在「導向網址」填入你準備好的感謝頁完整網址
5. 外觀樣式：設定背景顏色、文字顏色、按鈕文字、按鈕顏色與按鈕文字顏色。顏色要確認文字和背景的對比足夠，按鈕文字寫出送出後的結果

自訂欄位的九種類型怎麼選

「建立新欄位」的欄位類型目前有九種。對照前文的原則，大致可以這樣選：

建立過的欄位會出現在欄位池，下次編輯表單時可以直接點選加入，不必重新建立。欄位名稱就是前台顯示的標籤，請用訪客看得懂的說法；「提示文字」則用來說明要填什麼或格式範例，但不要拿它取代欄位名稱。

把表單放到頁面上

表單建立好之後，還要放到頁面裡才會出現在前台。到「頁面管理」編輯要放表單的頁面，新增區塊時在「表單」類別選擇「立即填表（可自訂欄位）」，再選擇剛才建立的表單即可。同一張表單可以放在多個頁面，修改一次，各頁同步更新；如果你希望每個頁面的表單標題或選項不同，就建立不同的表單。

留言會到哪裡：留言管理的兩個分頁

訪客送出的內容，從後台右上角的留言圖示進入「留言管理」查看。這一頁分成兩個分頁：「表單留言」列出每一筆送出的資料，可以篩選、標示處理狀態（未處理／已處理）、匯出 Excel 或批量刪除；依 Sharing 官方的網站更新記錄，留言內容的欄位也開放編輯，方便後續補充或修正。另一個分頁「收件信箱」，就是設定通知信要寄給誰的地方。

在「收件信箱」按「新增信箱」，填入信箱地址與備註（例如「業務窗口」「職務代理人」），再選擇「接收哪些表單的留言」。不選的話會收到所有表單的留言，之後新增的表單也會自動包含；如果不同表單要交給不同窗口，就分別指定表單。留言管理裡的資料就是訪客的個資，請只讓需要處理的人看到，不要截圖外流，匯出的 Excel 檔也要妥善保管、用完刪除。

送出之後：顯示感謝訊息，還是導向感謝頁？

訪客按下送出的那一刻，最需要知道兩件事：「我送成功了嗎？」以及「接下來會怎樣？」送出後動作就是在回答這兩個問題。兩種做法各有適合的情境：

感謝頁要寫什麼

感謝頁不是只有「謝謝您的來信」一句話。它是訪客剛剛表達興趣、注意力最集中的時候，好的感謝頁至少包含以下內容：

• 確認已收到：明確說「我們已收到您的需求」，訪客才不會重複送出
• 回覆時間與方式：例如「1 個工作天內以 Email 或電話與您聯繫」，寫你真的做得到的時間
• 急件的備用管道：例如電話或 LINE 官方帳號，並註明服務時間
• 等待期間可以先看的內容：相關的教學文章、服務說明或常見問題
• 回到網站的路：保留選單與頁尾，讓訪客能繼續瀏覽

感謝頁不需要被搜尋到

感謝頁對搜尋者沒有獨立價值，從搜尋結果直接進來的人也沒有送出過表單，還可能讓轉換數據失真。建議把感謝頁設為不索引：在 Sharing 後台的頁面設定中，「SEO 基本設定」有「索引」選項，選擇 noindex 即可。依 Google 搜尋中心對 noindex 的說明，noindex 會讓 Google 不將該頁編入索引，但前提是不能同時用 robots.txt 封鎖這一頁，否則檢索器讀不到 noindex 規則，網址仍可能出現在搜尋結果中。感謝頁也不要放進主選單或頁尾連結，只讓表單送出後到達。

轉換追蹤：先把感謝頁準備好

用「到達感謝頁」計算表單轉換，是最直覺的做法：每一次到達代表一次成功送出。要做到這點，感謝頁的網址必須固定、只在送出後出現，而且不能被搜尋或其他連結帶進來，這也是前面建議不索引、不放選單的原因。至於在廣告平台或 GA4 中把它設成轉換、怎麼判讀名單品質，請參考數位廣告知識主題，Google 關鍵字廣告預算怎麼規劃也說明了為什麼要追蹤名單品質，而不只是點擊。

通知與回覆：讓每一筆留言都有人接

表單上線後最常見的問題，不是沒有人填，而是填了沒人看到。負責的同事請假、通知信被當成垃圾郵件、或是收件信箱是早已沒人登入的舊帳號，這些都會讓詢問默默流失。通知設定的目標很單純：每一筆留言都要在約定時間內，被一個確定的人看到並處理。

先決定誰收、誰回、多久回

通知信收不到時，先檢查這四件事

• 收件信箱的垃圾郵件與促銷分類：第一次收到通知時，把寄件者加入聯絡人或標記為非垃圾郵件
• 信箱是否還有人在用：離職、改名或停用的帳號，通知寄過去也沒有人看
• 公司信箱本身是否正常：剛換過網站或 DNS 時，先確認信箱的 MX 記錄沒有被誤刪
• 留言管理裡有沒有資料：留言管理有、信箱沒有，問題在通知；兩邊都沒有，問題在表單或頁面

第三點常發生在換網站或綁定網域的時候：清理 DNS 記錄時誤刪了公司信箱的 MX 記錄，網站正常、信卻收不到。自有網域怎麼綁定網站一文整理了哪些 DNS 記錄不能刪，以及網站與信箱同時中斷時怎麼排查。

不要只依賴通知信

通知信是提醒，不是唯一的紀錄。建議負責人每個工作日固定時間打開「留言管理」看一次，把已回覆的留言標成「已處理」；每月再整理留言數量、類型與回覆時間，作為調整欄位與人力的依據。

垃圾留言的基本防護（簡要）

只要表單公開在網路上，遲早會收到自動程式送出的廣告或亂碼留言。基本的防護是加上人機驗證：Google reCAPTCHA 的官方文件說明，v3 不需要使用者互動、以分數判斷互動是否可疑，v2 則是讓使用者勾選「我不是機器人」或在按下按鈕時才驗證；Cloudflare Turnstile 則是 Cloudflare 提供、不必讓訪客解題的驗證方式。在 Sharing AI 後台，「設定 → 基本」的「安全性」分頁有「表單送出驗證」，可以填入 Cloudflare Turnstile 的網站金鑰（Site Key）與私密金鑰（Secret Key）；依官方更新記錄，這項整合在 2026 年 4 月加入，用來加強表單防護。金鑰要先到 Cloudflare 申請，設定後記得實際送出一次表單，確認驗證正常、真正的訪客送得出去。

驗證服務的金鑰屬於帳號機密，設定時不要截圖或貼到群組。防護也不要做過頭：要求訪客回答很難的問題、或把每一欄都加上嚴格格式限制，擋下的往往是真正的客戶。若垃圾留言已經影響到日常處理，再依實際情況調整驗證方式。

上線前的表單測試：用一張清單走完整條流程

表單測試的重點，是從訪客按下送出，一路走到負責人回覆，確認每一個環節都有人、有東西。建議由不是設計表單的人來測，他比較容易發現說明不清楚的地方。

1. 用手機開啟每一個放了表單的頁面，確認表單完整顯示、沒有被浮動按鈕或橫幅遮住
2. 故意漏填必填欄位、把 Email 打錯，確認錯誤提示清楚、已填的內容沒有被清空
3. 正確填寫並送出，確認出現感謝訊息或正確跳轉到感謝頁
4. 到後台留言管理確認這筆資料完整，勾選的選項與文字都正確
5. 確認通知送到負責人與代理人手上，沒有落到垃圾郵件
6. 依約定的方式回覆這筆測試資料，計算從送出到回覆花了多久
7. 用電腦再走一次，並確認感謝頁沒有出現在選單、已設定不索引

表單只是上線檢查的其中一項。手機版、各頁標題描述、選單連結與公開設定，可以搭配用 Sharing AI 架站上線前的檢查清單一起確認；如果網站還在準備內容的階段，架站前要準備哪些品牌素材的公司資訊資料表裡，也有「表單通知要寄到哪個信箱」這一欄，可以先決定好。

上線後的每月檢查

常見錯誤對照表：看症狀找原因

下表整理表單上線後最常遇到的狀況，先對照症狀，再依建議調整。

對照後仍找不到原因時，把問題切成「頁面、表單、通知、回覆」四段，照上一節的測試清單逐段檢查，通常很快就能找到斷在哪裡。

下一步：讓表單成為穩定的詢問入口

把這篇的重點濃縮成一句話：先想清楚表單的任務與處理的人，只收必要的欄位並寫清楚個資用途，送出後明確告訴訪客接下來會發生什麼，再用測試與每月檢查確認整條流程一直暢通。表單不是做好就結束的元件，而是需要定期維護的詢問入口。

表單設定完成後，可以回到 Sharing AI 架站平台教學，接著規劃選單、頁面與行銷代碼。想先比較平台方案與功能，Sharing AI 架站平台介紹列出了各方案的差異；若希望由團隊協助規劃聯絡流程、表單與整體網站，也可以參考分享家的網站設計服務，或直接與我們聯絡。