Skip to content

2010年08月6日

让前端忍不住喊爽的设计元素

现状

1. 视觉效果太复杂,前端一看就傻眼了,实现成本太大;
2. 界面太简陋,仅采用一些简单元素比如直角、实色填充等实现设计。

其实可以尽情地使用这些设计元素

1. 水平或垂直的线性渐变
2. 箭头及各种箭头的变型
3. 单像素圆角
4. 简单阴影
5. 半透明背景

以上这些设计元素对于前端实现来说有个相同的特点:即可以通过添加少量标签或完全利用CSS特性完成,实现成本和后期维护成本低,扩展性高,且不需要任何图片。图片对前端来说就是个难搞的事情,尤其是现在关注性能的同学还需要进行sprites合并。(真的,我宁愿多加几个tag,也不愿多加一张图片)
如果您认可优雅降级,还可针对高级浏览器选择以下设计元素

当然,IE用户是看不到的。

1. 圆角
2. 复杂的阴影
3. 文字阴影

此外,设计师们还可以为Chrome、Safari浏览器设计一些小动画,比如鼠标移上去icon旋转下之类的。

只有让设计师更了解前端,才能实现设计效果和前端开发成本的双赢。

欢迎补充。

来源:http://www.chencheng.org/blog/2010/08/04/cool-design-elements/

原文来自:UED TEAM


欢迎转载,转载请注明: 转载自田园牧歌

本文链接地址: 让前端忍不住喊爽的设计元素

其它文章

Read more from 前端开发

Share your thoughts, post a comment.

(required)
(required)

Note: HTML is allowed. Your email address will never be published.

Subscribe to comments