HTML Fundamentals: Interview Questions and Answers

These questions cover the HTML details that often appear early in a frontend interview. A good answer defines the term and connects it to something you would do in a real page.

1. What is HTML, and is it a programming language?#

HTML is a markup language used to describe the structure and meaning of web content. It is not usually classed as a programming language because it does not provide general-purpose control flow or computation. CSS handles presentation and JavaScript handles application behavior.

2. What is the difference between a tag and an element?#

A tag is the markup token written with angle brackets, such as <p> or </p>. An element is the complete construct: its start tag, content, and end tag where applicable. In <p>Hello</p>, the two tags and the text together form the paragraph element. Void elements such as <img> do not have end tags.

3. What does <!doctype html> do?#

It tells the browser to use standards mode for the document. It is a doctype declaration, not an HTML element. Put it at the beginning of the document so the browser does not fall back to quirks mode because of an old or missing declaration.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Example page</title>
  </head>
  <body>
    <h1>Hello</h1>
  </body>
</html>

4. What are attributes in HTML?#

Attributes provide additional information or configure an element. They are written in the start tag, usually as name="value". For example, href gives an anchor its destination, src gives an image its resource URL, and type changes the kind of input control. Boolean attributes such as required are enabled by being present.

5. What are void elements? Give examples.#

Void elements cannot contain child content and do not use end tags. Common examples include area, base, br, col, embed, hr, img, input, link, meta, source, and track. Write <img src="photo.jpg" alt="A red bicycle">, not <img>...</img>.

6. What is the difference between id and class?#

An id identifies one element in a document and should be unique within that document. A class can be shared by any number of elements. Use an ID when a specific element needs a unique reference, such as a label's for value or an in-page link. Use classes for reusable styling and behavior hooks.

7. What is the difference between block and inline elements?#

“Block” and “inline” describe common CSS display behavior, not the full semantic meaning of an element. A div commonly displays as block and a span commonly displays inline, but CSS can change display behavior. In an interview, explain the distinction without treating it as a rule that decides which element is semantically correct.

8. Why should attribute values be quoted?#

Quotes make values reliable when they contain spaces or characters that would otherwise be parsed as markup. Quoted values also make source code consistent and easier to scan. Use double quotes by convention: class="notice notice--warning".

9. What is the difference between title and alt on an image?#

alt provides a text alternative for the image's purpose or content. It is important when the image cannot be seen or loaded. title is advisory information and may be exposed as a tooltip by some browsers; it is not a substitute for useful alternative text or a visible caption.

10. Why is the lang attribute important?#

The lang attribute declares the language of the document or a particular passage. Screen readers can use it for pronunciation, and browsers and other tools can use it for language-specific processing. Set it on the root element, for example <html lang="en">, and mark language changes inside the page when needed.