用户体验

细节让网页设计与众不同

站点。


除了为导航的活动状态选择好的颜色以外,我们发现它的设计为网站的主导航栏添加了一些用趣的细节。
Home按钮由于一些颜色变化之外的原因而很显眼。首先我们可以看到它从导航栏下沉了几个像素。其次,按钮背后被加上了阴影并且对透明度做了轻微的调整。这两个细节一起为这个链接赋予了附加维度的感觉,指示了它的重要性及激活状态。

差异

再看一下没有上面提到的细节的导航,我们发现很多令人兴奋的东西都没了并且我们的激活链接会有完全不同的样子和感觉。

细节更进一步

我们研究了一种运用CSS3的一些新功能来辅助我们设计的方法(text-shadow)。但CSS3的强大远不只是阴影。CSS3动画,表现为transform和transition的属性,给我们的细节工作增加了额外的工具。

只要使用得当,CSS3动画为我们的网页元素添加高效的动画效果,而不需要借助Flash或JavaScript。在细节方面,动画允许我们在各种 输入情况向用户提供流畅的反馈。例如为链接的hover状态或按钮点击添加过渡动画,可以告诉用户他们鼠标正悬停在(或触摸,对于触屏移动设备)一个活动 的元素上面。

与网站细节相伴的工作的美好在于通过进一步努力,我们仍然可以为我们的用户提供部分价值,而不需要疏远那些使用过时的浏览器的用户。关键之处在于我们要使用所有这些技术来为已经很可靠的网页设计增加价值,没有一个基本的可靠的设计而空谈学习这些技术就是本末倒置。

网站还能在哪些细节方面改进来增加它的价值呢?你做过的项目还成功地使用过哪些类型的细节技术?

查看英文源文

希望看到您的想法,请您发表评论x