EV1120200、noscript、EV1080300
剛好看到fb上有人在討論SPA(Single page application)網站申請無障礙標章
來記錄一下之前的經驗
也可以直接上無障礙標章的網站
查看看其他沒做SSR(Server side rendering)的SPA網站怎麼做的
（網址搜尋「#」可以找到5個）
問題1:EV1120200、noscript
指引十二：針對目前及未來的使用者代理與輔助科技，最大化其相容性
12.2對於所有的使用者介面元件（包括但不限於表單組件、鏈結及由腳本所產生的組件）來說，其名稱及角色要能用程式化的方法判定；其能由使用者所設定的狀態、屬性、值，則要能用程式化的方式設定；而使用者代理，包括輔助科技，則要有這些項目變更的通知。
EV1120200：暴露名稱與角色，允許直接設定可由使用者設定的屬性，並在變更時提供通知
https://vuejsapp/#/ 網頁在JAVA SCRIPT不支援時雖有提供提示文字，但頁面內容空白未顯示任何資料，並不符合無障礙精神，請修正，在JAVA SCRIPT不支援時，仍需顯示整個頁面之基本資料，網頁內容請勿空白；且中文版網站請提供中文說明，勿以「We're sorry but vuejsapp doesn't work properly without JavaScript enabled. Please enable it to continue.」做為描述，以方便使用者瞭解及操作，請檢視問題並修正，全網站若有相同問題請一併修正。
白話文：
noscript裡面不能只有一句話
像下面這樣只有一句話是不行的
<noscript>We're sorry but vuejsapp doesn't work properly without JavaScript enabled. Please enable it to continue.</noscript>
解決：
修改public/index.html裡面預設的noscript段落
至少你的網站標題要出來再請人家打開JS
或是做一個迷你版的網站放在noscript
我是把寄給民眾的通知信拿來用
範例：
vue A 臺北市交通違規檢舉專區
vue AA 經濟部工業局智慧城鄉OpenAPI管理平台
angular A 國立中正紀念堂管理處園區建築生態導覽網站
問題2:EV1080300
指引八：提供協助使用者導覽、尋找內容及判斷所在的方法
8.3如果網頁能依序導覽，且導覽順序將會影響到意義或操作，則可取得焦點的元件要以能保留意義與操作性的順序，來取得焦點。
EV1080300：按照內容的序列及關連性來安排互動元件的放置順序
https://vuejsapp/#/ TAB鍵移動順序應從頭(網址列)開始由上至下、由左至右順序移動。使用鍵盤遊走至上方區塊「網站導覽、違規檢舉、案件查詢、友站連結」選單，按Enter鍵載入該網頁資訊後，游標應從頭（網址列)開始走訪，請勿繼續遊走下一個選單項目。提供鍵盤操作時，請務必注意游標移動順序，全網站如有相同問題請一併修正。
白話文：
頁面跳轉時應該要focus到頁面最頂端
這對一般的網站來說完全不是問題
但SPA網站沒有重新整理
瀏覽器還是focus在剛剛點擊的超連結上
範例：
我是在vue router跳轉後對焦到最前面的元件上
跳回#gotocenter
這個元件我還多設定tabindex=”-1”
這樣使用者按tab就不會聚焦到#gotocenter
