做网页设计这行，最怕的不是改稿，而是写说明书。
真的，别不信。
很多刚入行的设计师，或者转行做UI的兄弟，总觉得把图切出来就完事了。大错特错。
我上周刚接了个私单，甲方是个传统制造业老板，不懂设计，就认死理。他让我出一份详细的ps网页设计说明书。我一开始没当回事，随手写了个几百字的文档发过去。
结果呢？
第二天电话轰炸，问我为什么按钮颜色不对，为什么间距没对齐。我一看，我说的是“大致均匀”，他理解的是“像素级对齐”。
这就是坑。
今天不跟你扯什么高大上的理论，就聊聊这玩意儿到底该怎么写，怎么卖，怎么避坑。
首先，ps网页设计说明书这东西，不是给设计师看的，是给开发看的，是给甲方验收看的。
你写得太专业，开发看不懂，甲方觉得你装。
你写得太简单，开发做出来的东西跟你画的图两码事，最后锅还是你背。
我一般怎么搞？
直接上截图。
别光文字描述。
比如那个导航栏，我会截一张图，标出高度是80px，背景色是#333333，字体是微软雅黑，字号14px。
就这么简单。
但这里有个坑，很多新手会忽略。
就是标注工具。
你用的ps，肯定有切片或者标注插件吧？别自己手动画线，容易歪。
用现成的工具，比如Zeplin或者蓝湖，虽然它们是前端用的，但你导出标注图，截图贴进ps网页设计说明书里，效果最好。
这样开发一眼就能看清。
价格方面，我也透个底。
如果你只是做个简单的静态页面，ps网页设计说明书的价格大概在200到500块一份。
别嫌少，这是纯体力活。
要是涉及交互逻辑，比如点击按钮弹出什么，鼠标悬停变什么颜色，那价格得翻倍，至少800起步。
因为你要写清楚状态。
正常态、悬停态、点击态、禁用态。
少写一个状态，开发做出来就是坏的。
我就吃过这个亏。
有一次给一个电商网站写说明书，忘了写购物车图标的角标状态。
开发直接没做，上线后甲方投诉，说看着像没数据。
我加班改了两小时，还得挨骂。
所以，ps网页设计说明书里，一定要包含这些细节：
1. 颜色值。别写“红色”，要写#FF0000。
2. 字体大小和行高。别写“适中”，要写16px，行高24px。
3. 间距。元素之间的距离，比如padding和margin，一定要标清楚。
4. 交互说明。虽然ps做不了动态，但你可以在旁边备注：点击后跳转至XXX页面。
5. 切图规范。告诉开发，哪些图是png，哪些是svg，哪些直接写代码实现。
别嫌麻烦。
你现在的麻烦，是以后少挨骂。
还有，别把所有东西都塞进一个文档。
如果页面多，就分模块写。
首页一个，详情页一个。
这样看着清爽，甲方也容易接受。
我有个习惯，喜欢在文档最后加个“常见问题”。
比如，如果图片加载慢怎么办？
如果字体在不同浏览器显示不一样怎么办？
把这些预判的问题写进去，显得你专业，也显得你贴心。
当然，ps网页设计说明书也不是万能的。
有些复杂的动画，ps根本表现不出来。
这时候，你得配合原型图，或者录个屏，发个gif。
别硬撑。
承认自己的局限，比装懂强一万倍。
最后说句掏心窝子的话。
别指望一份说明书能解决所有沟通问题。
最好的沟通，还是当面聊，或者视频聊。
说明书只是辅助，是证据，是留底。
当你和开发扯皮的时候，它能救你的命。
当你和甲方扯皮的时候，它能证明你没偷懒。
所以，认真对待每一份ps网页设计说明书。
哪怕它只是你职业生涯中很小的一部分。
毕竟，细节决定成败，也决定你能不能按时拿到尾款。
别等被骂了才后悔没写好。
那时候，哭都来不及。
好了，就这么多。
希望能帮到正在头疼写文档的你。
如果有啥疑问，评论区见。
别私信，私信不回。
哈哈，开个玩笑。
其实我都看。
只是有时候忙，回得慢。
理解一下。
做这行，都不容易。
共勉吧。
