Lesson 14 — Best Practices

Best Practices and Validation

Writing clean, valid, well-organised HTML makes a page easier to maintain, more accessible, and more consistent across different browsers.

Validating Your HTML

The W3C Markup Validation Service checks your HTML against the official specification and flags errors like unclosed tags, invalid nesting, or duplicate IDs — issues that browsers often silently "fix" in inconsistent ways, leading to unpredictable rendering.

Style Conventions

None of the conventions below are enforced by browsers, but following them consistently makes code easier for you and others to read and maintain.

  • Use lowercase for tag names and attributes: <div class="card">, not <DIV CLASS="card">.
  • Always quote attribute values, even simple ones.
  • Indent nested elements consistently (2 or 4 spaces).
  • Close every element that requires a closing tag, and use self-closing syntax consistently for void elements like <img> and <br>.

Common Mistakes

  • Nesting block-level elements inside inline elements incorrectly, e.g. putting a <div> inside a <span>.
  • Leaving invalid or duplicate id values unnoticed because the browser still renders the page without complaint.
  • Mixing tabs and spaces for indentation, making the file inconsistent across editors.
  • Never running a validator, and only discovering structural bugs when a browser update changes how it "fixes" invalid markup.

Professional Tip

Run new pages through the W3C validator periodically, even though browsers are forgiving of mistakes. A clean validation report is a strong signal that your markup will behave consistently across different browsers and devices.

Your Turn

Take the most complex page you've built in this course and run it through an HTML validator. Fix any errors it reports, and note what each one meant.

Mini Quiz

Why is it good practice to validate your HTML even though browsers still render invalid markup?