HTML Interview Questions: Forms, Tables and Media

Why these questions separate candidates

Forms, tables and media are where markup gets difficult in real work, and interviewers know it. Someone who has only built static pages can usually answer the fundamentals; these questions are where the gap shows.

Questions only. Answer each in your own words, then verify in a browser.

Forms

1. What is the difference between the name and id attributes on a form control?
2. A field has an id but no name. What reaches the server?
3. What is the difference between GET and POST as form methods? When is each correct?
4. Is POST encrypted? Explain what actually protects form data.
5. What does an unchecked checkbox submit? How would you guarantee a value?
6. What makes a set of radio buttons one group?
7. How many tab stops does a radio group occupy, and how do you move within it?
8. What is the difference between disabled and readonly?
9. Why is type="number" wrong for a phone number?
10. What is inputmode for, and how does it differ from type?
11. Why is a placeholder not a substitute for a label?
12. Name three ways to associate a label with a control, and say which you prefer.
13. What do fieldset and legend do, and when are they not optional?
14. What happens to a button inside a form with no type attribute?
15. What two things must a file upload form have?
16. Is a hidden field secure? What should and should not go in one?
17. Name four native validation attributes and what each checks.
18. Why is client side validation not a security control?
19. What does novalidate do, and why might you use it deliberately?
20. How would you display form errors accessibly?
21. What is a CSRF token and why does a hidden field make it work?

Tables

22. When should you use a table, and when should you not?
23. What is the difference between th and td beyond appearance?
24. Explain the column arithmetic colspan and rowspan impose.
25. What does the scope attribute do? Name its four values.
26. When would you need headers and id instead of scope?
27. What does caption give a table?
28. Why use thead and tbody rather than plain rows?
29. How would you make an eight column table usable on a phone? Name two approaches and their trade offs.

Media

30. Which attributes are required on an img, and which are strongly advised?
31. Explain the difference between a missing alt and alt="".
32. Why do width and height matter when CSS controls the size?
33. Explain srcset and sizes. Why must sizes be declared?
34. When would you use picture rather than srcset?
35. What does loading="lazy" do, and where must you never use it?
36. Why can autoplay video not have sound?
37. What does the track element do, and what is the difference between captions and subtitles?
38. What is required on an iframe for accessibility?
39. What does the sandbox attribute do, and what is the risk of combining allow-scripts with allow-same-origin?
40. When would you choose SVG over PNG, and what does inline SVG give you that an img does not?

The questions behind the questions

Practice

1. Answer all forty out loud.
2. Build a small demonstration for questions 5, 9, 24 and 33, and use them as examples.
3. For every question you could not answer, find the note in this path and reread it.
4. Ask someone to pick ten at random and answer without preparation.