Online HTML Diff

Use our free online HTML diff to perform a semantic comparison between HTML documents. Get a glimpse of what SemanticDiff can do.

How to use

To use our free online HTML compare tool, just follow these steps:

  1. Use Copy & Paste or click Load File to load the documents you want to compare
  2. If the HTML data is difficult to read (e.g. contains no line breaks), click the Prettify buttons
  3. Click Compare

You should now see a side-by-side comparison of your HTML tags and text. The diff still shows the original documents you entered, but the two documents are now aligned with each other. Red and green highlighting helps you see where they differ.

Tags, attributes or text that is only present on the left side is highlighted in red while elements that are unique to the right side set are highlighted in green.

If there is a lot of overlap between the two versions of your HTML documents, identical areas are excluded from the diff to help you focus on the actual changes.

Check out our documentation to learn more.

How it works

The tool compares HTML tags, attributes and text by first parsing them into a data structure that is independent of their textual representation. This helps us interpret them in the same way as a browser would do. Afterwards a set of rules is applied to filter out changes that do not modify the rendering of the document. This includes ignoring changes such as adding/removing unnecessary whitespace, changing the casing of a tag or changing the order of classes in a class attribute.

The remaining changes are then mapped back to the text you inserted to highlight the modifications. Our tool does not reformat your HTML input to help you locate the changes in the original input. If you like, you can still reformat your input using the Prettify buttons before diffing.

Offline usage

Our online HTML diff tool requires an internet connection to work because the computation is performed on our servers. If you are looking for a semantic HTML comparison that works offline, you may want to check out our SemanticDiff Visual Studio Code extension. It can not only compare HTML files but also supports various other programming languages and data formats. The extension performs all computations locally, so your data never leaves your machine.