HTML Guide for void elements

Void elements, like area, base, br, col, embed, hr, img, input, link, meta, source, track, and wbr are self-closing and don’t need a trailing slash /, which should be avoided as that can interfere with unquoted attribute values.

These void elements can optionally have a trailing slash and some people prefer to include it as it may look clearer. Some HTML formatters integrated in code editors automatically add a trailing slash to void elements.

So for example, both <hr> and <hr/> are valid self-closing void elements. However, when combined with unquoted values for attributes, the trailing slash can be problematic.

In this example, the img element takes http://example.com/logo.svg as the value its src attribute.

<img alt=SVG src=http://example.com/logo.svg>

But in the following example with a trailing slash, the img element takes http://example.com/logo.svg/ as the value its src attribute. That is, the trailing slash has been parsed as part of the value for the src attribute, which breaks the display of the image.

<img alt=SVG src=http://example.com/logo.svg/>

In short, this HTML warning makes you aware of this problem. When possible, it’s recommended to avoid trailing slashes in void elements.