什么是可及性測試？
可及性是用來描述產(chǎn)品、設(shè)備媚送、服務(wù)或環(huán)境對人群的適用范圍大小的程度的一般性術(shù)語」苏茫”(Wiki: Accessibility is a general term used to describe the degree to which a product, device, service, or environment is available to as many people as possible.) 說的通俗一些，就是衡量一個軟件在有限的條件下能被多少人順利使用的標準胃碾。
網(wǎng)絡(luò)信息要能夠以“無障礙”的方式傳達給用戶涨享，基本上包含三個要素：
- 網(wǎng)頁內(nèi)容應(yīng)遵照規(guī)范設(shè)計：如政府所頒訂的無障礙網(wǎng)頁規(guī)范，及國際組織W3C公布的“網(wǎng)頁內(nèi)容無障礙設(shè)計指引”（WCAG 2.0）仆百。
- 良好的信息輔具厕隧，如屏幕報讀軟件、點字顯示器等俄周。
- 用戶要具備足以操作瀏覽輔具的能力：經(jīng)過良好的訓練與學習吁讨，視障或?qū)W習障礙者仍然可以獲取所需的網(wǎng)頁信息。
例如有一位盲人需要來訪問淘寶網(wǎng)峦朗，他可能會使用一些輔助工具例如發(fā)聲器等來協(xié)助他讀網(wǎng)站挡爵。這個輔助工具可能就需要用一些基于accessibility的標準去做讀取網(wǎng)頁元素的工作。如果這個時候淘寶網(wǎng)的accessibility不夠標準甚垦，則可能造成這些輔助工具達不到預(yù)期效果。
可及性測試工具Pa11y##
Pa11y是一套自動化的accessibility測試工具涣雕，其通過在命令行執(zhí)行HTML_CodeSniffer腳本后艰亮，探測html源文件是否滿足民間標準WCAG(WebContentAccessibilityGuideLines2.0)和美國政府法定的 Section 508標準
pa11y包含三個工具:核心工具pa11y,支持多任務(wù)同時執(zhí)行的pa11y-webservice和可視化的pa11y-dashboard。三個工具各有不同的用處和用法挣郭，最簡單的使用就直接下載pa11y-dashboard使用就可以了迄埃。
這么來理解這三個工具：有一群人需要做accessibility測試的工作，結(jié)果發(fā)現(xiàn)標準太多手工做的話工作量太大兑障，然后剛好在發(fā)現(xiàn)HTML_CodeSniffer可以驗證網(wǎng)站是否滿足WCAG和Section508標準侄非。于是他們就做了一個pa11y工具基于HTML_CodeSniffer蕉汪，利用phantomjs去盲跑待測網(wǎng)站。pa11y可以跑remote URL和本地html文件逞怨，而且可以生成各種指定格式的報告者疤。并且開放了JS接口，可以使用JavaScript直接調(diào)用和跑結(jié)果叠赦。搞完這個以后驹马，又發(fā)現(xiàn)如果有好多個頁面都需要測的話，那用pa11y起來也挺麻煩的除秀，最好還能夠一次跑多個頁面糯累。于是他們又搗鼓出了pa11y-webservice。最后這群人又在想了册踩，既然我要做這個工具泳姐，為什么不把這個工具做得更好用一些，一鍵安裝暂吉，無腦使用就能達成效果了胖秒。然后就做出具有可視化UI的pa11y-dashboard，集成了前面的兩大工具借笙。
下面以mac環(huán)境為例扒怖，簡單介紹下如何安裝和使用這套工具
安裝依賴環(huán)境:####
$ brew install node
$ brew install phantomjs
$ brew install mongodb
$ npm install -g grunt-cli
pa11y
安裝：
npm install -g pa11y
執(zhí)行:
測試在線網(wǎng)站
pa11y www.taobao.com
測試本地文件
pa11y file:///path/to/your/file.html
pa11y-webservice
安裝：
拷貝源碼
git clone https://github.com/springernature/pa11y-webservice.git
下載依賴文件
npm install
pa11y-dashboard
安裝
git clone https://github.com/springernature/pa11y-dashboard.git
npm install
定義配置文件，執(zhí)行如下命令：
$ cp config/development.sample.json config/development.json
$ cp config/production.sample.json config/production.json
$ cp config/test.sample.json config/test.json
每個配置文件指向不同的環(huán)境
然后定義環(huán)境變量：
$ NODE_ENV=production node . # Run in production
$ NODE_ENV=development node . # Run in development
$ NODE_ENV=test node . # Run in test
完成安裝和環(huán)境變量配置后业稼，在test mode下啟動服務(wù)
$ grunt start-test
然后就可以執(zhí)行這些命令跑服務(wù)了
$ grunt # Run the lint and test tasks together
$ grunt lint # Run JSHint with the correct config
$ grunt compile # Compile front-end assets
$ grunt start # Run app in development mode, restarting if files change
$ grunt start-test # Run app in test mode, restarting if files change
$ grunt test # Run functional tests
$ grunt watch # Watch for file changes and compile assets
跑起dashboard效果如下：
