Toast

Demo 與 Accessibility Tree

5 秒後自動消失

Accessibility Tree

觀察對象：live region 容器。

元素目前不在無障礙樹中。

鍵盤操作

按鍵	行為
`（無）`	Toast 出現時不移動焦點、不中斷使用者當下的動作。這是它與 Dialog 的根本分界。
`Tab`	可以走到關閉鈕，但那是一段很長的路 —— 焦點還在你剛才操作的地方。正因如此，Toast 裡不該放重要的動作。

ARIA 屬性

屬性	值	用途
`role`	`status`	承載訊息的容器。隱含 aria-live=polite 與 aria-atomic=true，會等使用者當下的播報結束才開口 —— 這正是「不強制中斷」的技術實現。
`（時機）`	`動態更新`	role=status 播報的是內容的變化。容器要先在 DOM 裡，訊息在同一個節點內更新；整個容器被換掉時，部分螢幕閱讀器會當成新節點而不播報。
`（名稱）`	`無`	status 的 nameFrom 只有 author，名稱不從內容取得，所以 Accessibility Tree 上的 Name 永遠是空的。這不是缺漏。
`aria-label`	`關閉通知`	關閉鈕只有圖示，需要文字名稱才有可用的按鈕標籤。
`（對照）`	`role=alert`	需要立刻知道的事用 alert（隱含 assertive），它會插話但仍不搶焦點；非處理不可的事用 role=dialog，它把焦點拉過去鎖住。Toast 的定位是三者中最輕的一層：不插話、不搶焦點。
`（位置）`	`避開邊角`	低視能或使用螢幕放大鏡的人視野受限在畫面中央，躲在右上角或右下角的通知他們根本看不到 —— 不是沒注意到，是不在視野裡。
`aria-hidden`	`true`	關閉鈕的圖示是純視覺，名稱已由 aria-label 提供。

WCAG 對應

等級 AA4.1.3 狀態訊息
讓使用者知道內容中的重要變化，而不必中斷手上的工作。訊息出現時網頁不跳轉、不刷新，鍵盤焦點留在原地 —— 這三件事同時成立才算數。
等級 A2.2.1 時間可調整
自動消失是時間限制。使用者必須能關閉、調整或延長它，才有足夠時間讀完。
等級 AAA2.2.4 中斷
通知不能過於頻繁 —— 連續跳出的 Toast 對視覺或認知障礙使用者是實質的妨礙。
等級 A3.2.1 取得焦點
Toast 出現時不得移動焦點，使用者手上的操作不能被搶走。
等級 AA2.4.7 焦點可見
關閉鈕有橘色 focus ring。

APG 規則

APG 沒有這個 pattern，所以沒有對應的規則編號。這一頁的依據是 WCAG 成功準則與 live region 的既有實務，見上方的 WCAG 對應。