Comparing HTML Web Content with DeltaXML

Posted15 November 2013
byPhil G. Fearon

In this age of the Web, the reliable comparison of HTML is becoming increasingly important. This blog post introduces an early incarnation of HTML5 Compare, a new online HTML comparison tool from DeltaXML.

The user interface is a simple form where you enter the URLs for the two HTML documents to compare, and then press Run to start the comparison:

HTML UI

The HTML comparison takes a few seconds, perhaps 30 for a very long document, after this, you should see the HTML result. This resulting HTML document is initially in ‘View Both’ mode, it shows the combined inputs, with red and green highlighting showing deletions and additions. Alongside the ‘View Both’ button (superimposed on the top-left of the page), there are two further buttons, ‘View Old’ and ‘View New’. Clicking on these buttons allows you to switch between views as required, the views available are shown in the diagram below:

HTML comparison examples

The HTML5 comparison result, hosted on the DeltaXML site, includes updated relative references within hyperlinks and images to ensure they still link to original source, these references are illustrated in the above diagram. When comparing images, things are taken a step further to ensure that image differences are shown when, and only when, the referenced image source file shows a difference following a binary file comparison.