Wai
Upcoming SlideShare
Loading in...5
×
 

Wai

on

  • 87 views

 

Statistics

Views

Total Views
87
Views on SlideShare
87
Embed Views
0

Actions

Likes
0
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Wai Wai Presentation Transcript

  • Web Accessibility
  • How Blind People Read the Internet? See Screen reader
  • Let’s begin with a game
  • What can we do?
  • Principle• Perceivable (可感知性).• Operable .• Understandable.• Compatible
  • Semanticsdiv – division p – paragraphul – unordered list ol – ordered listdl – definition list dd – define describe dt – define itemh1 – header level 1tr – table row td – table data cell
  • tabindex• 当使用键盘时,tabindex是个关键因素,它用来定位html元素.• tabindex有三个值:0 ,-1, 以及X(X里32767是界点,稍后说明)• 原本在Html中,默认只有链接a和表单元素可以被键盘访问(即使是a 也必须加上href属性才可以)。但是aria允许tabindex指定给任何html元 素• 当tabindex=0时,该元素可以用tab键获取焦点,且访问的顺序是按照 元素在文档中的顺序来focus,即使采用了浮动改变了页面中显示的顺 序,依然是按照html文档中的顺序来定位。• 当tabindex=-1时,该元素用tab键获取不到焦点。• 当tabindex>=1时,该元素可以用tab键获取焦点,而且优先级大于 tabindex=0;不过在tabindex>=1时,数字越小,越先定位到。 – 在IE中,tabindex范围在1到32767之间(包括32767)。 – 在FF, Chrome无限制,不过一旦超出32768,顺序跟tabindex=0时 一样。
  • design
  • accesskey• 台湾行政院研考会将这种方法写入了无障碍网站规范中, 定位点又称为导盲砖,独创性的使用三个冒号(:::)来表 示,主要用来帮助用户快速定位和搜索,代码如下: <a accesskey="U" href="#" title="顶部区域"> ::: </a> <a accesskey="L" href="#" title="左侧区域"> ::: </a> <a accesskey="C" href="#" title="中间区域"> ::: </a> <a accesskey="R" href="#" title="右侧区域"> ::: </a> <a accesskey="B" href="#" title="底部区域"> ::: </a>
  • WAI-ARIA• Web Accessibility Initiative‘s Accessible Rich Internet Applications Suite• role – banner、slider、contentinfo、form、main、 navigation、search – menu、menuitem、button、radio• Status – aria-checked、aria-haspopup – aria-label、aria-labelledby• Opera 9.5 +, Firefox 1.5 +, IE8+
  • 打个例子• ebay君• 首页君• 天猫君 大家好,我又来了• 一淘君
  • 根据中国残疾人联合会权威发布的数据,我国现有8300万残疾人,占全国人口总数的6.34%,其中视力障碍的比例是14.86%、听力和语言残疾的比例是25.69%%、肢体残疾比例是的29.07%。
  • 据不完全统计及估算,淘宝网3.7亿(2011年)注册会员中,残疾人会员的数量超过1000万,他们在淘宝上购物、开店,在获得购物便利的同时还实现了在淘宝上创业、就业,在获得经济收入的同时收获了自尊、自信和自我实现。
  • 我们比想象中更有力量加油诸君
  • • 淘宝无障碍实验室• 前端无障碍wiki。• 开发检测工具TBAT