你不应该创造按钮(Nicholas C. Zakas)

Author : lovecicy

易用性的一个重要方面就是管理焦点和用户交互。默认情况下,所有的链接和表单控件都能获得焦点。这使你可以使用键盘的Tab键导航,当一个元素获得焦点以后,可以按下Enter键激活。不管你的web应用有多复杂,这个范例都能很好地工作。只要让使用键盘的用户能够在链接和表单控件之间导航,那么他就可以轻松的使用这个web应用。 不幸的是,有时候web开发者在创建界面的时候过于“聪明”了。当我需要某些看起来像一个链接但是表现的像一个按钮改怎么做呢?你会看到很多像这样的代码: <a href=”#” onclick=”doSomething()”>I’m a button</a> 这段代码应该有点倒你胃口。这是一个不会跳转也不做任何事的链接。它做到仅仅是通过给onclick事件添加了一个处理函数来达到某种意图。因为期待的样式是类链接样式,所以使用了锚点标记并添加了一些JavaScript。 那些熟悉ARIA的开发者可能会这样“解决”这个问题: <a href=”#” role=”button” onclick=”doSomething()”>I’m a button&[Read More]

standard

8款精致的纯CSS3按钮特效

Author : lovecicy

按钮是网页中用户交互的重要元素之一,一款吸引人眼球的按钮能更好的引导用户去点击,从而产生网站期望得到的效果。今天向大家分享8款外观精致的纯CSS3按钮特效组合,一起来看看。 1、漂亮的纯CSS3图标按钮组合 带图标的纯CSS3按钮组合,图标简洁清爽,按钮美观大方,很不错的一款按钮特效。 在线演示 / 源码下载 2、CSS伪元素实现的3D按钮 CSS伪元素实现的3D按钮,一共5组按钮,是一款绚丽的CSS3按钮特效。 在线演示 / 源码下载 3、超具立体感的CSS3 3D弹性按钮 CSS3 3D立体弹性按钮,这个按钮是使用纯CSS3制作的3D弹性按钮,你可以试着点击这个按钮,感觉非常有意思。 在线演示 / 源码下载 4、纯CSS3圆形社会化分享按钮 由网页素材大全网站整理发布的纯CSS3圆形社会化分享按钮,这款CSS3按钮十分清爽,也十分漂亮。 在线演示 / 源码下载 5、纯CSS3气泡效果的按钮组合 纯CSS3气泡效果的按钮组合,这款CSS3按钮非常具有创意,当你把鼠标移入按钮时,按钮中就会出现漂亮的气泡效果。我们有更多这样的按钮特效收藏在JS特效网站中。 在线演示 / 源码下载 6、3[Read More]

standard