HTML – 你知道一个网页外观比较器吗?

前端之家收集整理的这篇文章主要介绍了HTML – 你知道一个网页外观比较器吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要一个工具来比较一个网站的设计,我不想只比较HTML代码,而是输出设计.

这有可能吗?还有这种开源程序吗?

搜索了谷歌,但到目前为止我只得到一个候选人,这是一个HTML匹配.

解决方法

在现代网页中,外观由各种“事物”控制:HTML代码,css样式和图像至少(在某些页面中也是javascript).简单的基于文本的差异编程是不够的,因为它们的输出可能与网页外观无关(即清理css可能会显示许多差异,但渲染的网页保持不变).

对于更简单的页面,上面提到的HTML Match可以完成这项工作.如果我必须比较两个“复杂”页面的设计(包括布局,空间,图像和文本更改),我会采取两步法:

>在html源上运行diff工具以突出显示文本内容差异.然后我会修改其中一个页面显示与另一个页面相同的内容(为了使下一步更准确和’专注’以显示’真实’布局更改).当然它只适用于非常相似的html.
>在同一个Web浏览器中加载页面,从固定位置的渲染输出获取一些屏幕截图并比较图像(即使用ImageMagick).它应该显示渲染输出中的所有视觉差异.

它不完美但应该有效.

[更新] HTML Match似乎已经死亡,请参阅this answer获取替代解决方案.

猜你在找的HTML相关文章