Does HTML5 Change The Standard for HTML Commenting

Does HTML5 change the standard for HTML commenting?

There is no new standard for comments in HTML5. The only valid comment syntax is still <!-- -->. From section 8.1.6 of W3C HTML5:

Comments must start with the four character sequence U+003C LESS-THAN SIGN, U+0021 EXCLAMATION MARK, U+002D HYPHEN-MINUS, U+002D HYPHEN-MINUS (<!--).

The <! syntax originates in SGML DTD markup, which is not part of HTML5. In HTML5, it is reserved for comments, CDATA sections, and the DOCTYPE declaration. Therefore whether this alternative is bad practice depends on whether you consider the use of (or worse, the dependence on) obsolete markup to be bad practice.

Validator.nu calls what you have a "Bogus comment." — which means that it's treated like a comment even though it's not a valid comment. This is presumably for backward compatibility with pre-HTML5, which was SGML-based, and had markup declarations that took the form <!FOO>, so I wouldn't call this new. The reason they're treated like comments is because SGML markup declarations were special declarations not meant to be rendered, but since they are meaningless in HTML5 (with the above exceptions), as far as the HTML5 DOM is concerned they are nothing more than comments.

The following steps within section 8.2.4 lead to this conclusion, which Chrome appears to be following to the letter:

  1. 8.2.4.1 Data state:

    Consume the next input character:

    "<" (U+003C)

    Switch to the tag open state.

  2. 8.2.4.8 Tag open state:

    Consume the next input character:

    "!" (U+0021)

    Switch to the markup declaration open state.

  3. 8.2.4.45 Markup declaration open state:

    If the next two characters are both "-" (U+002D) characters, consume those two characters, create a comment token whose data is the empty string, and switch to the comment start state.

    Otherwise, if the next seven characters are an ASCII case-insensitive match for the word "DOCTYPE", then consume those characters and switch to the DOCTYPE state.

    Otherwise, if there is an adjusted current node and it is not an element in the HTML namespace and the next seven characters are a case-sensitive match for the string "[CDATA[" (the five uppercase letters "CDATA" with a U+005B LEFT SQUARE BRACKET character before and after), then consume those characters and switch to the CDATA section state.

    Otherwise, this is a parse error. Switch to the bogus comment state. The next character that is consumed, if any, is the first character that will be in the comment.

    Notice that it says to switch to the comment start state only if the sequence of characters encountered is <!--, otherwise it's a bogus comment. This reflects what is stated in section 8.1.6 above.

  4. 8.2.4.44 Bogus comment state:

    Consume every character up to and including the first ">" (U+003E) character or the end of the file (EOF), whichever comes first. Emit a comment token whose data is the concatenation of all the characters starting from and including the character that caused the state machine to switch into the bogus comment state, up to and including the character immediately before the last consumed character (i.e. up to the character just before the U+003E or EOF character), but with any U+0000 NULL characters replaced by U+FFFD REPLACEMENT CHARACTER characters. (If the comment was started by the end of the file (EOF), the token is empty. Similarly, the token is empty if it was generated by the string "<!>".)

    In plain English, this turns <!div displayed> into <!--div displayed--> and <!/div> into <!--/div-->, exactly as described in the question.

On a final note, you can probably expect other HTML5-compliant parsers to behave the same as Chrome.

How can I comment an HTML tag attribute in HTML source code?

The W3C documentation suggests it cannot be done:

Note that comments are markup.

This basically means that a <!-- ...> comment tag is just like any other tag, so <a <!--title="need to be comment out"-->>a link</a> is as wrong as <a <span></span>>a link</a>.

For quick hacking I believe a common option is to rename that attribute. While you obtain invalid HTML, you can temporarily remove the attribute:

<a xtitle="need to be comment out">a link</a>

If you happen to be using a server-side language, you can also use its own comment syntax. For instance, in PHP you can do this:

<a <?php/*title="need to be comment out"*/?>>a link</a>

... which generates this HTML:

<a >a link</a>

... and in ASP.NET you can use <%-- Comment goes here --%> while the ASP.NET MVC Razor syntax is @* Comment goes here *@.

Is !someTag/ a valid HTML comment vs !-- someTag/ --?

Some browsers may support it as a comment, but it's not valid HTML. You can run the code through the W3C's validator to see: https://validator.w3.org/nu/#textarea

<!doctype html>
<html>
<head>
<title>Test</title>
</head>
<body>
<div>
<!someAngularComponent/>
</div>
</body>
</html>

This will raise an error:

Error: Bogus comment.

At line 8, column 3

body ↩ div ↩ !someAngularComp

Depending on your audience, you may have to test it in multiple browsers, but I'd probably just recommend the standard comment syntax so there's no risk.

Is it wrong to use a comment tag as the end of a div?

Based on what the spec says an HTML5-compliant parser should do (W3C HTML5.2§8.2.4.7, WHATWG HTML§13.2.5.7), this should behave identically to a proper end tag.

But it's a syntax error. And syntax errors are called errors for a reason. Whether you think it's bad practice to do this depends entirely on whether you think it's bad practice to rely on syntax errors with known, fixed behaviors, or writing syntax errors is bad practice in the first place.

HTML Comments Markup

I think that your version with the cite, blockquote, etc. would definitely work, but if semantics is your main concern then I personally wouldn't use cite and blockquote as they have specific things that they are supposed to represent.

The blockquote tag is meant to represent a quotation taken from another source and the cite tag is meant to represent a source of information (like a magazine, newspaper, etc.).

I think an argument can certainly made that you can use semantic HTML with class names, provided they are meaningful. This article on Plain Old Semantic HTML makes a reference to using class names - http://www.fooclass.com/plain_old_semantic_html

Right comment indentation in HTML5

It doesn't really matter. The only thing to keep in mind is that once you have started a style, you should continue to do so throughout the entire application.

What there is, however, is Conditional comment.

<!--[if IE 6]>
Special instructions for IE 6 here
<![endif]-->

Conditional comments only work in Internet Explorer (IE) on Windows , but they are ignored by other browsers. They are supported from Explorer 5 and above, and you can use them to give conditional instructions to different versions of IE.

Only a small Note. The following points are more important when commenting:

  • Always try to explain yourself in the code.
  • Do not be redundant.
  • Do not add obvious noise.
  • Don't comment out code. Just remove it.
  • Use as a statement of intent or to clarify code.
  • Use as legal and informational comments.


Related Topics



Leave a reply



Submit