[转]Accesskey引起的一点点思考

所属分类: 网络编程 / CSS/HTML 阅读数: 1570
收藏 0 赞 0 分享

Access key 是什么?~估计除了做 Web 开发的没多少人知道,Access key 是网页提供的快捷键。先回到软件界面,看下我的 Opera 的菜单,我的 Opera 是修改过的,中英文混在一起。

中文的作法一般都是在文字后面加个括号,里面的键值用下划线标出。而英文一般是把开头当成键值,如有重复的就推到第二第三,如果那个单词比较倒霉,所有字母都有跟别的有冲突又排在最后面的话,一般做法也不会像中文一样加括号标值。而是调整其他的来解决冲突,这年头,视觉第一!中文什么好办法,统一加括号。这是系统提示的热键(比较懒,没去查它叫什么名?),按下 alt+key 可直呼出,不知道有多少人使用鼠标去点多一些。

回到网页中,在网页里,一样有差不多功能的东东。大家叫它Access key,貌是最近流行滴样子。
<tag accesskey="x">标签添加属性accesskey,属性值就是对应的键</tag> 相关资料:http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html#access-keys

一般按法也是 alt+key 来选中。不过各浏览器都不大一样。
IE系列使用alt+key,再加Entet回一下下车(如果是链接的话。)
FF2.0以下的是也是使用alt+key,不过如果是链接的话,直接打开,Netscape也是直接按Alt+key
FF2.0的,官方说:网页提供的快捷键 (Access key) 现在在 Windows 上请以 Alt+Shift+Key 来使用,在 Mac OS X 为 Ctrl+key,Unix 则是 Ctrl+Shift+key。,可是我的SUSE上的FF2.0仍然是用 Alt+Shift+Key,不知道是算什么系统。。-_-!!
除了alt+key外还要多按个键的做法是为了避免与浏览器的冲突,想法是好滴,可单手按起来并不方便。
Opera的是按下Shift+Esc 激活accesskey面板。再接Key直接选择,这是我以前做的小站的部分截图

跟Opera使用方式差不我的还有Konqueror,Konqueror 是个按下Ctrl 激活 accesskey 面板,除去已经分配的 accesskey外,会自动把其他的键按页面链接的顺序按XXX条件分配,字母分完了就分配数字,都分完了后面的就没有。不过Konqueror 这个浏览器,估计没什么人会去用,现在 linux 的发行版大多默认是 Firefox 。

Mac OS X 上的我就不知道。没钱买装的起这种系统的机子。x86的装了n个版本,N台机子,都没装上一个图型界面可用的。如有使用Mac OS的朋友告知一下,也许我哪天会用上Mac不用再想这个问题。

知道了accesskey 怎样操作后,思考一下,它应该用在什么地方。
一般来说,非打字状态下,我左手是放键盘左边或者拿烟,右手抓住鼠标,以防给人抢了。
如果有明显提示的 accesskey 并在 key 是键盘左边,我单手能很方便按到时才可能会使用,我比较懒 ^_#。

为什么说要有明显提示的 accesskey 才可能会使用会使用呢?我以前做的小站。是使用tip来提示的,我连自己做的东西都忘记了,更别说别人的。而如果按一个键要我把整只左手移到键盘的右边,我宁可使用鼠标操作。
那什么是明显的提示呢。看一下小甘甘滴小站吧,注意最上面的导航菜单。英文还是比较好做一点点,可以抽个字母来用,中文的我并没想到什么好一点的办法。也许像窗口的菜单的一样是个办法,中文的字并不能全排进键盘那些键里,就算可以排进去,又有多少人能记得住。

accesskey 的值可以是字母跟数字。一些浏览器并没有解决网页里跟浏览器里的按键冲突。 所以,并非所有的字母都适合使用。同时,一些浏览器的数字并不能使用小键盘里的数字。比如FF,
如果一个人会在网页里使用别人提供 accesskey 的话,理论上他也会使用浏览器上的来完成一些操作。当然,这只是我个人想法,并不知道别人是否也是这样。也许别人跟我一样,IE只是用来调试网页使用的。

如果在网页里使用的 accesskey 与浏览器上的菜单重叠了,比如 "V" 给网页用了,我就不能按 Alt+V, C 这样简单的在IE打开源文件来看,哎!做开发的人一天就知道看代码。 希望有在网页使用accesskey 的朋友不要选择与浏览器的有冲突的键。

除了菜单。还有什么地方常会用到呢?一般来说是表单,录入文字时我会使用双手。按键范围也就就大了。比如像一位台湾的朋友OOO的blog,在评论时可以用 accesskey 来选择要填的地方。像这样操作的确方便了点,不过我一般都不用。
一般我看文章时。右手还在鼠标上,拉到评论时,会顺便点在第一个 input 里,之后一般是按 Tab 来跳到下一个 input 或者别的,要返回上一个时,是按 Tab+Shift 来跳回,怎样说 Tab 键也是比较大一点的,方便按一点。

说着说着,好像accesskey 用处并不怎样的样子。其实,因为我们一般有鼠标用,如果没有鼠标呢?所以,大家买手机时最少得买有蓝牙可以控制电脑滴,要是鼠标不小心坏了,还可以临时当下鼠标用。在现在多数网站光使用Tab都比较难用滴,又有多少使用AJAX技术的网站来提高用户体验~结果是让我在鼠标出现问题时,连唯一的Tab都没用没了。

除去 accesskey 外,还有一些网站,强制使用键盘的某些键配合js来完成一些操作。比如按Home键就跳到首页,方向键向左是跳到上一篇文章,向右是跳到下一篇。有时,用着是挺方便的;有时,也许会很烦,因为原来的功能没了。

请不用在本小站尝试 accesskey,因为没有做之类的功能,只是昨晚有个朋友问到 FF2.0 按了没反应的问题,便写下自己的一些想法。也许,下一次改版,我会把小站做得更像样,也许,改版都可以省掉,因为很懒,忙其实只是个华丽的借口。

更多精彩内容其他人还在看

简单明了带你了解CSS Modules

不要误会,CSS Modules可不是在说“css模块化”这个好像在某些地方见过的词,它其实是特指一种近期才出现的技术手段。什么技术手段呢?下面小编来和大家一起学习一下
收藏 0 赞 0 分享

新手学习css优先级

大部分人同样也会在写css的过程中产生很多困惑,比如为什么自己写的某段css没有生效,或者呈现出的样式和预计的不同,但又不知道要如何解决。下面小编来和大家一起学习CSS的优先级
收藏 0 赞 0 分享

css进阶学习 选择符

css这种没有程序逻辑的代码中,又能找出什么来说明谁做得更出色呢?下面小编给大家说明如何从css选择符的角度来提高css代码质量。
收藏 0 赞 0 分享

实现css文字垂直居中的8种方法

CSS可以轻易实现文字的水平居中,但有时我们需要文字垂直居中,除了表格可以实现这种CSS文字垂直居中以外,还有其它几种方法可以做到
收藏 0 赞 0 分享

完美实现CSS垂直居中的11种方法

在做前端项目时CSS的水平居中我们经常使用,但有时还会用到CSS垂直居中,对于小白来说这个就有些难度了,下面看一下我是如何实现的
收藏 0 赞 0 分享

webpack高级配置与优化详解

这篇文章主要介绍了webpack高级配置与优化,其中包括了webpack打包多页面,webpack跨域问题等相关内容
收藏 0 赞 0 分享

5个HTML5的常用本地存储方式详解与介绍

在HTML5规范之前,存储主要是用cookies,但cookies缺点有在请求头上带着数据,大小是4k之内,今天为大家介绍一下H5的5种存储方式
收藏 0 赞 0 分享

CSS代码检查工具stylelint的使用方法详解

stylelint是一个强大的现代CSS检测器,可以让开发者在样式表中遵循一致的约定和避免错误。本文将详细介绍CSS代码检查工具stylelint
收藏 0 赞 0 分享

Zen Coding css,html缩写替换大观 快速写出html,css

本文是在zen使用生产中遇到的问题做一些分享。
收藏 0 赞 0 分享

javascript代码规范小结

javascript代码规范,大家可以参考下,以便写出更利于阅读的代码。
收藏 0 赞 0 分享
查看更多