Do We Still Need Forward Slashes When Closing Void Elements in Html5

Do we still need forward slashes when closing void elements in HTML5?

img tags are Void Elements so they do not need an end tag.

Void elements
area, base, br, col, command, embed, hr, img, input, keygen, link, meta, param, source, track, wbr

...

Void elements only have a start tag; end tags must not be specified for void elements.

W3C | WHATWG

That being said it's not strict parsing in HTML5 so it won't do any major harm.

Self-closing tags (void elements) in HTML5

There is no consensus on best practice, and according to the author of the spec, Ian Hickson, it does not matter.

Are (non-void) self-closing tags valid in HTML5?

(Theoretically) in HTML 4, <foo / (yes, with no > at all) means <foo> (which leads to   meaning  > (i.e.  >) and <title/hello/ meaning <title>hello</title>). I use the term "theoretically" because this is an SGML rule that browsers did a very poor job of supporting. There was so little support (I only ever saw it work in emacs-w3m) that the spec advises authors to avoid the syntax.
In XHTML, <foo /> means <foo></foo>. This is an XML rule that applies to all XML documents. That said, XHTML is often served as text/html which (historically at least) gets processed by browsers using a different parser than documents served as application/xhtml+xml. The W3C provides compatibility guidelines to follow for XHTML as text/html. (Essentially: Only use self-closing tag syntax when the element is defined as EMPTY (and the end tag was forbidden in the HTML spec)).
In HTML5, the meaning of <foo /> depends on the type of element:
- On HTML elements that are designated as void elements (essentially "An element that existed before HTML5 and which was forbidden to have any content"), end tags are simply forbidden. The slash at the end of the start tag is allowed, but has no meaning. It is just syntactic sugar for people (and syntax highlighters) that are addicted to XML.
- On other HTML elements, the slash is an error, but error recovery will cause browsers to ignore it and treat the tag as a regular start tag. This will usually end up with a missing end tag causing subsequent elements to be children instead of siblings.
- Foreign elements (imported from XML applications such as SVG) treat it as self-closing syntax.

Why do some HTML tags end with a forward slash?

In XHTML <foo /> is shorthand for <foo></foo>. In HTML the syntax is obscure and marked as "don't do this" as browsers don't support it.

If you are writing XHTML but pretending it is HTML (so that browsers (such as Internet Explorer 8) which don't support XHTML can handle it), then elements defined as EMPTY in the specification must be represented that way (and elements which are not must not).

HTML 5 became a recommendation five years after this answer was written and changes the rules.

Do we still need the space before the slash in hr / and others?

According to the HTML5 specs, void elements don't need the self closing / character.

Their exact phrasing is

Then, if the element is one of the
void elements, or if the element is a
foreign element, then there may be a
single U+002F SOLIDUS character (/).
This character has no effect on void
elements, but on foreign elements it
marks the start tag as self-closing.

They list void elements as area, base, br, col, command, embed, hr, img, input, keygen, link, meta, param, source, track, wbr

I may be understanding it wrong, but that seems like the following are all valid for html5

<hr>
<hr/>
<hr />

So it seems it really depends on the doctype you use

Can I safely omit the closing slash on use and path elements?

Closing tags on path are needed or they will nest. I think it's safe to omit the slash on a use element though.

Compare these two:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4557 1024"><path d="M768 1024l-768-768v-256h128l640 640v-640h256v1024h-256z"><path d="M1177.6 1024v-1024h1024v256h-768v128h768v256h-768v128h768v256h-1024z"><path d="M2355.2 1024v-256h768v-128h-768v-640h1024v256h-768v128h768v640h-1024z"><path d="M3532.8 1024v-1024h256v384h512v-384h256v1024h-256v-384h-512v384h-256z"></svg>    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4557 1024"><path d="M768 1024l-768-768v-256h128l640 640v-640h256v1024h-256z"/><path d="M1177.6 1024v-1024h1024v256h-768v128h768v256h-768v128h768v256h-1024z"/><path d="M2355.2 1024v-256h768v-128h-768v-640h1024v256h-768v128h768v640h-1024z"/><path d="M3532.8 1024v-1024h256v384h512v-384h256v1024h-256v-384h-512v384h-256z"/></svg>

Use slash after HTML tag

after search i found in this link that

in HTML 5, <foo /> means <foo>, the start tag. It is not a
"self-closing tag". Instead, certain elements are designated as having
no end tag, for example  . These are collectively called void
elements. The slash is just syntactic sugar for people who are
addicted to XML. Using the slash in a non-void element tag is invalid,
but browsers parse it as the start tag anyway, leading to a mismatch
in end tags.

HTML 5: Is it br , br/ , or br / ?

Simply   is sufficient.

The other forms are there for compatibility with XHTML; to make it possible to write the same code as XHTML, and have it also work as HTML. Some systems that generate HTML may be based on XML generators, and thus do not have the ability to output just a bare   tag; if you're using such a system, it's fine to use  , it's just not necessary if you don't need to do it.

Very few people actually use XHTML, however. You need to serve your content as application/xhtml+xml for it to be interpreted as XHTML, and that will not work in old versions of IE - it will also mean that any small error you make will prevent your page from being displayed in browsers that do support XHTML. So, most of what looks like XHTML on the web is actually being served, and interpreted, as HTML. See Serving XHTML as text/html Considered Harmful for some more information.

Do We Still Need Forward Slashes When Closing Void Elements in Html5