TPG 的專家們都瞭解從設計起就有親和力的概念 (從一開始就建立親和力, 而不是到最後再來修補). 我們每天都在處理目前的 (WCAG 1.0, 508 公法, AJAX) 指導原則及技術, 並且積極參與未來指導原則及規格 (WCAG 2, WAI-ARIA, HTML 5, 508 公法修正案) 的開發與實做. 運用我們經驗及專長的優勢來開發具親和力的網站和網頁應用程式.

現在就向我們洽詢免費的顧問服務.

網頁親和力工具列 [Opera 版] 1.1 - 功能描述


相關網頁: Opera 版 WAT 關於


支持 Opera 版 WAT 持續開發

透過 PayPal .


WAT [alt + 0] 工具列下拉式按鈕 - WAT 文件
功能 描述
網頁親和力工具協會 (WAT-C) 連到 WAT-C 網站
WAT-C 成員 連到 WAT-C 成員網站
親和力工具列 - 文件 關於工具列功能的資訊
親和力工具列與 WCAG 1.0 關於有哪些工具列的功能, 可以用來評估是否符合 WCAG 1.0 的檢核要點.
親和力工具列 - 關於 關於工具列版本及開發的資訊.
意見回饋 / 常見問答集 連到網頁親和力工具列部落格
版本, 語言及釋出日期 關於工具列的資訊
回到開頭


驗證 [alt + 1] 工具列下拉式按鈕 - 驗證
功能 描述
W3C HTML 驗證器
  • 驗證 HTML
  • 驗證頁框中的 Pages
  • 驗證 HTML (上傳檔案)
W3C HTML 驗證器來檢查目前網頁的 HTML 原始碼 (Opera 內建功能)
W3C CSS 驗證器
  • 驗證 CSS
  • 驗證 CSS (開新分頁)
W3C CSS 驗證器來檢查目前網頁的 CSS 原始碼
W3C HTML 美容器
  • 檢查修復 HTML
  • 檢查修復 HTML (開新分頁)
HTML 美容器檢查目前網頁的 HTML 原始碼, 並可檢視或下載美容過的版本
W3C 鏈結檢查器
  • 檢查目前網頁
  • 檢查目前網頁 (開新分頁)
  • 檢查被連到的網頁 (開新分頁)
檢查 HTML/XHTML 文件中的定位錨 (超連結). 以 W3C 鏈結檢查器找出損毀的鏈結等會很有用
WDG HTML 驗證器
  • 驗證 HTML
  • 驗證 HTML (開新分頁)
  • 輸入原始碼 - 連到 WDG 驗證器的網頁, 該網頁會有個表單讓你輸入要驗證的 HTML 原始碼
  • 驗證頁框中的網頁
  • 驗證網站 - 驗證目前網站中所有的網頁
WDG HTML 驗證器來檢查目前網頁的 HTML 原始碼
WDG 鏈結驗證器
  • 檢查被連到的網頁
  • 檢查被連到的網頁 (開新分頁)
檢查 HTML/XHTML 文件中的定位錨 (超連結). 以 WDG 鏈結驗證器找出損毀的鏈結等會很有用
P3P 驗證器 檢查 P3P 格式隱私資訊的有無及是否有效
回到開頭


尺寸 [alt + 2] 工具列下拉式按鈕 - 尺寸
功能 描述
640X480 將目前的瀏覽器視窗重設為 640 像素寬及 480 像素高.
800X600 將目前的瀏覽器視窗重設為 800 像素寬及 600 像素高.
1024X768 將目前的瀏覽器視窗重設為 1024 像素寬及 768 像素高.
1280X1024 將目前的瀏覽器視窗重設為 1280 像素寬及 1024 像素高.
自訂尺寸
  • 將目前的瀏覽器視窗重設為使用者自訂的高度/寬度.
  • 另外還有提供一些其他裝置的自訂尺寸, 包括了 @media handheld, projection 和 TV (Opera 內建功能)
回到開頭


CSS [alt + 3] 工具列下拉式按鈕 - CSS
功能 描述
停用 CSS 停用樣式表, 直到 CSS 重新啟用前都會一直有效. (Opera 內建功能)
顯示樣式表 在新視窗中顯示連到目前網頁的樣式表
此功能開發自 Lioren 的腳本
顯示已套用的樣式規則 在新視窗中顯示與目前滑鼠游標所在之處有關的樣式規則.
此功能係來自 Jesse Ruderman 的腳本
測試樣式規則

在新視窗中即時修改並套用樣式規則至目前的網頁
Aleto 的 Test styles 腳本

Opera CSS 編輯器

在新視窗中檢視, 修改, 停用及匯出樣式表
Opera 開發者工具的 CSS 編輯器

回到開頭


圖片 [alt + 4] 工具列下拉式按鈕 - 圖片
功能 描述
圖片清單 在新視窗中顯示圖片清單以及對應的 img 組件.
開發自 Lioren 的腳本
切換圖片/替代文字 把所有的 img 組件換成其 alt 屬性內容. 如果有哪個 img 組件沒有 alt 屬性的話, 則該圖片就會被換成 ‘沒有替代文字!’ 的文字
顯示圖片 在每個圖片旁顯示 img 組件 (及該圖片的 alt 屬性; 若該 img 沒有 alt 屬性的話, 則顯示 '沒有替代文字!' 的文字內容) 並在圖片周圍加上紅色框線.
顯示影像地圖 檢查是否有用戶端或伺服器端的影樣地圖. 如果找不到的話就會用一個警示訊息來表達. 如果有找到影像地圖, 則會在新視窗中顯示出來, 並跟著相關的 area 組件
GIF 閃爍測試 這個線上服務會檢查任何目前網頁中能找到的 GIF 圖片. 如果有哪個 GIF 含有多重畫格, 則會測量其 "閃爍率", 看看是否會影響感光性癲癇的使用者. 此功能係由 Renzo Guist 所開發, 並由 Roberto Castaldo 翻譯成英文
回到開頭


色彩 [alt + 6] 工具列下拉式按鈕 - 色彩
功能 描述
GrayBit 灰階工具

GrayBit 是個線上親和力測試工具, 設計來將全彩的網頁繪製成灰階, 目的是為了要以視覺的方式測試網頁的感知對比.

GrayBit 係由 Jonathan FenocchiMike Cherim 所創造.

Juicy Studio 色彩對比分析器 有三個測試選項
  • 明度分析
  • 色彩/亮度
  • 所有的測試 (1+2)
更多資訊請參見 色彩對比分析器 Firefox 擴充套件
Vischeck Colour 色盲模擬器 (紅綠色盲) 將目前網頁的網址送至 Vischeck 色盲模擬器. 待網址處理 (這可能會花上點時間) 後, 就會在新視窗開出一個網頁, 附上連往模擬結果的鏈結.
回到開頭


結構 [alt + 5] 工具列下拉式按鈕 - 結構
功能 描述
標題 顯示目前網頁中所有的標題組件
標題結構 在新視窗中顯示文件標題及段落標題 (h1 到 h6 及其內容). 此功能係來自 The Wave 3.5 的功能
清單項目 顯示目前網頁中的排序, 無序及定義清單組件
表單區域 / 標籤 顯示目前網頁中的 fieldset, legend 和 label 組件. 如果有對應到 label 組件的 for 屬性則顯示出來, 否則就顯示 'NoFor!' 的文字內容. 如果 form 控制元件有 id[id=""] 屬性的話也顯示出來.
頭文字 / 縮寫 顯示目前網頁中的 Acronym 和 Abbreviation 組件, 及其 title 屬性
引言區塊 & Q 顯示目前網頁中的 Blockquote 和 Q 組件
JavaScript / 開新視窗的鏈結
  • 如果鏈結的 href 屬性中含有 JavaScript 的話, 就在旁邊加上 javascript icon 圖示. 此鏈結並會加上虛線邊框及底色.
  • 如果鏈結的 href 或 onclick 屬性中含有 onclickevent 事件處理或其他常用來開新視窗的字眼的話, 就在旁邊加上 new window and question mark icon 圖示. 此鏈結並會加上虛線邊框及底色.
  • 如果鏈結有指定 target 屬性 (_self 和 _top 除外) 的話, 就在旁邊加上 javascript icon 圖示. 此鏈結並會加上底色.
感謝 Autark 創造了此功能所依據的腳本.
事件處理 如果有任何組件符合下列條件之一, 就在旁邊加上 警告 警告:
  • 有 onmouseover 屬性卻沒有對應的 onfocus
  • 有 onclick 屬性卻沒有對應的 onkeypress
  • 是 select 組件且具有 onchange 屬性
  • 有 onfocus 屬性卻無法取得輸入焦點
如果有任何組件符合下列條件之一, 就在旁邊加上 資訊泡泡 資訊泡泡:
  • 有 onmouseover 屬性及對應的 onfocus
  • 有 onclick 屬性及對應的 onkeypress
這些圖示各自的替代文字會含有為何會出現的資訊.
便捷鍵 顯示目前網頁中所能找到的 accesskey 屬性
跳位順序 顯示目前網頁中所能找到的 tabindex 屬性
顯示跳位順序 針對每個活躍組件加以編號並標上邊框, 顯示用鍵盤的 'Tab' 鍵取用時的順序.
注意: 如果有設定 tabindex 的話, 也會一並納入考量. 嵌入式頁框, 影樣地圖和內嵌物件 (例如: Flash 檔案) 在跳位順序中也會加 1.
顯示表格標題 顯示目前網頁中的 table 和 th 組件; th 組件的背景會是黑色的, 內容文字則會是黃色的粗體字.
簡單的資料表格 顯示目前網頁中的 table, th, td 和 caption 組件, 以及建議用來標記簡單資料表格的屬性 (summary, scope). 如果 summary 或 scope 屬性沒有出現在該出現的組件中的話, 就會顯示 "No summary!" 或 "No scope!" 的警告.
複雜的資料表格 顯示目前網頁中的 table, th, td 和 caption 組件, 以及建議用來標記複雜資料表格的屬性 (summary, scope, id 及標題). 如果這些屬性沒有出現在該出現的組件中的話, 就會顯示 "No summary!", "No scope!", "No id!", "No headers!" 的警告.
表格邊框 顯示目前網頁中所有的表格 / 表格儲存格邊框
表格儲存格順序 顯示目前網頁中表格儲存格的跳位順序 (編號) 及外框
線性化 (移除表格) 移除目前網頁中所有的 table, td, tr, th, div 組件
頁框邊框 顯示目前網頁中所有 frame 組件的邊框
頁框名稱 / 標題 在新視窗中顯示網頁頁框的清單及其 frame 組件的 name 與 title 屬性內容
顯示區段 顯示目前網頁中的 div 組件順序 (編號) 及外框.
顯示其他組件 顯示 JavaScript 提問對話盒, 讓你輸入組件名稱; 接著會有另一個提問對話盒, 讓你輸入色彩 (預設是 red), 然後在目前網頁中, 以指定的色彩外框標示出指定的組件. 本功能開發自 Centricle 的腳本
回到開頭


工具 [alt + 7] 工具列下拉式按鈕 - 工具
功能 描述
Juicy Studio 工具
The Wave 將目前網頁的網址送至 Wave 親和力檢查工具 (有兩個選項: 目前視窗或開新視窗)
AccMonitor 將目前網頁的網址送至 AccMonitor 親和力檢查工具 (有兩個選項: 目前視窗或開新視窗)
Webxact / Bobby 注意: Bobby 已經被 Webxact 拿掉了
將目前網頁的網址送至 Webxact 工具, 檢查品質, 親和力及隱私問題.
有四個選項:
  • 用 WACG AAA 檢查目前網頁 [開新視窗]
  • 用 WACG AA 檢查目前網頁 [開新視窗]
  • 用 WACG A 檢查目前網頁 [開新視窗]
  • 用 508 公法檢查目前網頁 [開新視窗]
Lynx 檢視器 將目前網頁的網址送至 Lynx 檢視器這個純文字瀏覽器模擬器
Test de Accesibilidad Web (TAW) 將目前網頁的網址送至 TAW 親和力檢查工具 (有兩個選項: 目前視窗或開新視窗)
回到開頭

文件資訊 [alt + 8] 工具列下拉式按鈕 - 文件資訊
功能 描述
網頁資訊 在新視窗中顯示關於目前檢視網頁的資訊. (包括了: 標題, 檔案尺寸, 建立日期, 圖片數量, 表單數量, 腳本數量等)
開發自 Oregon State University 網站的腳本
詮釋資料資訊 在新視窗中顯示目前網頁中所能找到的 title, link 和 meta 組件清單及其內容.
Link 組件導覽

顯示 LINK 組件並允許由這些組件來導覽 (Opera 內建功能).

運用 link 組件的資訊請參照:

顯示 DOCTYPE 在警示視窗中顯示目前 HTML 文件的 DOCTYPE.
請參考: Fix Your Site With the Right DOCTYPE!
顯示 Lang 屬性 顯示目前網頁中任何能找到的 lang 屬性及其所屬的組件.
此功能要感謝: Bartimeus Accessibility Foundation
請參考:
顯示標題 顯示目前網頁中任何能找到的 title 屬性.
網頁速度報告 在新視窗中將目前網頁的網址送至線上的網頁分析器. 此功能係由 Websiteoptimazation.com 所提供
列出頁框 在新視窗中顯示目前檢視網頁的頁框網址及其 frame 組件名稱.
列出鏈結 在新視窗中顯示目前網頁中能找到的鏈結清單, 並列出其網址, 內容與 title 屬性 (若有的話).
列出可供下載的檔案 在新視窗中顯示連往目前網頁中可供下載檔案 (例如: PDF, MP3, Word, Excel, Powerpoint, ZIP) 的鏈結清單.
本功能開發自 Sofia Celic 所撰寫的腳本
指認多媒體檔案 在新視窗中顯示任何找到的 object/embed 組件原始碼. 此功能也會列出目前網頁中所能找到的多媒體檔案 (例如: mp3, mov, swf, ram etc) 清單.
本功能開發自 Sofia Celic 所撰寫的腳本
指認腳本與小應用程式 在新視窗中顯示任何能找到的小應用程式及對應的原始碼. 此功能也會列出目前網頁中所能找到的嵌入式或外部腳本; 在多數的情況中, 也能讓你檢視或下載這些連至外部的腳本.
本功能由 Sofia Celic 所開發, 並要感謝 Lioren
回到開頭


原始碼 [alt + U] 工具列下拉式按鈕 - 原始碼
功能 描述
檢視原始碼 顯示目前網頁的原始碼 (Opera 內建功能)
Opera 產生出來的原始碼 在新視窗中按 HTML 顯示目前網頁的 DOM 樹.
Opera 開發者工具的產生出來的原始碼
檢視局部原始碼

在新視窗中按 HTML 顯示所選內容的 DOM 樹. 點擊組件以見其原始碼. 按 Esc 離開此功能.
Aleto 撰寫的腳本

棄而不用的 HTML
Dom 巡察器

Opera 選項 [alt + O] 工具列下拉式按鈕 - Opera 選項
功能 描述
重設 重新啟用 Opera 選單中所有的功能並從快取當中重新載入網頁 (Opera 內建功能)
啟用圖片 開關圖片 (Opera 內建功能)
啟用 GIF 動畫 開關 GIF 圖片動畫 (Opera 內建功能)
啟用 JavaScript 開關 JavaScript (Opera 內建功能)
啟用 CSS 開關 CSS (Opera 內建功能)
顯示偏好 開啟偏好設定對話視窗 (Opera 內建功能)
樣式 開關使用者自訂樣式表或切換網站提供的替代樣式表 (Opera 內建功能)
以 Firefox 開啟 在 Firefox (如果有安裝的話) 當中開啟目前的網頁
以 IE 開啟 在 Internet Explorer (如果有安裝的話) 當中開啟目前的網頁
回到開頭

參考 [alt + 9] 工具列下拉式按鈕 - 參考

參考部分含有連往網路上相關資訊及資源的鏈結.

回到開頭

放大 工具列下拉式按鈕 - 放大
功能 描述
放大 拉近或拉遠 (從 20% 到 1000%) 目前的網頁內容 (Opera 內建功能)
回到開頭


工具列選單便捷鍵
選單 組合鍵
文件 alt + 0
驗證 alt + 1
尺寸 alt + 2
CSS alt + 3
圖片 alt + 4
色彩 alt + 5
結構 alt + 6
工具 alt + 7
文件資訊 alt + 8
原始碼 alt + U
Opera 選項 alt + O
參考 alt + 9

Creative Commons License
本著作係以創用 CC 授權條款授權.