Errors

There are various of error types for HTML and XHTML. There are the common pitfalls while creating a document.

Unintuitive Errors

Invalid syntax constructs that contributes senseless DOM trees. Example:

<table>

        <hr />

        ...

</table>

Table tag should always come with row tag <tr>, then column tag <th> or <td> depending on heading requirements, before presenting with any contents. In the above, it jumps straight into the content, which is a horizontal line <hr>. A proper version would be:

<table>

        <tr>

                <th> ... </th>

                <td> <hr /> </td>

                ...

        </tr>

</table>

Errors with Optional Recovery

Errors that is self-healable by client's parser. These types of errors are usually minor like missing close tag but is able to produce a proper DOM. In such case, the client's parser / browser will recover such errors automatically.

Incompatible Errors

Errors where tags or features are not available at the client's side parser and browser. These are usually recognized as essential errors. A good way to avoid such errors is to check the availability across different browsers using https://caniuse.com/.

Infoset Coercion Errors

More of parser's mismatch. The common case is having a XML consumer engaged with a HTML parser instead of XHTML version. Hence, most of the HTML-only syntax can be raised as errors.

Poor Performance Errors

Correct syntax but the generated DOM is inefficient or poor performance. Example:

<p><i>He dreamt.

<p><i>He dreamt that he ate breakfast.

<p><i>Then lunch.

<p><i>And finally dinner.

This renders the following DOM:

1. p
2. i
   1. #text: He dreamt.
3. p
4. i
   1. i
      1. #text: He dreamt that he ate breakfast.
5. p
6. i
   1. i
      1. i
         1. #text: Then lunch.
7. p
8. i
   1. i
      1. i
         1. i
            1. #text: And finally dinner.

Due to the fact that each unclosed <i> tags has to reconstruct itself for each paragraphs.

Fragile Syntax Constructs Errors

Usually due to misinterpreted syntax. Example:

<a href="?art&copy">Art and Copy</a>

The link is interpreted as ?art© instead due to the missing semicolon. The correct solution would be:

• Use semi-colon at the end of the parameters: ?art©
• Escape reserved symbols: ?art&copy

Legacy Interoperability Errors

Usually happens for legacy client parser / browser. Similar to incompatibility error, a good way to avoid such errors is to check the availability across different browsers using https://caniuse.com/.

Security Risks Errors

Errors that create security risk to both server and client sides. Example: UTF-7 - https://www.w3.org/TR/2017/REC-html52-20171214/references.html#biblio-rfc2152

Unclear Intention Errors

Unguessable errors done by authors. Example:

<h2>Contact details</h1>

It is unsure whether author wants lv-2 heading or lv-1 heading.

Typo Errors

Mistyped errors. Example:

• <capton> instead of <caption>

Futuristic Errors

Errors that interfere with new syntax in the future use / deployment.

Dubious Semantic Errors

Mis-use tags without referring to specifications. Example, using <section> inside <kbd>.

Conflicting Semantic Errors

Tag with conflicting intents. Example:

<hr role="cell">

<input type=radio role=progressbar>

Is it a line or a cell?

Is it a radio input or a display progress bar?

Confusing Semantic Errors

Tag that is not used correctly. Example:

1. <span> can be inside <div>, but not the other way round.
2. <button> shouldn't have <textarea>. Keep them separate.

Specification Misunderstood Errors

Sometimes, some values cause more confusion than serving purposes. Example:

• disabled can't be set as disabled="false"

Hungarian Notation Errors

Errors caused by hungarian notation. Example:

• <area shape="circ" > should be <area shape="circle" >

Parser Peculiarities Errors

Bad use of tags. Example:

• <form> shouldn't be inside any phrasing contents like <p>.

Hard to Debug Errors

Intentional errors that is very hard to debug. Example:

• having 2 elements with the same id.
  • The hard part is the selection.

Wasting Time Errors

Errors that waste developer's time. Example:

• <script> having src attribute ignores all contents' javascript. If a bug occurs, it causes developer to read those inline javascripts without realizing that they are not executed.

XHTML-HTML Portability Errors

Errors related to XHTML or HTML specific use tag. Example:

• lang vs xml-lang
• xmlns

Future Reservation Errors

Error related to future reserved use. Example:

• target has predefined values.

Other Specification Errors

Any other specification errors especially related to media type.