作为前端工程师，切页面、做模板，是常见的工作过程。
- 切页面；
- 做模板，进行桩调试；
- 与后台联调页面模板；
- 应设计师要求改样式；
切页面
切页面，主要是和设计师打交道，要过他那一关；
- 设计师能在线查看页面效果；
什么时候都可以看到；当然这个文件也是一直要维护的；
这个页面内容应该是比较丰满的，以充分体现其设计思想，设计美感；
这个文件是发布出去的；
不论生产系统还是测试系统； - 测试工程师也能透过这个页面了解页面需求的实现程度；
做模板
做模板，是将已经做好的页面进行拆分；假如拆分为两个文件，一个为容器，另一个是被 include 文件。
我们现在命名一个是 .ssi.html 文件，一个是 .mus.html 文件。
ssi 文件引用 php 来处理 mus 文件。
未来应当生成静态文件；
目录文件
| 任务 | 目录文件 | 链接 |
|---|---|---|
| 切页面 | /html/one-detail.html | /one-detail.html |
| 做模板 1 | /html/one-detail.ssi.html | /one-detail.ssi.html?id=536 |
| 做模板 2 | /tpl/one-detail.mus.html | 由 one-detail.ssi.html 直接或间接使用 |
- one-detail 为 basename；
- ssi 和 mus 命名规则是一致的，具有美感；
.ssi.html 和 .mus.html 是为了编辑器的语法着色方便而增加 .html 后缀的。 - ssi 文件引用 php 渲染 mus 文件；
示例：``
tpl 参数不必携带 .mus.html 这个后缀； - 若采用静态文件方案，则链接为：
/cms/maintenance/one-detail/536.html，536为id；
/img/cms/maintenance/one-detail/536-featured-img.jpg；
有理想、有包容
切页面主要和视觉设计师打交道，切的好不好，其实要和设计师密切沟通。
有时设计师会时不时调整一下字号、间距、动画这些细节，一个像素都不要差，力争百分百复原设计稿。
我们知道，设计稿和页面毕竟是两个呈现系统，你使用 PS、AI 、Sketch 设计出来的东西，在浏览器上呈现出来的效果肯定是有细微差别的。
你看到的情况往往是这样的：
- 设计师出设计稿；
- 页面工程师根据设计稿切页面，百分百复原设计稿；
- 设计师看浏览器页面效果不如意，回头调整设计稿；
- 页面工程师根据调整后的新设计稿，修改页面样式；
- 设计师重看浏览器页面效果，表示满意；
在这个过程中，我们可能会想既然肯定要调整，在第2步不需要百分百复原设计稿？
答案是：不一定。
如果你和设计师不仅有充分的信任，更有一致的审美观，一致的目光如炬的火眼金睛，那么在 技术上 是不需要百分百复原的（比如像素个数、色数等硬指标），因为你们在呈现效果上是百分百复原了（几乎不可能，因为每个人的显示器、浏览器肯定不一样）。
作为技术控，页面工程师应当做到丝毫不差，这叫 有理想，是必须要追求的；也应当学会协商、妥协，建立其充分的信任，获得充分的尊重，这叫 有包容；
我觉得我们既能做到有理想，又能做到有包容，因为我已经看到这样的情况在发生了。
