无废话网页重构系列——（3）Web重构前的分析

本篇讲重构前的分析。从“工做状态、工做环境和工做角色”和具体重构工做两方面分析。

凡是通过考验的朋友，就应该把他们牢牢地团结在你的周围

比较理想的工做状态：制定了各类设计和开发规范，各团队之间邮件、团队内部即时通信工具或声波传输沟通，对已有的或将要孵化的项目和产品，或多或少会有参与和认识，较早的进入开发环境中，进行准备、分析和实施相关的思考。但也可能会是产品需求未肯定和频繁变动，技术规范、产品文档和开发文档还没有定义，已经要求团队进行并行开发的充满风险的工做状态。

工做环境可能是公司内部，但也有可能接触或成为 Outsourcing 开发伙伴，将会经历工期、需求、各规范、技术栈、开发模式、开发流程、产品性能迭代等方面的严峻考验。

接触过产品需求、交互文档中的各类描述，如一级页面二级页面三级页面，直接从不肯定的类目名定义具体的模块，形成“这个就是之前的/上一个版本的**分类”；接触过设计师比较随意，页面无栅格，图层无分组不命名，图标不矢量处理，间距颜色字体凭手感视觉；也有设计师很是严谨，栅格参考线锁定，组件式全部模块置于一个PSD并标注，图标iconfont拉你进项目成员组；也接触过其余同行的编码，差很少和设计稿相同的经历；

综上所述，项目开发越多，跨项目周期、跨组织跨地域、跨角色的协做问题也会越多，须要结合项目参与人员、时间节点和伸缩性等因素分析，做出合适的技术选型，和行之有效的沟通。

若是作好心理准备，一切准备都已经完成

到具体重构工做的分析，从收到设计师的稿，要考虑：站点风格，如何栅格，内容、结构、样式、行为如何分离，站点、页面公用部分和业务模块组件有哪些，主次颜色，行高是多少，标题、段落字体字号有哪几种，图文组合有几种，列表有几种，模块内外间距是多少，ICON图标有哪些，响应式布局处理…

重构不是彻底还原设计稿，是基于设计稿，提炼和整理，分析和统计，获得各个方面数据。

---

分析完成，开始动手。

（本篇结束）

许可协议：自由转载-保持署名-非商业性使用-禁止演绎 (CC BY-NC-ND 4.0)

By 小可 from https://xinlu.ink/tech/pro-web-reconstruction-3-forecast.html