2

I've been watching a video to learn HTML. I know about HTML but I just wanted to refresh my knowledge. The author declared that he is using HTML5 because the doctype was:

<!doctype html>

but I noticed that the author used the meta element in a different style that I get used to, he used it without the the forward slash to close the element as follows:

<meta charset="utf-8"> 

and what I know about this is that it should be like the follwing:

<meta charset="utf-8" />

Which one of the above elements is considered HTML5? I tried to search online but it seems that every web designer has a different opinion which confused me. I like standards.

8

My SGML is rusty, so I'm going to hope someone comes along to correct some of this but...

This line is SGML which is a super set of HTML and XML.

<!doctype html>

The <! indicates that the document should drop back to follow SGML directives, not the parent document. This is the same reason that <!-- is the way to start a comment in XML and HTML. <! drops to SGML, and -- is the usual delimiter for comments in SGML. In the above line of code, <! doctype html> is valid SGML for declaring the doctype.

Whereas this line is a part of the standard document and needs to follow the documents rules (which are declared by the doctype, or schema dependent on the document):

<meta charset="utf-8"> 

In this the SGML rules no longer apply as we are looking at something that needs to conform to HTML. Now, depending on if it is HTML4, HTML5 or XHTML how the tag is closed changes.

In HTML4 many tags didn't need to be closed, and in fact in some cases were forbidden from being closed. This includes <meta>, <img> and <p> tags, where only the latter was allowed to be closed (like </p>) the other 2 should be left as is with attributes and no closing tags - because in their declaration they needed no closing tag.

However, in XHTML attempts were made to make HTML conformant to XML. A noble goal, however this meant that standalone tags line <meta> or <img> needed to be self-closing as they had no content and became <meta /> and <img /> in XHTML. However, people being overzealous started to do this in HTML4 documents as well. Technically invlaid, but most HTML parsers are very kind and eat much worse HTML, so they never really paid attention.

When HTML5 came along, everyone recognised that people were writing self-closing tags in HTML and the W3C said, "hey you know what, if everyone is doing it, let them do it legally". So, now in HTML5 you can have either <meta> or <meta />.

As for which type you should choose when writing your code. If you are outputting XHTML, you need to self-close the tag, no questions asked. Otherwise, you have options:

Arguments against self-closing:

  • Over thousands of page views the additional space and slash add up. Google does some heinous things to make readable HTML that saves bytes - for a while they omitted </body> and </head> closing tags.

Arguments for self-closing:

  • Closing tags and making your HTML close to XML, makes it easier for XML based parsers to read your content, which may make searching or scraping content easier if you are using XML based technologies like XPath.

The choice is really up to you, but regardless of which approach you take, consistency is the key.

3

The notion of self-closing tags like this:

<meta charset="utf-8" />

Is an idea that was brought forward from XHTML. XHTML was an effort by some at the W3C to create a XML-compatible dialect of HTML. It was based on HTML 4.0, but was modified only for XML compatibility. XHTML proved to have a number of problems, and many user agents (browsers) were unable to cope with XHTML documents delivered according to the standard's specifications and required several "hacks" just to keep browsers from dropping to "quirks mode."

HTML5 has no relation to XML. It too is based on HTML 4.0, but it disposed of the XML boondoggle that came out of the XHTML effort.

Self-closing tags in HTML5 are valid, but unnecessary.

  • "valid, but unnecessary." OK that sounds good but in HTML5 is it defined as <meta> or <meta /> ? – Maryam Sep 17 '13 at 21:47
  • As html5 has no relation to XML the correct approach would be without the self-closing tag – user1231561 Sep 17 '13 at 23:14
  • 1
    @Maryam: You misunderstand, I think: It is not defined as either. <meta /> happens to be allowed because SGML doesn't care about the /. XML does care about the /, so it's required only in XHTML. It's not required and is ignored everywhere else. – greyfade Sep 17 '13 at 23:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.