67

For curiosities sake, why is the <img> tag not closed in HTML?

<img src="smiley.gif" alt="Smiley face" height="42" width="42">

I also noticed that <img> tags are explicitly closed in XHTML...

<img src="smiley.gif" alt="Smiley face" height="42" width="42"/>

W3Schools: Image Tag

ѺȐeallү
  • 2,887
  • 3
  • 22
  • 34
  • Because it has no content? It does everything via attributes, it's not possible to have child elements or text, there's nothing to go inside it, it only makes sense for it to be self closing, and unfortunately HTML is too loose with standardisation for it to ever be required to be an explicit self closing tag. – scragar May 27 '14 at 13:30
  • 7
    @scragar: Not sure what you mean by that last statement - HTML is extremely well-defined and standardized and has been for many years. – BoltClock May 27 '14 at 13:34
  • 1
    @BoltClock I mean that the standards are to be extremely forgiving, it's perfectly fine to not close tags, the browsers are expected to guess where the tags close based on the general rules of the language. `

    text1

    text2

    text3` should create 3 paragraphs, but most browsers will assume each `

    ` closes when the next begins, despite it having a closing tag that's commonly used. The standards say this is fine and perfectly expectable behaviour.

    – scragar May 27 '14 at 13:45
  • @scragar: That's the expected behavior since a paragraph cannot contain another paragraph (only inline elements). – Madara's Ghost May 27 '14 at 13:59
  • @SecondRikudo Read what I wrote, I said it was correct behaviour according to the HTML standard, it's just not correct behaviour according to XML standards, which is what we're comparing HTML to here. HTML follows a different set of far more forgiving rules. – scragar May 27 '14 at 14:02
  • On a tangent — worth noting that `audio` and `video` are not void (empty) elements, since they can contain fallback elements. This will cause weird layout glitches if you're not careful. – Sam Dutton Jul 27 '18 at 17:35

5 Answers5

61

Historically, HTML has been based on SGML which allows tags to be omitted under certain conditions.

Since the <img> element cannot have any child nodes, it is defined as EMPTY and the end tag is forbidden (as it would serve no purpose).

XHTML is HTML expressed in XML, and XML does not support optional or forbidden tags (although it allows a self-closing tag to substitute for a start+end tag pair), so it has to be explicitly closed there.

HTML 5 is backwards compatible with versions of HTML that were SGML based.

War10ck
  • 12,387
  • 7
  • 41
  • 54
Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • 1
    Also worth adding that XHTML (as its name implies) is intended to be well-formed XML, hence the closing tags. – Ben May 27 '14 at 13:32
  • 2
    Historically, the `` tag was first defined and implemented in a quick and dirty way, later formally (and only formally) retrofitted into the SGML syntax. No real implementation of HTML was ever SGML-based. – Jukka K. Korpela May 27 '14 at 17:04
  • "the end tag is forbidden"? I've tried ``, there is no error? Maybe chrome just ignored `` ? – Tina Chen Aug 21 '18 at 12:52
  • 5
    @TinaChen — Browsers perform a **lot** of error recovery on malformed HTML. Use a validator to test for HTML errors. Don't depend on a browser to report them. – Quentin Aug 21 '18 at 12:58
22

The <img> tag represents what is known as a void element (see HTML5 spec), so called because it can't have any contents (unlike, say <a> or <div>). Therefore there is no syntactic reason why it should need to be closed in HTML.

XHTML, however, is based on XML, where every tag needs to be closed.

kmoe
  • 1,963
  • 2
  • 15
  • 27
5

It is what is called a void element which just means the element must not have any content (but can have attributes.) The HTML5 spec has this to say about void elements:

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) character. This character has no effect on void elements

So there's no real reason to have the single "/" (U+002F) character, but it won't break anything if it's included.

Josh Davenport-Smith
  • 5,456
  • 2
  • 29
  • 40
  • 1
    Note that the shortcut syntax `/` is only allowed as a convenience. The HTML5 spec expressly forbids having an explicit end tag such as ``. – BoltClock May 27 '14 at 13:36
4

<img> tag is basically a Void element.

For your understanding:

The image does not have any content. Image tag will just give the path from where the resource will be loaded through src attribute. So, it does not require any end element.

Whereas <img src="smiley.gif" alt="Smiley face" height="42" width="42"/>, this code is for XHTML version.

Azeez
  • 318
  • 3
  • 14
0

You won't put anything in the image like in h1 you would put text but in image you won't put anything on it.

Example:

<h1>hi</h1>
<img src=blblb alt=blbl/>
Sur
  • 191
  • 2
  • 3
  • 14