优秀的网页项目，不会单靠好的设计或是开发就能成功——它也需要设计师与开发者的沟通与协作。

我看过相当多的设计师与开发者由于缺乏沟通而糟蹋了项目，结果导致关系恶化。我也见过很多初学的设计师和开发者，通过团队协作创造出惊人的结果。他们避开了潜在陷阱，及时发布项目，并且迅速迭代。这种协作不仅对项目有益——善于沟通协作的团队也是一个更快乐的团队。如果任务并没有如愿进行，也会有更少的误解与紧张。

各团队如今都要应对大批设备。固定的、“像素精准”的设计，如今该让位于流动的百分比设计。而且，图片资源也需要为多种设备尺寸与分辨率进行优化。

简而言之：——这也会导致更多问题。我发现一些技巧，可以克服这些障碍。

1. 首先关注“最极端”的屏幕尺寸

如果对此存疑，可以根据网页的一般经验设定屏幕尺寸范围：iPhone尺寸和桌面浏览器展开。

很多响应式图片需要多套资源。我个人网站的主页头图，根据屏幕尺寸和分辨率不同，会从6张不同图片中选择一张呈现。

图片格式与尺寸，通常是设计师与开发者之间的障碍。你可以使用PNG、JPG、图标字体，或者用SVG实现更小的元素或图标。并没有哪个是正确答案：一切都取决于内容和可用的资源。但重要的是对某种格式达成一致，坚持使用它。而且随着网页项目的进行，你还可以创建一些常用图片尺寸。

不过对于如今的响应式设计，这只是刚开始。你要至少输出2套位图资源（JPG）：1套给普通显示器，一套给高分辨率显示器。高级的响应式图片技术，需要更多套资源适应不同屏幕尺寸。

至少要有一套像素密度显示策略。看看srcset和Picturefill，来保证良好的跨浏览器支持。如果感觉太过了，就从简单入手。用srcset属性来更换一些图片元素，这是个好的开始。看它如何处理，然后由此展开。

4. 微观的思考，模块化的设计

我的响应式设计工作流程深受Brad Frost的Atomic Web Design和Jonathan Snook的SMACSS影响。两者的框架都依赖小型、可复用的组件，以此为基础打造强大的网站结构。

对于交付给开发的资料，我喜欢先专注于小型、可复用的组件。因为它们在不同设备上，通常表现出同样的体验和外观。这样的统一性有利于开发团队消化。另外，小组件通常更容易跨页面复用。所以如果你设计了一套有效的解决方案，之后再重复使用就非常简单了。

小组件通常在不同设备上表现出同样的体验和外观。这样的统一性有利于开发团队消化。

假设你在设计一个注册页面，有标题、大幅图片和表单。根据设备不同，这些元素可能会变换交错或是改变尺寸。起初，要同开发团队一起专注于注册表单的小细节。它看起来是怎样的？需要怎样的验证？相对鼠标键盘，触摸输入会使表单发生什么变化？

5. 从开发者那里获得视觉与用户体验的反馈

有些设计师把开发者阻挡在产品会议、可用性讨论和其他反馈机会之外。只有一个启动仪式，交付一些资源，和一点点其他东西。这是错误的。

要记住，经验丰富的开发者掌握大量知识。如果他们与产品接触了一段时间，他们可能也有独到见解。

越来越多的设计师自己写代码。开发者也在刻苦钻研快速原型设计、线框图和美术设计。响应式设计加剧了这项趋势。即使没有“设计师”的头衔，一名开发者也可以表达出强有力的设计见解。

我们得承认，角色与责任的独立仍然有其价值。但稍加融合便可显著改善最终产品。所以，在你的下个可用性测试中，请一位开发者加入来讨论最终产出吧。或者如果你在进行一场设计头脑风暴，或许应该邀请一些开发者。

合作很重要

所有这些技巧都需要规划和认同。由于注重产品发布与截止日期，这就难以做到。但设计与开发关系良好对任何网页项目，尤其响应式设计项目都是有益的。初期的小投资，会为你的团队带来指数级的回报。

原文链接

作者信息：

Nick Schaden, Web Platform Lead at Pocket

At Pocket, Nick oversees development and design initiatives on Pocket’s web app, Chrome packaged app, and marketing web sites. He has extensive experience introducing and integrating responsive web design, both at Pocket and previously at Animoto, a video startup based in New York. Prior to Pocket and Animoto, Nick worked in technology at Gucci and Goldman Sachs. He loves electronic music and 80s action movies.Follow me on Twitter

#专栏作家#

可乐橙，微信公众号：可乐橙（colachangreen）。人人都是产品经理专栏作家，UI/UX设计师，关注互联网，关注科技。现居杭州，与小伙伴们正在创业途中。或许不是一名优秀的设计师，至少是个快乐的设计师。

转载请保留上述作者信息并附带本文链接