聯絡頁是大多數網站最被忽略的一頁,也是最弔詭的一頁。你希望讀者能輕鬆找到你、願意主動聯絡,於是把 email、電話、地址全攤在頁面上;結果第一個來找你的不是客戶,而是整天灌垃圾訊息的機器人,信箱被釣魚連結和廣告淹沒,真正的詢問反而被埋掉。
問題出在多數人把聯絡頁設計想成兩件互相打架的事:「方便聯絡」和「防騷擾」。要嘛開大門讓所有人進來,要嘛築高牆把真人也擋在外面。其實這兩件事可以同時做好,關鍵在於哪些資訊該公開、用什麼形式公開,以及把過濾機制藏在讀者看不見的地方。
這篇會把聯絡頁設計拆成可執行的配置:該放哪些聯絡方式、表單欄位怎麼設計、入口要擺在網站哪裡,以及怎麼在不折磨真人的前提下擋掉垃圾訊息與信箱被爬蟲掃走的風險。
聯絡頁到底要替讀者解決什麼問題
聯絡頁的核心任務只有一個,就是讓有需求的人用最低的心理成本找到你並開口。它同時要扮演四個角色,缺一個都會讓轉換流失。
第一是好找。讀者通常是逛到某個產品或服務頁,臨時想問一句話,這時候他不會回首頁慢慢翻,而是期待在導覽列或頁尾立刻看到聯絡入口。
第二是好聯絡。不同讀者習慣不同管道,有人只信 email,有人偏好 LINE,企業採購可能還是要電話。把選擇權交給對方,而不是逼他用你方便的方式。
第三是可信任。對台灣讀者來說,一個只有表單、查不到實體地址也沒有公司名稱的聯絡頁,會讓人懷疑這是不是空殼網站。具體的地址、電話、營業時間本身就是信任訊號,也是 Google 判斷網站可信度的參考之一。
第四是可過濾。這是多數教學會跳過的一塊。聯絡頁不只是把詢問放進來,還要在源頭幫你分流:哪些是垃圾、哪些是該優先回的合作、哪些其實看常見問題就能自己解決。設計得好,你花在無效溝通上的時間會少一大半。
聯絡頁應該放哪些聯絡方式
一個完整的聯絡頁通常會同時提供多種管道,因為你無法預測下一個來訪者習慣用哪一種。但「多」不代表全部攤平塞滿,而是依照你的經營型態挑選主次。
- 聯絡表單:最常見也最該有的形式。它讓讀者不用打開自己的信箱就能寄訊息給你,同時你可以透過欄位設計,在對方送出前就引導他把問題講清楚。表單也是最容易加上防騷擾機制的管道。
- 電子郵件:即使有了表單,仍建議保留一個 email。萬一表單故障,email 是讀者重新聯絡你的備案;多一個管道也讓對方覺得比較安心。後面會談到 email 該怎麼放才不會被爬蟲掃走。
- 電話與營業時間:服務型或在地店家尤其需要。標上可撥打的時段,避免讀者在打烊時間白打一通。企業官網即使主要靠 email,電話仍是建立信任的元素。
- LINE 官方帳號:在台灣是極高效的管道。比起信件的距離感,對話框讓溝通更輕鬆,還能順勢收集名單、未來推播服務資訊。放一個加入按鈕即可。
- 社群連結:如果你同時經營 Facebook、Instagram 等平台,把連結整合進來,讓讀者用他習慣的平台找你。建議設定成新分頁開啟,避免他不小心離開你的網站。
- 實體地址與地圖:有實際據點就值得嵌入 Google 地圖。多數人找地點會直覺打開地圖,把地圖直接放在頁面上,讀者可以一點就導航。沒有店面的個人或工作室,至少標明所在城市,也比完全留白讓人安心。
- 預期回覆時間:這一句話常被忽略,卻很關鍵。寫上「我們會在兩個工作天內回覆」,讀者就知道這不是石沉大海,超過時間他還能換管道再找你。
不必每個網站都把上面全放上。部落格或個人經營,email 加社群連結就夠直接;服務型公司則適合表單搭配 LINE 與地址。先想清楚你的讀者是誰、會用哪種方式找你,再決定主打哪一兩個管道。
聯絡表單的欄位該怎麼設計才不會嚇跑讀者
表單欄位越多,填完的人就越少。這是聯絡頁設計最常見的失誤,也是降低騷擾與提高轉換之間最微妙的平衡點:欄位太少擋不住亂填,欄位太多連認真的讀者都懶得填。
原則是只留下能幫你理解對方問題的欄位。一個堪用的基礎表單通常是這幾項:
- 姓名:知道怎麼稱呼對方。
- 電子郵件或電話:你回得到對方的聯絡方式,這是必填核心。
- 訊息內容:讓對方自由描述需求的開放欄位,問題描述得越清楚,你回覆得越快越準。
如果你想在源頭做分流,可以多放一兩個結構化欄位,但要用低門檻的形式。例如用下拉選單讓對方選「諮詢項目」或「服務類型」,比起要他打字回答負擔小得多;服務型網站還可以加一題「從哪裡得知本站」,順便累積行銷來源的資料。重點是這些欄位設成選填或用選單,不要變成一道道問答把人勸退。
幾個實務上能同時減少無效詢問又不傷體驗的做法:
- 必填欄位克制使用:只把真正回覆所需的設成必填,其他留選填。被一堆紅色星號逼問的讀者很容易直接關掉。
- 欄位附上提示文字:在輸入框內放灰色提示,告訴對方這格該填什麼,減少填錯與來回確認。
- 送出後給確認頁或確認信:讓對方知道訊息已寄出、預計多久回覆。一封自動確認信就能大幅降低「你有沒有收到」的重複追問。
別忘了表單做好後一定要自己測一次。WordPress 的主機常因為郵件設定不良,讓表單信件進了垃圾匣甚至完全沒寄出,你以為沒人來信,其實是詢問全卡在半路。送一筆測試訊息,確認寄件者、主旨正常,而且信確實進到收件匣,再正式上線。
聯絡頁的入口要放在網站的哪些位置
讀者找不到聯絡方式,再精美的聯絡頁都是白費。聯絡入口不該只存在於那一頁,而要在網站的幾個固定位置同時出現,讓人在任何情境下都能順手找到。
導覽列是第一個該放的地方。它是讀者下意識會掃視的區域,「聯絡我們」放在主選單,等於告訴一進站就想合作的人「入口在這」。頁尾是第二個,讀者瀏覽到頁面最底端、看完內容正想行動時,頁尾的聯絡資訊讓他不必再往上滑去找。
除了獨立的聯絡頁,許多網站還會在首頁、關於頁、產品頁的最下方放一個簡短的聯絡區塊。這跟獨立聯絡頁的目的不同:每頁底部的聯絡區塊接住的是「邊看邊產生興趣」的讀者,讓他當下就能行動;獨立聯絡頁則服務「一進站就確定要找你」的人,他會直接點導覽列過去。兩者並存不衝突,反而覆蓋了不同的瀏覽情境。
要避免的是另一個極端:把聯絡入口藏在三層選單底下,或只在某一頁出現。入口越難找,讀者放棄的機率越高,這時候你少掉的不是騷擾,而是真正的生意。
怎麼降低垃圾訊息又不折磨真人讀者
聯絡頁一上線,幾小時內就會有自動化腳本開始掃描你的輸入欄位,灌進假網址、釣魚連結和一堆亂碼。這些機器人不是針對你,而是無差別掃遍全網沒有防護的表單。處理它的核心思路是:在背景確認對方是真人,而不是丟一堆關卡給所有人。
最該避免的反而是傳統圖形驗證碼。要訪客辨認紅綠燈、看模糊扭曲的字,會實實在在地拉低填寫完成率,把真人讀者也一起擋掉。現在的主流是讓驗證在背景悄悄完成,以下幾種可以分層疊加使用。
- 蜜罐欄位(honeypot):在表單裡藏一個用 CSS 隱藏、真人看不到的欄位。真人不會填它,機器人卻會把頁面上每個欄位都填滿,一碰到這個隱藏欄位,系統就自動擋下這筆送出。零摩擦,是公開表單最划算的第一層防線。
- 最短填寫時間:機器人是用毫秒填完表單的,真人至少要花幾秒讀欄位、打字。把門檻設成三到四秒,任何送出太快的提交都直接判為機器人擋掉。
- 背景式驗證:Cloudflare Turnstile 與 Google reCAPTCHA v3 都屬於不需要使用者動手的驗證。它們在背景觀察行為、給出風險分數,可疑的才攔下。Turnstile 免費且隱私友善,是目前很受推薦的選擇;reCAPTCHA v3 則是另一個成熟方案。
- 反垃圾外掛:Akismet、CleanTalk、Antispam Bee 這類外掛把你的表單接上全球垃圾訊息資料庫,集中過濾而不是逐個表單設規則。其中部分外掛會在訊息進到你的資料庫前就在遠端先擋掉,省下伺服器資源;若在意個資外流,可選擇資料留在本地處理的方案。
- 關鍵字與拋棄式信箱過濾:垃圾訊息常有固定模式,可以把特定字眼或可疑網址列入黑名單直接擋。機器人也常用 @mail.ru、@yopmail.com 這類拋棄式信箱來騙過驗證,把這些網域加進拒絕清單,能在欄位層級就攔住。
實務上不必每一種都裝。一般部落格或小型網站,蜜罐加背景式驗證再搭一個反垃圾外掛,三層下來就能擋掉絕大多數自動化垃圾,而真人讀者全程無感。若流量大、被攻擊得兇,再考慮把防禦拉到伺服器或 CDN 層,在連線到達表單之前就擋掉惡意流量。
email 直接貼在頁面上會被機器人撈走嗎
會。把純文字的 email 或 mailto 連結直接攤在聯絡頁上,等於對爬蟲發出邀請。專門掃信箱的機器人會把你的地址抓走、丟進垃圾郵件名單,之後你收到的廣告信只會越來越多。這也是為什麼很多人公開信箱後,垃圾信突然暴增。
降低被掃的風險有幾個層次。最直接的是用聯絡表單代替公開信箱,讀者透過表單寄信,你的真實地址從頭到尾不出現在頁面原始碼裡,爬蟲自然抓不到。如果基於信任考量還是想露出 email,可以做混淆處理,例如把地址寫成圖片、用 JavaScript 動態組合,或寫成「name [at] example [dot] com」這種人看得懂、簡單腳本抓不準的格式。部分 CDN 服務也提供信箱混淆功能,會自動把頁面上的 email 隱藏起來,擋掉爬蟲收割。
取捨在於便利與防護之間。完全用表單最安全,但少了一個讓讀者複製貼上、用自己信箱寄信的選項;露出 email 最方便,但要承擔被掃的代價。比較平衡的配置是:主推表單,同時放一個經過混淆或圖片化的 email 當備案,兼顧安心感與防護。
收集個人資料時別忽略的信任與合規
聯絡表單一旦收集姓名、電話、email,你蒐集的就是個人資料,這在台灣受《個人資料保護法》規範。聯絡頁設計除了好看好用,也要在這一塊站得住腳,否則信任反而會扣分。
把握三個原則就能避開多數問題。第一是蒐集最小化,只要回覆所需的欄位,不要順手多問用不到的個資,問越多對方戒心越重,你也多扛保管責任。第二是說明用途,在表單附近用一句話講清楚這些資料會用來做什麼、會不會用於行銷,必要時連結到隱私權政策。第三是行銷同意要明確,如果你想順便邀請對方加入電子報,那個勾選框預設一定要是未勾選,由對方主動勾選才算數,不能替他預設打勾,這也是國際上對明確同意的共同要求。
這些做法看似是合規義務,實際上都在強化讀者對你的信任。一個願意把資料用途講清楚、不亂蒐集的網站,讀者填表單時自然更安心,願意留下真實聯絡方式的比例也更高。
把好找與防騷擾收在同一張頁面上
聯絡頁設計的高下,不在於版面多漂亮,而在於它有沒有同時做到兩件看似衝突的事:讓真正想找你的人毫不費力就找到並開口,同時讓機器人和騷擾在進門前就被悄悄過濾掉。多數網站只顧其中一邊,不是入口藏太深沒人找得到,就是大門洞開被垃圾淹沒。
要兩邊兼顧,配置其實很清楚:依讀者習慣挑一兩個主打管道、把入口放在導覽列與頁尾、表單只留必要欄位並附上預期回覆時間、防騷擾全用背景式機制不折磨真人、email 用表單或混淆來擋爬蟲、收集個資守住最小化與明確同意。
現在就打開你的聯絡頁,用讀者的角度走一遍:三秒內找得到入口嗎?填表單會不會嫌麻煩?再用經營者的角度看,垃圾訊息有沒有被擋在外面?哪一項還沒做到,就從那一項開始補。