Accesserty DevCheck
發布前，在真正的頁面上自己先檢查一次，不需要無障礙背景：找出問題、看見掃描工具判斷不了的地方，也能讓別人看懂為什麼要修。
在可檢查的頁面找出自動化可偵測的問題，包括測試站與登入後的畫面。
從結果中挑一個元素，回到頁面確認；修正後再檢查同一個狀態。
發布前，自己先看一次
測試站、登入後畫面或本機開發頁，也能在自己的瀏覽器裡檢查，不必把頁面交給線上掃描服務。先找出可自動偵測的問題，再確認需要人工判斷的項目。
表單出現錯誤、開啟對話框，或修正問題後，都可以回到同一個畫面重測，並把結果交給團隊討論。
DevCheck 幫你做什麼？
依檢查的順序：先找出問題，再判斷掃描工具判斷不了的地方，最後讓團隊、主管或客戶看懂為什麼要修。
在真正的頁面上找出問題
找出可自動偵測的問題，點選結果中的元素，在頁面上查看位置。可複製摘要到團隊的問題追蹤工具，分享前先確認內容。
確定的問題與需要人工確認的項目會分開列出；沒有發現問題，不等於整頁通過檢測。
自動掃描涵蓋哪些規則？
使用 axe-core 檢查可被機器偵測的 WCAG 2.0～2.2 A/AA 與最佳實務問題。受影響元素以可讀名稱列出；無法定位時會提示。
判斷掃描工具判斷不了的地方
直接在頁面上查看鍵盤焦點順序、按鈕名稱，以及表單標籤與錯誤訊息，幫助你判斷操作是否清楚。
焦點路徑是推估，不是實際按 Tab 的紀錄，仍要用鍵盤核對；橘色提示不是已確認的錯誤。
可使用哪些人工檢視？
焦點路徑、標題結構、地標區域（例如導覽與主要內容）、可及名稱（輔助科技讀取的名稱）、表單標籤與錯誤訊息、朗讀預覽，以及暫停動畫後標出仍在動的內容。
讓別人看懂為什麼要修
用色覺模擬、放大鏡或無聲模式，和團隊一起查看只靠顏色、視覺或聲音才能取得的資訊。
模擬提供檢查線索，不代表身障者的完整使用經驗，也不取代實際使用者測試。
可使用哪些情境模擬？
包含色覺差異、低視力、視野缺損、文字間距與閱讀困難等情境，以及跟著游標與鍵盤焦點移動的放大鏡。手部顫抖模擬讓游標抖動，點擊落在抖動後的位置；無聲模式提示頁面發出的聲音，並列出沒有字幕的媒體。
PDF 不用上傳也能檢查
選取本機 PDF，查看標籤、書籤、連結、圖片、表單欄位與頁面尺寸一致性，檔案不需上傳。
結果是結構線索，不是 PDF/UA（PDF 無障礙標準）的符合性驗證。文件語言請先到 PDF 閱讀器或編輯工具的文件屬性確認，不要只憑 DevCheck 顯示的「未設定語言」判定有問題。
AI 語意檢測（選用）
提供連結用途、語言標記與圖片替代文字的修改建議。選用時，取樣內容會送往 Google Gemini。
不會讀取連結目的地驗證內容；結果列出取樣與略過數量，不代表整頁都檢查過。請勿提交機密或未授權內容。AI 提供輔助建議，不是符合證明；採納前請再次確認。
AI 會傳送哪些內容？
大部分檢查都在瀏覽器內執行。選用的 AI 語意檢測只在你主動執行後，把有限量的頁面文字、連結名稱與周邊文字，以及頁面允許讀取的選定圖片、alt 與所在連結或按鈕的名稱資訊送往 Google Gemini；部分隱藏的無障礙名稱與 SVG 標題也可能包含在內。不另附頁面、連結目的地或圖片來源的獨立 URL 欄位，但取樣文字、名稱或圖片中的網址仍可能傳送。
實際畫面
以下畫面來自虛構的示範頁，不是真實網站的檢測結果。
發布前，先看清楚鍵盤焦點順序。
看見只靠顏色傳達、別人卻看不出的資訊。
不用上傳，就能檢查 PDF 的結構。
DevCheck 是為誰做的？
- 發布前要檢查頁面的人
設計師、PM、QA、內容編輯或工程師都可以用，不需要無障礙背景。結果會分開確定的問題和需要人工確認的項目，元素用看得懂的名稱顯示，摘要可以貼進團隊既有的問題追蹤工具。
- 替客戶交付網站的團隊
客戶的合約有無障礙要求時，先在測試站把明顯的問題找出來；收到稽核報告後，也能在同一個畫面重現並重測每一項。
- 政府與公部門網站的承接團隊
送無障礙標章檢測或驗收之前，先自己看一次。DevCheck 可以和 Freego 等既有工具搭配使用，補上鍵盤焦點、情境模擬與 PDF 的檢查。
- 元件庫與設計系統維護者
發布新版元件前，檢查焦點樣式、可及名稱與狀態色。DevCheck 讀得到開放式 Shadow DOM 與 slot 投射的文字。
它不能取代完整檢測
DevCheck 不取代無障礙專業，也不能取代完整檢測。它適合發布或交付前的自我檢查、和團隊或客戶溝通問題，以及修正後重測；正式無障礙檢測仍需要人工判斷、鍵盤操作測試、輔助科技測試與情境理解。
如何開始檢查？
安裝瀏覽器擴充功能（Chrome／Edge 或 Firefox）後，開啟要檢查的頁面即可開始。
- 步驟 1. 安裝 Accesserty DevCheck
從 Chrome 線上應用程式商店或 Firefox 附加元件商店安裝擴充功能。
- 步驟 2. 開啟要檢查的頁面
可以是公開頁、localhost 開發頁、測試站或登入後的互動狀態。PDF 則從「掃描」的 PDF 檢查入口選取電腦上的檔案，不是直接檢查瀏覽器內建 PDF 閱讀器。
- 步驟 3. 先掃描，再確認與重測
先選「掃描」，再用「人工檢視」與實際鍵盤操作確認結果，不必啟用 AI。分享摘要前先確認內容，再貼入團隊的問題追蹤工具；修正後回到相同畫面重測。
本機掃描、人工檢視、情境模擬與 PDF 檢查免費，不需要 DevCheck 付費方案。選用的共用 AI 有每日額度與速率限制；使用自己的 Gemini API Key 則適用 Google 的額度、費率與資料使用條款，不代表無限或免費。
安裝 Chrome / Edge安裝 Firefox用過 DevCheck 嗎？到商店留下評分，能幫助其他人找到它：Chrome 線上應用程式商店或Firefox 附加元件
試做第一次檢查
不用寫程式：打開練習頁，用 DevCheck 掃描、找到沒有名稱的按鈕，再在頁面上套用修正後重測。練習頁是虛構的示範內容，也不需要啟用 AI。
「需要人工確認」不是已確定的錯誤；掃描沒有發現問題，也不等於整頁通過 WCAG。
想在自己的測試頁試試？看 HTML 範例
把第一段 HTML 放在你能修改的測試頁，例如 localhost 開發頁；按鈕沒有新增資料的功能。
檢查前：只有被輔助科技忽略的圖示
<button type="button"><span aria-hidden="true">＋</span></button>- 開啟測試頁與 DevCheck，選「掃描」→「掃描這個頁面」。不要在瀏覽器設定頁或擴充功能商店頁測試。
- 在結果中找按鈕名稱相關項目（規則 ID：button-name）。檢視列出的元素；點選元素項目可嘗試在頁面標示位置。這裡缺少名稱，是因為唯一的內容被 aria-hidden 排除了。
- 先確認按鈕用途，再改成下方有可見文字的版本。不要只為了消除警告而填入「按鈕」這類沒有用途的名稱。
- 重新載入修改後的頁面，再掃描同一狀態。這個按鈕不應再出現 button-name 問題；但仍要用鍵盤確認能到達與操作，並用螢幕閱讀器確認名稱。正式功能還要另外測試新增流程。
修正後：用可見文字說明用途
<button type="button">新增聯絡人</button>按需要深入的檢查指南
不必一次看完。按你正在檢查的內容選擇指南；有 PDF 時，再另外檢查文件。
先建立上線前檢查範圍
先確認要檢查的是公開頁、本機、測試站、登入後流程、互動狀態或 PDF。
檢查鍵盤與焦點路徑
確認焦點是否可到達、順序是否合理、是否被困住，以及操作路徑是否符合頁面脈絡。
把發現整理成修復計畫
依使用者任務、影響範圍、負責角色、修復層級與回測方式整理下一步。
常見問題
Accesserty DevCheck 是免費的瀏覽器擴充功能，給發布或交付網站前要自己先檢查的人使用，不需要無障礙背景：在真正的頁面上用 axe-core 找出問題，用焦點路徑、標題結構、地標區域與可及名稱等檢視，判斷掃描工具判斷不了的地方，再用情境模擬讓客戶看懂為什麼要修。也能在本機檢查 PDF 結構；AI 語意檢測是選用功能。
本機掃描、人工檢視、情境模擬與 PDF 檢查免費，不需要 DevCheck 付費方案。選用的共用 AI 有每日額度與速率限制；使用自己的 Gemini API Key 則適用 Google 的額度、費率與資料使用條款，不代表無限或免費。
可以。axe-core 掃描、人工檢視、情境模擬與 PDF 檢查在你的瀏覽器內執行，不需把頁面交給外部 URL 掃描服務。選用 AI 會另外傳送取樣內容；請先確認內容適合傳送，再看完整資料說明。
瀏覽器內部頁與商店頁會限制擴充功能；本機開發請用 localhost 網頁。頁面互動或內容變動後，請重新掃描或重新整理人工檢視。受保護框架與封閉 Shadow DOM 可能無法定位。PDF 只提供結構訊號，不是 PDF/UA 符合性驗證。AI 是有限取樣，排除可編輯內容與部分 CSS 隱藏文字，但裁切文字、可及名稱與 SVG title 仍可能送出；取樣內容裡的網址不會自動遮除。部分圖片及超過上限的項目會略過；跨來源保護、載入失敗或編碼限制也可能使圖片被略過。
只有主動啟動 AI 才會傳送取樣文字、連結／alt 資訊及頁面可讀取的圖片；取樣可能包含 CSS 裁切文字、隱藏的 ARIA 引用文字與 SVG title；取樣內容裡的網址不會自動遮除。共用 AI 經 Accesserty 控管額度，自備 Key 則直接送往 Google。依 Google 未付費服務條款，輸入與回覆可能用於改善模型及人工審閱；自己的 Key 仍依該專案帳務狀態及適用地區條款處理。請勿將機密、未授權或個人資訊送至未付費 AI。結果會區分完整、部分可用與無可用結果；不完整不代表沒有問題，已送出的共用請求仍計入額度。複製／下載的本機報告可能包含頁面網址與取樣文字，分享前請檢查。
不是。DevCheck 可以協助初步找出無障礙風險並做修正後重測，但它不提供 ADA 法律符合性判定，也不取代正式稽核、輔助科技測試或法律建議。
適合任何發布前要檢查頁面的人：設計師、PM、QA、內容編輯與工程師，不需要無障礙背景；也適合替客戶交付網站的團隊、政府網站承接團隊與元件庫維護者。它讓發布前的自我檢查提早發生，而不是取代無障礙專家或實際使用者測試。