网页设计中的透明效果,有人把它比作万金油一般,能够修补网页某个部位带来的不足。但在小编看来,网页设计中透明效果的运用既美观又棘手。当然,只要正确的把握了透明效果使用的度,才能真正的发挥透明元素的作用,让你的页面栩栩如生。下面我们一起来探讨一下透明效果的正确使用及其给网页带来哪些作用。
1、内容模块和网站框架的对比
运用透明图层,不透明度在80%左右,让字体清晰可见,避免挫伤用户体验。
2、半透明导航的跟踪运用
新浪微博,腾讯微博等等,都在顶部导航上做了半透明的处理,用于固定浮动来跟踪用户页面的浏览,方便用户操作主导航。
3、使用较小的透明模块来衬托网页背景,有层级关系。
网站的封面有着至关重要的作用,因为用户在7秒(营销的用户停留捕获时间,有相应的知识)内会做出对需求的反应,因此让你的页面不再单调,使用合适的文字和透明模块,进一步突出重要信息,让页面层级分明。
4、采用透明为艺术方式进行页面设计
如何保证网站信息的可读性?透明区和不透明区的空间比例,是信息展现的重要规划。将透明作为一种艺术表现,是值得借鉴的方式。
5、网页元素(例如图标、背景图片、产品图片)千万要避免设置透明
透明的设计,应该在一个交互影响的范畴内设计,避免使用透明图标,透明产品图片等细节元素去做透明,这样将大幅度降低用户的信息可读性,您可以运用图片倒影,图标阴影等手段进行“美化设计”。
6、将背景设计成透明场景,适当加上透明元素造成视差效果,学会创造网页场景
生活中有很多有透明感的东西,玻璃,水,窗户,电脑屏幕等等,都可以利用它们的透明感,来进行场景化的设计。这里设计者故意营造视差效果,造成一种3D错觉,可以让网站更加富有质感和活泼气息
7、页面中静止或者有运动嫌疑的图片,可以适当采用透明度设计,可以以此增加网站的交互性
比如活动的炫丽图标,活动的可以旋转,缓动的图片导航菜单等等,让整个网站跳出传统布局,产生新颖感
8、使乱七八糟的banner 图边的流畅。如今扁平化为主刘的网页设计,使用大图作为banner是十分普遍的。若你用一些插花或一些比较有质感的图被骗作为背景时,文字家上去,会把整个画面弄得乱七八糟。而且使文字不易被用户阅读,这时最佳的解决方案是叠加一张透明效果。
还有、、、、
突出文字主题不管是海报还是网站,文字都占着主导性的作用,当背景颜色鲜明、图片空间结构明显、不容易找到文字的摆放位置时,不妨试试透明效果,做到完美的效果;
集中用户的注意力
透明效果的运用可以把次要的隐藏起来,设计特定的一块区域,吸引用户的眼球。
透明效果提升网站的艺术水准,提高网站界面的整体质感
透明效果的使用可以强化品牌的推广
透明效果是一种很讨巧的艺术效果,学会使用透明效果,会给你的网页设计带来不一样的效果。但凡事请把握其一个度。