如何检查前端 HTML 与 UI 的效果还原度？

[hulei]

前端切图是完全手动的过程，这个时候更多的是靠开发人员细心的去对比设计图，麻烦的是难免会和设计图有些误差，目前我们想到的是产品上线前，让 UI 介入做一次还原度走查，但是这样会增加工作量，并且不是在源头解决问题，大家在这个过程是如何页面效果一致性的呢？

[Pudge1337]

不管怎样 ui 验收都是必须的吧

[rabbbit]

https://chrome.google.com/webstore/detail/perfectpixel-by-welldonec/dkaagdgjmgdmbnecmcefdhjekcoceebi
直接把设计稿贴上去

[belin520]

截图，调整整体透明度，与设计稿重叠，看看是否有偏移。

[luoway]

image diff
别搞透明度、重叠、偏移了，眼都瞎了

[ibegyourpardon]

首先，实际页面存在多设备兼容这个问题，除非 UI 全给做到，否则 100% 还原度就没法做到。

我们现在暂时提倡的方法是不追求字面意义的 100%还原，而是由 UI 给出对元素兼具，字体大小等等的要求，详细到 font-size，元素在不同界面尺寸下的不同间距，然后前端只管照这个来堆上去。