浅谈如何提高网站可用性

网站可访问性是可用性的一部分，并且这不仅仅只是前端开发人员的事情，而是指能由程序员来控制的，不过作为负责的前端开发者，我们也需要做好自己职责范围内的网站可访问性工作，看看对于可访问性，应该要注意哪些问题：

1. 标明语言（Identifying your language）
这一条的意思是，加上lang属性，如。如果其中有一段是其他的语言，就在那一段的标签上加lang属性。这一条我做得不好，以后记得。

2. 构建有意义的页面标题（Constructing meaningful page titles）
有几点值得一提：
a) 做页面时，千万不要忘记写title。我见过好多页面的title是“Untitled Document”或“新建页面”，丢脸啊~
b) title到底应该是“小标题”在前呢，还是“大标题”在前？现在的惯例似乎都是“小标题”在前，比如“影音娱乐首页_新浪网”。但我个人倒是有个看法，或许大标题在前比较好。这样当我把“新浪网_影音娱乐首页”、“新浪网_新闻中心首页”放入收藏夹时，它们会因为音序排序而呆在一起，而不是散乱在各处。当然这个也不一定，仅供参考。
c) 对于英文的标题，一定要注意尽量不要把The放在title的前面，否则你的网页在收藏夹里就会被排在T开头了。

3. 提供额外的导航辅助（Providing additional navigation aids）
这一条是说要加 <link rel=”home” title=”Home” href=”http://url/of/home/page” /> 这个。这个其实我知道。但是貌似对于页面里这么多链接，要都加上rel和rev属性，有点难度。

4. 先呈现主要内容（Presenting your main content first）
好啦，这就是一条典型的“指望优秀的CSS”的可访问性原则啦。把<div class=”main”>放在<div class=”side”>的前面，其实挺考验CSS技术的。一道著名的题目是：如何让侧栏固定宽度，主栏宽度自适应，同时主栏的HTML要在侧栏的前面。我很想放在我的面试题里，可又觉得是不是太刁难了。但是，无论如何，这道题目很重要！

5. 用于跳过导航栏的链接（Skipping over navigation links）
很重要！这个在骨灰级网页标准教程《网站重构》里就提到了。只是有一点我比较怀疑，如果把skip link设为display:none，难道不怕被阅读器也忽略掉么？

6. 安全的使用颜色（Using color safely）
这条其实讲了几个要点：
a) 颜色对比要够，否则眼神不好的人看起来费劲
b) 链接的颜色，最好用蓝色（像我比较喜欢用#09c）
c) 链接最好有下划线

7. 用“真链接”（Using real links）
意思是，即便这个链接是用于触发Ajax，也要把Ajax代码片段放在href里，好让搜索引擎以及阅读器等等能够爬到。关于此条，请参看土豆网首页的“挖土豆”一块。

8. 给链接加“title”属性（Adding titles to links）
这个还用说么，可用性两大重点：a的title和img的alt。