html compare

Question

hi..

has anyone here used some sort of html compare tool, can anyone give me some suggestion on which html compare tool to use? i need this tool to compare the design of a website. the thing is i dont want to compare the code html, but the output design. is this even possible? also is there any opensource program of this kind?

ive searched google, but i only have one candidate so far which is HTML Match.

thanks for the help..

Answer 1

Under windows:

http://www.htmlmatch.com/

Answer 2

If you are using KDE, you can use Kompare or KDiff3.

However, if you want to view how your web page looks in different browsers in different operating systems, BrowserShots can used.

Answer 3

The keyword you're looking for is "diff".

A good program that can show you the differences between two files (html markup or other) would be ExamDiff for windows.

Answer 4

In modern webpages the appearance is controlled by various 'things': html code, css styles and images at least (also javascript in some pages). Simple text-based diff programs are not enough because their output can be irrelevant to the webpage appearance (i.e. cleaning up css can show many differences but the rendered webpage remains the same).

For simpler pages HTML Match mentioned above could do the job. If I have to compare the design of two "complex" pages (including layout, space, image and text changes) I would do a two-step approach:

1. Run a diff tool on the html sources to highlight the textual content differences. Then I would modify one of the pages to show the same content as the other (in order to make the next step more accurate and 'focused' to show 'real' layout changes). Of course it works only with very similar html.
2. Load the pages in the same web browser, get some screenshots from the rendered output at fixed positions and compare the images (i.e. with ImageMagick). It should show all visual differences in the rendered output.

It is not perfect but should work.

Answer 5

There are these online tools - that aren't brilliant:

http://www.w3.org/2007/10/htmldiff

http://www.aaronsw.com/2002/diff/

I like the look of daisydiff but have not used it in anger: http://code.google.com/p/daisydiff/