一家网站建设公司里的设计师，到底干哪些活

“你们设计师能出几版图？”这是不少企业**次接触建站公司时会问的话。这个问题背后藏着一个很普遍的误解：把设计师当成画图的人，效果图漂亮就算合格。

真进了项目才发现不是那么回事。页面上线后跟设计稿差得远——字号变了、间距崩了、移动端完全是另一个网站。追起责任来，设计说前端没还原好，前端说标注不清楚。最后吃亏的是企业自己。

这篇文章把设计这块在网站建设项目里实际要干的活拆开讲清楚，也方便你在看方案的时候知道该问什么。

设计不是最后一环，而是最前一环

多数人以为顺序是这样：先定功能，再让设计师美化。实际上正规的建站流程里，设计从需求确认那天就介入了。

举个具体的例子。一家做精密零部件的客户要做官网，最初的需求只有一句“展示产品和公司资质”。进入设计环节才发现，他们的海外客户习惯搜“材料 + 公差 + 认证”，国内客户则搜“XX零件 厂家”。两类人的浏览路径完全不同，页面结构必须分叉：首页得让海外访客用树形导航快速找到材料类目，同时给国内访客留一条直达联系表单的通道。

这个判断叫信息架构，属于设计范畴，跟好不好看没关系。如果设计师在这个阶段缺席，等到视觉稿阶段才发现逻辑不对，返工的成本会高得多。

四个阶段，四类活

我们把一件网站设计的活分成四块，各自有明确交付物。

需求文档怎么写这件事，我们在里给过一页纸的模板，这里不展开。想说的是：前两个阶段做得扎实，后面返工就少。

原型阶段：别急着讨论颜色

原型图是灰的，这点是故意的。它解决的是“点这里会去哪”“这块内容放不放得下”这类问题。

我们内部统计过，在原型阶段做调整的耗时，大约是上线后再修改的十分之一。这个比例在不同项目会有浮动，但数量级的差异是稳定的。

所以看到黑白线框图的时候，请不要纠结“这个颜色不太好看”。那时候还没到定颜色的时候。真正该确认的是：产品的分类逻辑对不对、联系方式是不是够显眼、移动端会不会藏得太深。

视觉稿：不是出图，是定规则

视觉稿最容易被人理解为“把页面画漂亮”。其实它真正的作用是把规则确定下来：主色用到哪些场景、标题层级有几种字号、正文行高多少、卡片圆角多大。

规则定下来之后，后续新增页面就有据可依，不需要每一页都重新设计一遍。这对于后期要不断加产品页、加案例的企业尤其重要。

这里有个常犯的错误：设计师把全部精力放在首屏那张效果图的观感上，忽略了内页规范。结果是首页看着很炫，点进产品列表页就发现风格不统一——标题字号忽大忽小、卡片间距对不齐。原因就是设计师只交了首页图，没交规范。

切图和标注：决定还原度的关键一步

设计定稿之后的工作是切图。这一步做得糙，前端再怎么努力也还原不出来。

合格的切图交付至少包含：

• 按 2 倍图导出所有图标与插画，必要时还要给 SVG 矢量文件。
• 标注页面横向宽度、栅格列数、模块间距的实际像素值。
• 说明响应式断点：比如屏幕宽度小于 768px 时导航折叠，再往下则图片改为单列。
• 提供各状态样式：按钮 hover、表单校验失败、列表为空时怎么显示。

最后一条最常被漏掉。设计师通常只画理想状态，结果前端做出来表单报错时样式崩了，回去再问，来回一周就过去了。

上线前的还原度检查，别省

页面开发完成后，设计师需要跟一遍。检查的点通常是：

1. 字号和行高对不对，尤其是中文字体在不同系统下的渲染差异。
2. 移动端有没有出现横向滚动条。
3. 图片有没有被拉伸变形。
4. 实际内容比设计稿长或短时的表现，比如产品名特别长。

第四点最能看出网站有没有认真做。设计稿永远是标准长度的文本，真实数据是参差不齐的。不做这轮检查的网站，上线三个月后通常就变得乱七八糟。

怎么判断一家公司的设计到底行不行

不用看案例图漂不漂亮，那都是挑出来的。可以直接问这几个问题：

• 能不能看设计规范文档？有规范说明流程完整；只有一堆图片的，通常是临时凑的。
• 原型和视觉是两个阶段吗？如果直接跳到效果图，说明中间环节的活被省了。
• 交付包里有没有标注和切图？拿不出标注文件的，还原度基本靠猜。
• 做过响应式断点说明吗？没有的话移动端大概率出问题。
• 上线后还管还原检查吗？正规流程里这是必选项。

另外可以留意一个小细节：这类细节如果对方能说出“线性图标在小尺寸下会糊，所以列表用线性、导航用面性”这种带理由的判断，通常比只会说“这样更好看”的靠谱得多。

关于设计费用，说点实在的

深圳这边，纯设计环节在整个官网项目里的占比，常见区间是总价的 20%-35%，当然这只是深圳市场公开参考区间，并非本站报价，具体要看页面数量和是否需要定制插画。

要提醒一点：报价特别低的设计，往往意味着套模板或者省略了原型与标注阶段。前期省下来的钱，通常会在返工和后期改版时还回去。

企业自己这边能做什么

设计不是纯外包出去的活，乙方做得好不好，跟甲方的配合关系很大：

• 明确最终拍板人，**只有一个人，避免三轮修改意见互相打架。
• 提前准备 Logo 源文件、品牌色值、产品实拍图——素材的质量直接影响成品。
• 提意见时说原因，比如“这个标题层级在手机上分不清主次”，比“感觉不好”有用得多。
• 不要拿别人网站的功能型设计硬套自己，业务不同，结构就该不同。

最后提醒一个常见坑

有些公司为了拿下项目，会把设计稿做得特别炫——大量动态效果、全屏滚动、视差。这些效果在演示时很抓眼球，但对企业官网的实际转化帮助有限，还会拖慢加载速度、增加后续维护成本。

官网的核心任务是让人快速理解你是做什么的、怎么联系你。华丽是不该以牺牲这两点为代价的。

如果你正准备启动官网设计，想先把品牌素材、参考方向和取舍清单理清楚，可以直接致电 13928418795，我们会按你所在的行业给出具体的准备清单和节点建议。