60 秒決策
先確認使用者要完成的事。
適合使用
- 內容能幫助使用者理解規則、避免常見錯誤或做出較好的選擇,但不需要立刻回應。
- 提示和附近內容有直接關係,使用者在那個位置閱讀時剛好需要它。
不適合使用
- 內容其實是剛發生的失敗、成功或緊急狀態,應使用適合的 Alert 或 Status Message。
- 提示與目前區塊沒有關係,只是想把更多資訊塞進頁面。
畫面要說清楚的事
不要只交代外觀,也要交代資料與輸入規則。
放在做決定之前
權限提示應出現在角色設定旁,而不是送出後才說使用者選錯。
內容像有用的旁註,不像廣告標語
一個清楚標題加上兩三句具體建議即可;不用誇張顏色或大圖示硬搶注意。
語意跟內容而定
Callout 沒有通用的 ARIA role;可用語意化 section 或 aside,別因為有框線就標成 alert。
必要狀態與回應
每個狀態都要讓使用者知道下一步。
正常閱讀
提示持續可讀,不會自動彈出、播音或搶走焦點。
有局部操作
若提供「標示已閱讀」等輕量控制,操作只改變提示本身,不中斷原本任務。
內容不再適用
規則改變或使用者已完成階段後,更新或移除提示,不留下過期建議。
需要正式說明
內容超過短提示時,連到完整說明頁,別把 Callout 堆成小型文件。
操作 Demo
先知道要觀察什麼,再動手操作。
操作前先知道
最小權限提醒
先觀察:Callout 是否提供角色設定前剛好需要的建議,而不是把它標成錯誤或緊急通知。
操作:點選「標示已閱讀」,確認只更新這塊提示的回饋。
預期結果:提示保留在角色設定旁;標示已閱讀後有文字回饋,背景設定仍可繼續完成。
告訴 AI
把任務、規則、狀態與操作條件一次寫清楚。
在 LumenDesk 的成員角色設定旁加入 Callout,標題為「先從最小權限開始」,說明新成員預設使用檢視者角色,需要時再提高權限。Callout 放在角色說明旁,內容以教學與建議為主,不使用 role="alert",也不要做成會自行消失的 Toast。若提供「標示已閱讀」操作,按下後只更新這個局部提示,不中斷使用者繼續設定。驗收清單
不要只確認欄位能不能點。
- 提示是否和附近的決策或內容直接相關?
- 它是在教學與提醒,而非宣告剛發生的錯誤?
- 是否用適合內容的語意化元素,而非一律 role="alert"?
- 文字是否具體到能幫使用者避免一個實際錯誤?
- 局部操作是否不會打斷主流程?
- 內容變長時,是否有連到完整說明的出口?