← Back to Examples

Common HTML Mistakes

Use this file to demonstrate mistakes and how browsers try to fix them.


Mistake 1: Forgetting Closing Tags

This paragraph was never closed properly

This is supposed to be a new paragraph, but the browser guesses where to close the previous one.


Mistake 2: Improper Nesting

This is bold and italic text - tags should close in reverse order!

Correct way: bold and italic text


Mistake 3: Skipping Heading Levels

Main Title

Why did we jump from h1 to h4?

Screen readers and SEO tools get confused when heading levels are skipped.

Correct Structure:

h1 → h2 → h3 (don't skip levels)


Mistake 4: Using h1 Multiple Times

There should only be ONE h1 per page - it's the main title.

Using multiple h1s confuses search engines about what the page is about.


Mistake 5: Missing alt on Images

Bad: <img src="photo.jpg">

Good: <img src="photo.jpg" alt="Description of the image">


Mistake 6: Using Tables for Layout

Tables should ONLY be used for tabular data (like spreadsheets, schedules).

Don't use tables to position elements on the page - that's CSS's job!


Mistake 7: Using br for Spacing

Bad way to add space:

Line 1



Line 2 (too many br tags!)

Better: Use CSS margin/padding for spacing, or proper paragraph tags.


Mistake 8: Inline Styles Everywhere

This works but is hard to maintain!

Better: Use CSS classes in a separate stylesheet or style tag.


Key Lesson

HTML is forgiving - browsers try to fix your mistakes silently.

This is both good (page still renders) and bad (you don't know about the bug).

Use browser dev tools (F12 → Elements) to see how browsers interpret your HTML.


← Back to Examples