HTML Errors Demonstration

10 Common HTML Mistakes

1. Missing Closing Tag

Wrong: <p>This is a paragraph
Correct: <p>This is a paragraph</p>

2. Improper Nesting

Wrong: <ul><li>Item 1<p>Item 2</li></ul>
Correct: <ul><li>Item 1</li><li>Item 2</li></ul>

3. Deprecated Tag

Wrong: <font color="red">Text</font>
Correct: <span style="color:red">Text</span>

4. Invalid Attribute

Wrong: <img src="image.jpg" altt="description">
Correct: <img src="image.jpg" alt="description">

5. Missing Alt Text

Wrong: <img src="photo.jpg">
Correct: <img src="photo.jpg" alt="Photo description">

6. Excessive Inline Styles

Wrong: <h1 style="color:blue; font-size:24px">Title</h1>
Correct: <h1 class="title">Title</h1>

7. Missing Doctype

Wrong: <html lang="en"> ... </html>
Correct: <!DOCTYPE html><html lang="en"> ... </html>

8. Non-Semantic Structure

Wrong: <div><b>Header</b></div>
Correct: <header><h1>Header</h1></header>

9. Broken Link

Wrong: <a href="nonexistent.html">Click</a>
Correct: <a href="index.html">Home</a>

10. Empty List Items

Wrong: <ul><li></li></ul>
Correct: <ul><li>Item 1</li></ul>