Misconception: Students frequently forget to close tags or other paired constructs when writing HTML and CSS code, this error is called unclosed pairs. To help prevent this, have students write both open and close HTML tags before adding content.

Goal:

  • Have students always properly close self-contained tags.

Reason:

  • It is a common mistake for students to forget to close tags. For example, consider the following errors below that involve unclosed pairs.
    • <h1> Note
      • In the above HTML code, there is a missing closing tag, </h1>.
    • <img src="foo.png>
      • In the above HTML code there is a missing end quotation mark at the end of the image file name, ".
    • a { color: red;
      • In the above CSS code there is a missing closing bracket, }
  • Students will create a habit of associating open tags with their corresponding closing tags, therefore avoiding messy debugging.

Action:

  • Have students write open and close HTML tags at the same time, remembering the preceding / in the end tag, rather than leaving closing tags for the end.
  • Have students routinely check for other missing delimiters, such as semicolons and brackets.
  • Frequently remind students to check for this important syntax error (forgetting close a tag)
    • These are a skill-based errors that students will improve on with exposure and practice.

More about this tip

External Source

Interview with Breanna Turcsanyi

"Towards a Taxonomy of Errors in HTML and CSS" by Thomas Park, Ankur Saxena, Swathi Jagannath, Susan Wiedenbeck, and Andrea Forte.