</>HTMLCodeRunnerCOMMUNITY
Menu
← Community homeLEARN. BUILD. SHARE.

Learn HTML: 100 practical questions and answers

Clear explanations, focused examples, and a practical way to check each result.

Learn HTML in a useful order

Choose a route, work through the linked explanations, then try the practice task. These are learning sequences, not a qualification or certification.

Build your first page

  1. What belongs in a minimal HTML document?
  2. When should you use id instead of class?
  3. What does semantic HTML mean in practice?
  4. How should headings describe a page hierarchy?
  5. How do you add a skip link to main content?

Practice: build a one-page article with a clear heading hierarchy, unique IDs, and a keyboard-accessible skip link.

Make a usable form

  1. How do you connect a label to an input?
  2. Why is a field missing from submitted form data?
  3. How does required participate in browser validation?
  4. How do you associate field help text with an input?
  5. How do fieldset and legend clarify grouped choices?

Practice: build a labeled form, explain required fields, connect help text, and compare submitted values with the fields on screen.

Present images and data

  1. How do you write useful alternative text?
  2. How does srcset help choose a responsive image?
  3. Why set width and height on responsive images?
  4. What is the basic structure of a data table?
  5. How does scope clarify table headers?

Practice: add a responsive image and a small data table. Check the alternative text, reserved image space and table header relationships.

Debug and prepare to share

  1. How do you write a useful page title?
  2. When does a page need a canonical link?
  3. How do defer and async affect classic scripts?
  4. How do you start debugging invalid HTML?
  5. What should you check before sharing an HTML project?

Practice: validate a complete document, inspect resource requests and metadata, then test keyboard access and a phone-sized layout.

How our guides are published and corrected →

100 guides · 10 topic groups
About these guides

AI-assisted explanations and examples by HTMLCodeRunner Editorial. These are editorial learning discussions, not independent member conversations. You can add your own questions and corrections.

HTML Basics10 guides

  1. What belongs in a minimal HTML document?
  2. Why does an HTML page need a doctype?
  3. What is the difference between head and body?
  4. How do HTML attributes configure elements?
  5. How do you write comments in HTML safely?
  6. How do you display angle brackets as text?
  7. When should you use id instead of class?
  8. Why are extra spaces collapsed in HTML text?
  9. Why does disabled="false" still disable an input?
  10. How do you declare the language of an HTML page?

Semantic HTML10 guides

  1. What does semantic HTML mean in practice?
  2. When should you choose article instead of section?
  3. How should headings describe a page hierarchy?
  4. Can header and footer appear inside an article?
  5. Which groups of links belong in nav?
  6. When does a sidebar belong in aside?
  7. What is the practical difference between div and span?
  8. When should you use strong rather than em?
  9. How do figure and figcaption describe an illustration?
  10. Why use datetime on a time element?

HTML Forms10 guides

  1. When should an HTML form use GET or POST?
  2. How do you connect a label to an input?
  3. Why is a field missing from submitted form data?
  4. How does required participate in browser validation?
  5. Does type="email" prove an email address exists?
  6. What does a form need to upload a file?
  7. How do radio buttons form an exclusive choice group?
  8. How do you give a required select a prompt?
  9. How do you set initial text in a textarea?
  10. Why does my preview button submit the form?

Images & Media10 guides

  1. How do you write useful alternative text?
  2. How does srcset help choose a responsive image?
  3. When should you use picture instead of img alone?
  4. Which images should use loading="lazy"?
  5. Why set width and height on responsive images?
  6. How do you add video with native controls?
  7. How do you embed an accessible audio lesson?
  8. What does track add to an HTML video?
  9. Should an SVG be inline or embedded as an image?
  10. Does canvas automatically expose document semantics?

Tables & Lists10 guides

  1. What is the basic structure of a data table?
  2. How do you name a table with caption?
  3. How does scope clarify table headers?
  4. How do colspan and rowspan change a table grid?
  5. Why use row groups in an HTML table?
  6. When is an unordered list appropriate?
  7. How do you continue ordered-list numbering?
  8. Where does a nested list belong?
  9. When should you use dl, dt, and dd?
  10. How do you make a wide table usable on a phone?

HTML SEO & Metadata10 guides

  1. How do you write a useful page title?
  2. What should a meta description say?
  3. Where should you declare UTF-8?
  4. Why does a mobile page need viewport metadata?
  5. When does a page need a canonical link?
  6. What does a robots noindex meta tag do?
  7. How do you reference a favicon in HTML?
  8. How do you identify alternate language pages?
  9. Can structured data create a rich result on its own?
  10. What makes an HTML link useful for discovery?

HTML Accessibility10 guides

  1. How do you add a skip link to main content?
  2. Why prefer a native button to a clickable div?
  3. When should tabindex be zero or minus one?
  4. When is aria-label appropriate?
  5. How do you associate field help text with an input?
  6. How are hidden and aria-hidden different?
  7. How do fieldset and legend clarify grouped choices?
  8. How do you create a native disclosure?
  9. How do you open a modal dialog correctly?
  10. When is inert useful in an HTML interface?

HTML APIs & Embeds10 guides

  1. How should you label an embedded iframe?
  2. What does sandbox restrict in an iframe?
  3. How do you display an HTML string with srcdoc?
  4. How do defer and async affect classic scripts?
  5. What changes when a script uses type=module?
  6. Why does template content not appear immediately?
  7. How do data attributes connect markup and JavaScript?
  8. What does contenteditable provide and what is still missing?
  9. How are progress and meter different?
  10. When are datalist suggestions useful?

HTML Debugging & Projects10 guides

  1. How do you start debugging invalid HTML?
  2. Why does the browser move elements out of a paragraph?
  3. How can repeated components introduce duplicate IDs?
  4. Why is an image broken even though its file exists?
  5. How do you debug garbled characters in HTML?
  6. How do you show HTML code without executing it?
  7. Why does an HTML contact form not send mail by itself?
  8. Why is my external stylesheet not applied?
  9. How do you debug an external script that does not run?
  10. What should you check before sharing an HTML project?