回饋提示詞條 2-38
對話框Modal
也常叫做：Modal（工程圈直接用英文）、彈出視窗、Dialog（W3C 正式名稱）
你可能會這樣說
點刪除之後跳出來蓋住畫面、一定要先按確定或取消的那個框——想做那個。
白話解釋
對話框是蓋在畫面上、背後變暗、必須先處理才能繼續的視窗：確認刪除、登入過期、重要公告。它的力氣很大——把使用者的注意力整個抓過來——所以也最容易被濫用。
好用又得體的對話框有幾條紀律：一件事（只問一件事，不要塞整個表單進去）；講人話的按鈕（「刪除」「取消」，不要「確定」「取消」——確定什麼？）；多條逃生的路（點背景關、按 Esc 關、右上角 × 關）。
跟 AI 協作時，一定要把「關閉的方式」和「背後能不能捲動」講清楚。AI 預設交貨常少了這些：背景照樣捲動、Esc 沒反應、關掉之後焦點丟了——看起來像對話框，用起來像 bug。
親手試試
試試三種關法：右上角 ×、點變暗的背景、按鍵盤 Esc。
別搞混
會「蓋在畫面上」的東西有兩兄弟，打斷程度差一級。
對話框 Modal
蓋住全畫面、後方變暗、不處理不能走。給「現在、立刻、必須」的事：確認刪除、伺服器斷線。像紅燈，看到了必須停。
側邊欄 Drawer
從旁邊滑進來，通常可以不理它繼續看主畫面。給「順帶看看」的事：購物車內容、篩選條件。像路邊的店員，不擋路。
這樣對 AI 說
中文就可以
請做一個「刪除專案」的確認對話框： 1. 點了「刪除專案」按鈕後，畫面變暗，中間出現對話框：標題「刪除這個專案？」、說明一句、按鈕「刪除」（紅色）和「取消」。 2. 三種方式都要能關：點 ×、點變暗的背景、按 Esc 鍵。 3. 對話框開著的時候，背後的頁面不能捲動；關掉之後，畫面回到原本的位置。 4. 一開始焦點要停在「刪除」以外的安全位置，Tab 鍵只能在對話框裡移動。 5. 出現和消失用淡入淡出加輕微縮放，不要太彈。
第 3、4 點是 AI 最常漏的。抄這段去用，你的對話框就贏過八成網站。