10个值得推荐的Material Design前端框架

material-icons

当好的设计原理融合了科技创新,会发生什么?这正是谷歌所做到的——Material Design。

简单的说,Material Design是一种可视化的设计理念,汇集了经典设计原理和现代科技的技术规范。Material Design设计语言和与之相关的工具材料都越来越流行。

在这篇文章中,我汇总了一些非常棒的Material Design Web前端框架,也提供了这些框架的截图和demo链接。这些前端框架的设计元素齐全,按钮、表单、布局及常用JS特效代码基本上都有,支持Responsive Design,还有的可以结合Bootstrap使用,相当不错,下面来看看介绍,并挑选一款你喜欢的Framework来制作你的新项目吧。

关于网页设计的几点不得不吐的槽


今天想聊一聊关于网页设计方面的一些问题。最近在公司做网站,遇到很多客户,听了一些客户关于对自己网页设计的意见,其中有很多条值得吐槽。我随便举几个栗子。

设计稿标注首屏线的确定始末


这是内部的一个邮件记录,分享出来听下业内同行的声音。

事情是这样的..

==

先是 A 推荐了白鸦的推到内部群:

“设计师们一定要养成一个习惯:无论是原型设计还是视觉设计,一定要标注一下首屏线,明确首屏需要、可以显示到哪里。”

==

然后,B 觉得这点子不错,根据内部统计系统中的操作系统、浏览器分布和屏幕分辨率等数据,结合浏览器状态栏、任务栏等高度进行分析:

网页图像优化技巧

设计之美

身为一个网页前端开发人员,不免要经常处理一些图片。如何使图片体积更小,质量又有保证是一个问题。

图像格式概念:

.gif格式适合于动画、透明等类型图片。如果要做透明背景的logo,可以考虑输出.gif格式的,但是要注意,.gif格式透明虽然是IE6也支持的,但是它所支持的透明度较差,应用在某些颜色背景上时可能会时图片出现毛刺和白边等。.gif也适用于图片颜色较为单一的时候使用。

.png格式是一种比较好的图片格式,根据支持的色位,又分为png-8和png-24。png-8较好的一点是透明度效果好,且也被IE6支持。如果输出为png-24格式的包含透明度的图片,那就会在IE6下失去透明度,成为白色背景。如果图片颜色不是很复杂,但是也不是很单一的话,试试png-8格式,一般会比.gif格式体积更小。

.jpg(jpeg)格式适用于颜色丰富的图片,比如产品图片,风景,人像摄影等。但是不支持透明度和动画。用PS输出此类图片时,一般质量设为60-70%就比较合适了,可以兼顾到质量和体积。