blog

Common HTML mistakes and how to fix them

Even experienced developers make HTML mistakes. Most are easy to fix once you know what to look for. Every example opens in the editor, so you can see the problem and the fix side by side.

1. Unclosed tags

The most common mistake. Forgetting to close a tag causes the browser to guess where it should end — and it often guesses wrong.

<!-- Wrong -->
<p>First paragraph
<p>Second paragraph

<!-- Right -->
<p>First paragraph</p>
<p>Second paragraph</p>

Open this example in the viewer →

Some tags like <p> and <li> have optional closing tags, but explicit closing is always safer and clearer.

2. Incorrect nesting

Tags must be closed in the reverse order they were opened. Crossing tags produces unpredictable rendering.

<!-- Wrong -->
<strong><em>Bold and italic</strong></em>

<!-- Right -->
<strong><em>Bold and italic</em></strong>

Open this example in the viewer →

3. Missing alt text on images

The alt attribute describes the image for screen readers and when images fail to load. Leaving it out hurts accessibility and SEO.

<!-- Wrong -->
<img src="cat.jpg">

<!-- Right -->
<img src="cat.jpg" alt="Orange cat sleeping">

Open this example in the viewer →

4. Using deprecated tags

Tags like <center>, <font>, and <b> (for visual bold) are outdated. Use CSS instead.

<!-- Deprecated -->
<center><font color="red">Warning</font></center>

<!-- Modern -->
<p style="text-align:center; color:red;">
  Warning
</p>

Open this example in the viewer →

5. Missing the DOCTYPE

Without <!DOCTYPE html>, browsers render in quirks mode which can cause unexpected layout behavior. Always include it at the very top of your HTML document.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>My Page</title>
</head>
<body>
  ...
</body>
</html>

Open this example in the viewer →

6. Inline styles everywhere

Inline styles work but become unmaintainable fast. Use a <style> block or external stylesheet for anything beyond quick prototyping. The exception: HTML emails, where inline styles are often the only reliable option.

How to catch these mistakes