咨询热线:18609840880

资讯中心

秉承严谨的态度,为您提供专业的服务

五大技巧提速响应式网页设计(下)

发表时间:09-30  浏览次数:0


新图闻(大连网站建设)继续接上次的提速响应式网页设计技巧,今天为大家带来下面几个关键点:

3、对于图片素材的处理策略早做准备(大连网站设计)

响应式网页中的图片,通常是由一组多个不同尺寸的图片组成的。比如新图闻(大连网站建设):http://www.xintuwen.cn,就是由一组6个图片组成的,分辨率和尺寸各不相同,不同的设备都能匹配上对应的图片。

图片格式和尺寸通常会让团队内的大连网站建设设计师和开发者之间产生隔阂。你可以用PNG,也可以用JPG,图标字体和SVG也会在网页上很好的运用。也就是说,并没有一个正确的答案:用什么更多是取决于可用的内容和资源本身。但是重要的地方在于,大家要在使用格式上达成共识,并且坚持使用下去。另外,你可能也想钻研出一套通用的图片尺寸体系,运用在不同的项目中。

不过对于现代的大连网站建设响应式网页设计,这仅仅只是一个起点。现在要做你至少需要两套图片素材,一种是给普通PPI的屏幕所设计,一种是给高PPI的视网膜屏所准备的。更完备的响应式网页,对于图集和素材的要求更高,细分更多,针对性更强。

尽量避免将响应式图片格式的筛选决策留到项目后期。

较起码,你得针对不同像素密度的屏幕作出基本的区分。仔细读一下这篇关于srcset的文章,或者使用Picturefill这样的工具来跨浏览器支持。如果你觉得整个方案不堪重负,那么不妨从小的部分开始做起。逐步调整图片元素的srcset属性就是一个不错的开始,在这个过程中,你会逐步看到网页的响应越来越靠谱。

4、从基础元素开始思考,使用模块化设计(大连网站制作)

大连网站建设响应式网页设计流程深深地受到了Brad Frost 的Atomic Web Design和Jonathan Snook 的SMACSS的影响。两个框架都依靠小而可复用的基础组件来实现强大的网络架构。

所以,在与开发者交接的过程中,我会优先专注小而可复用的组件,因为它们能给不同平台不同设备带来相同的用户体验和视觉效果。这种一致性会更容易为开发团队所消化吸收。而且,小组件在不同页面之间的复用性也非常强,所以,如果你为大连网站建设设计出了一套高效的方案,今后还会有用武之地。

想象一下,你正在设计大连网站建设一个带有大标题、高清大图和表单的注册页面。由于网页是响应式的,所以所有这些元素都会随着设备和屏幕的转换而变化尺寸。那么在项目研发早期,应该同开发团队一起钻研,敲定页面所涉及的各个细节。它看起来应该是什么样子?用什么样的验证机制?如果要输入表单,如何配合触摸屏和传统的键鼠?

5、让开发者给视觉和体验设计做反馈(大连网站设计)

有些大连网站设计师在产品设计会议、可用性设计环节和其他的沟通环节不让开发者参与或提供反馈。这种放任和封闭是错的。要知道,经验丰富的开发者在产品、体验和设计领域同样有着极为丰富的知识。让他们参与到这些环节中,能让产品更加成熟。前端和设计师在技能上的重叠就更多了。

越来越多的大连网站建设设计师开始自己写代码了,开发者也逐渐习惯于制作快速原型、先框图,并且也会在私底下恶补美学和设计类的知识。响应式网页设计的出现,使得两个职业之间的交叠越来大连网站建设越多,加剧了这一趋势。虽然没有大连网站建设设计师的头衔挂在开发者头上,但是他们对于大连网站建设设计往往能说出惊人之语,发人深省。

当然,不同的角色和职责的划分依然是极为重要的。但是稍微调整一些小步骤,确实能显著提高较终产品。所以,你做下一轮产品可用性测试的时候,不妨带着开发者一起来讨论。

结语:

所有这五个技巧都需要实现计划,并且不停补充。绝大多数团队都将注意力放在产品的发布和卡Deadline上,这个阶段再来考虑这些问题,不利于产品,也不适合此刻团队内的设计师和开发者。

项目开发之初,稍加计划,后期的回报绝对是丰厚的。

「新图闻(大连网站建设)知识讲堂:」

知识和知识之间是互通的。响应式网页设计是凭空出来的么?不是,Ethan Marcotte 也是受到了建筑学的启发,才有了这一创举。

Ethan 在A List Apart上发布《Responsive Web Design》一文时,援引了响应式建筑设计的概念:现出现了一门新兴的学科——”响应式架构(responsive architecture)”——提出,物理空间应该可以根据存在于其中的人的情况进行响应。结合嵌入式机器人技术以及可拉伸材料的应用,建筑师们正在尝试建造一种可以根据周围人群的情况进行弯曲、伸缩和扩展的墙体结构;还可以使用运动传感器配合气候控制系统,调整室内的温度及环境光。已经有公司在生产”智能玻璃”:当室内人数达到一定的阈值时,这种玻璃可以自动变为不透明,隐私。

以上内容由新图闻(大连网站建设,大连网站设计,大连网站制作)为您提供,更多精彩内容:http://www.xintuwen.cn/

关注“新图闻”微信公众号,快速获取互联网较新资讯

版权所有:大连新图闻科技有限公司. 保留一切法律许可权利 代理律师:戴律师