🙅🏼‍♂️ A closing slash on void HTML elements?

Add an extra slash to void HTML elements?

  • <br>

    Votes: 0 0.0%
  • <br />

    Votes: 3 100.0%

  • Total voters
    3

Adam

Mr. Webwide
Administrator
Local time
14:21
Joined
Sep 24, 2019
Messages
1,257
Pronouns
he/him

According to the HTML5 spec, there are a handful of tags that must not have contents. Those are area, base, br, col, embed, hr, img, input, link, meta, param, source, track, wbr.

It seems like it's left up to us how we format those. We can leave it 'open' like <img src="cat.gif">, <br> or 'close' them like <img src="cat.gif" />, <br />.

I sway towards closing them with a forward slash at the end, I think it's more readable. Do you have a preference or a good reason for either way?

Opinion on this seems to have shifted quite a bit through different versions of HTML.

  • HTML5: the slash is optional.
  • HTML4: the slash is technically invalid. However, it's accepted by W3C's HTML validator.
  • XHTML: The slash is REQUIRED.

 
Last edited:

Gummibeer

Astroneer
Moderator
Local time
15:21
Joined
Oct 5, 2019
Messages
1,169
Pronouns
he/him

I've learned it that way, I will stick to it!
So for sure with slash. 😅

It also has the benefit that I know that this element is closed there.
I know that HTML5 can interpret them without, but for me it's the same like with semicolon in JS. I will always write them to finish a line and flag end of statement. If my minifier, Babel, webpack whatever tool removes isn't important for me. I only care about what I have to work with - source code.

 
Last edited:

LividJay

Member
Local time
09:21
Joined
Feb 16, 2020
Messages
61

I use Visual Studio and it automatically adds them, so I leave them. Otherwise I'd probably not put them in myself. Not going to vote since the only two options don't cover my scenario.

 

Adam

Mr. Webwide
Administrator
Local time
14:21
Joined
Sep 24, 2019
Messages
1,257
Pronouns
he/him

I use Visual Studio and it automatically adds them, so I leave them. Otherwise I'd probably not put them in myself. Not going to vote since the only two options don't cover my scenario.
That’s interesting VS adds it! I guess that gives it some credence to being the more standard way.

 

Gummibeer

Astroneer
Moderator
Local time
15:21
Joined
Oct 5, 2019
Messages
1,169
Pronouns
he/him

That’s interesting VS adds it! I guess that gives it some credence to being the more standard way.
Phpstorm doesn't by default. So it depends on the IDE/audience or that phpstorm sticks to the standard by default and VScode to that what the developers use most.

 
Top