[基礎教材] 10.8 更多關於元件清單 - 教學區

[基礎教材] 10.8 更多關於元件清單

文章瀏覽次數 958

特種兵

特種兵圖像(預設)

2022-03-30 21:55:56

From:111.249.204.141

NVDA 基礎教材

10 網頁瀏覽

10.8 更多關於元件清單

在前一個活動中,我們在元件清單顯示並啟動連結,元件清單還可以顯示其他的網頁元素。

當元件清單被開啟時,alt + h 可以顯示所有的標題,alt + f 是表單欄位,alt + b 是按鈕,還有 alt + d 是地標。alt + k 會再次顯示回連結的列表。

注意,在元件清單的這些快速鍵都是使用 alt 加上該元素的單鍵瀏覽按鍵組合而成,所以非常好記。按下這些快速鍵後,焦點會被移到相應清單。

元件清單引入了新的元素控制項,也就是選擇鈕(註一)。如果使用點顯器的話,它的縮寫是「rbtn」。除了它是一個選擇群組,只會有其中一個被勾選外,其餘的運作方式都很像核取方塊。

因此元件清單會有另一區,也就是選擇鈕清單,裡面有連結、標題、表單欄位、按鈕和地標的選擇鈕。哪一個類型的選擇鈕勾選時,在元件清單就會顯示該元素的列表。

在開啟元件清單時,按下 shift + tab 可以移回類型的選擇鈕清單,使用方向鍵可以改變成其他類型的選擇鈕,此時移到的選擇鈕就是被勾選的狀態,元件清單也只會顯示一種被勾選類別的元素清單,選擇好後按 tab 鍵就可回到元件清單。

元件清單使用了類似樹狀檢視的顯示方式,運作的情況就像檔案總管。對於連結、表單欄位與按鈕都只會顯示第一層級的清單項目(註二),對於標題與地標,NVDA 則會顯示它們的層級,包含它們在網頁中的層級架構。

在元件清單瀏覽連結或按鈕的清單,按 enter 或 alt + a 可以啟動當前項目,按 alt + m 只會把焦點移到該項目的實際網頁位置而不啟動它。

而在瀏覽標題與地標時,按 enter 鍵會將焦點移到該項目的實際頁面上。

元件清單還有一個篩選器,可以顯示被過濾過後較少數量的元素,假如想要篩選出所有包含「contact」的連結,那就可以在篩選編輯區輸入「contact」這個單字。

做法是按下 alt + e 或在元件清單按 tab 鍵就可以移到篩選區,在編輯區輸入元素含有的文字,最後按下 shift + tab 回到元件清單看篩選出來的結果。

現在讓我們探索元件清單的新功能。

活動:更多關於元件清單
  1. 確認 Edge 在上個活動就已被開啟,且 NV Access 的 Get Help 頁面是被載入的
  2. 按下 NVDA + f7 開啟元件清單
  3. 按下 alt + h 啟動標題選擇鈕,在清單中會變成顯示所有的頁面標題而非連結
  4. 按 tab 鍵回到樹狀檢視,使用方向鍵來瀏覽元件清單,注意它是如何顯示每個標題的層級
  5. 按 tab 鍵到篩選編輯區
  6. 在篩選編輯區輸入 support 這個單字
  7. 按下 shift + tab 將焦點再次移回標題的清單
  8. 使用方向鍵在清單間移動,注意現在只會剩下一些選項而已,且這些標題都包含 support 這個單字
  9. 選擇「email support」這個標題並按 enter 鍵,焦點將會移到實際頁面的 email support 這個區塊,閱讀下一段的內容來確認焦點確實是被移到實際頁面上了,一切都完成後就關閉 Edge (註三)
註釋
  1. radio button 我自己習慣說單選鈕,但 NVDA 是翻成選擇鈕,只好以它的翻譯為主了。
  2. 需要提醒的是,雖然是寫第一層級,但是別忘了樹狀檢視的最上層級其實是第0級,因為它是從0開始起算的。
  3. 又是版本問題,原本是要找 phone support。
自主練習

使用記事本開啟「標題」這個檔案。開啟 NV Access 的主頁,使用元件清單來計算這個頁面有多少連結、按鈕和地標。將結果寫到「標題」檔案中,存檔並關閉這兩個程式。

最後更新:2025-06-14 11:00:26

From: 111.249.176.81

By: 特種兵