Lesson 30 / 30
Common Beginner Mistakes
Avoid common beginner mistakes such as unclosed tags, div overuse and invalid element nesting.
Unclosed tags & div soup
Forgetting a closing tag can silently break layout. Wrapping everything in <div> instead of semantic tags loses meaning for no visual gain.
Invalid nesting
A block element like <div> cannot legally sit inside an inline element like <span> or <a> in some contexts — check the spec if a layout looks broken for no reason.
Quick check: Which is a common beginner HTML mistake?
- Using semantic tags like <nav>
- Adding alt text to images
- Wrapping every element in generic <div> tags
- Writing valid, closed tags
Answer
Wrapping every element in generic <div> tags — Overusing generic <div> tags instead of semantic elements is a classic beginner habit that hurts accessibility and SEO.
Final quiz 1 of 8
Final quiz
Quick check: Which element holds the visible page content?
- <head>
- <meta>
- <body>
- <title>
Answer
<body> — The body contains everything users see.
Final quiz 2 of 8
Final quiz
Quick check: Which tag carries semantic emphasis?
- <b>
- <i>
- <font>
- <strong>
Answer
<strong> — strong signals importance to assistive technology.
Final quiz 3 of 8
Final quiz
Quick check: What should a decorative image's alt be?
- alt=""
- A long description
- Omitted
- The file name
Answer
alt="" — An empty alt tells screen readers to skip it.
Final quiz 4 of 8
Final quiz
Quick check: Which attribute binds a label to an input?
- name
- for (matching the input id)
- class
- href
Answer
for (matching the input id) — label for matches the input's id.
Final quiz 5 of 8
Final quiz
Quick check: Why re-validate form data on the server?
- HTML validation is slow
- Servers ignore HTML
- Browser validation can be bypassed
- It is required by the spec
Answer
Browser validation can be bypassed — Never trust client-side checks alone.
Final quiz 6 of 8
Final quiz
Quick check: Which tag makes mobile browsers use the real screen width?
- meta charset
- link rel icon
- base
- meta viewport
Answer
meta viewport — width=device-width, initial-scale=1 enables responsive layouts.
Final quiz 7 of 8
Final quiz
Quick check: What is true of <template> content?
- It is inert until JavaScript clones it
- It renders immediately
- It is invalid HTML
- It runs scripts first
Answer
It is inert until JavaScript clones it — Templates are parsed but not rendered.
Final quiz 8 of 8
Final quiz
Quick check: Which is a good SEO basic in HTML?
- Many h1 tags
- A unique title and one clear h1
- Empty alt on all images
- Duplicate titles
Answer
A unique title and one clear h1 — Unique titles and a logical heading structure help search engines.