04 / 06

Explain the structure of a basic HTML document.

Difficulty: 2/10
doctype, head and body, semantic tags

Structure of a Basic HTML Document

A basic HTML document follows a standard structure that tells the browser how to interpret the content. It starts with a document type declaration, followed by the <html> root element, which contains two main sections: the <head> and the <body>.

Basic HTML Document Example
Main Parts of an HTML Document
  1. 1<!DOCTYPE html> – Declares the document type and version of HTML.
  2. 2<html> – The root element that wraps all content on the page.
  3. 3<head> – Contains metadata such as the page title, character encoding, and linked stylesheets or scripts.
  4. 4<title> – Sets the title of the web page shown in the browser tab.
  5. 5<body> – Contains all the visible content like text, images, links, and other elements.

Scenario Questions

0-2 years experience

  1. 1You're building a simple landing page for a new product. Walk me through the HTML skeleton you'd write and why each part is needed.
  2. 2If you accidentally placed a <script> tag inside the <head> without the defer attribute, what would the browser do during page load?
  3. 3What happens if you forget to close the <title> tag in the head section?

2-5 years experience

  1. 1We have a page that flashes unstyled content before CSS loads. How would you adjust the HTML structure to prevent that flash?
  2. 2During a code review you notice meta tags placed after the opening <body>. Explain why that could be a problem and how you'd fix it.
  3. 3A legacy page is missing the <!DOCTYPE html> declaration and is rendering in quirks mode. How would you diagnose and resolve the issue?

5-8 years experience

  1. 1Our team is building a component library used across many micro‑frontends. How would you structure the base HTML template to ensure consistent SEO, accessibility, and theming while allowing each micro‑frontend to inject its own scripts?
  2. 2We need to serve a high‑traffic news site with server‑side rendering and client hydration. Discuss how the placement of critical CSS and script tags in the HTML document impacts performance and what trade‑offs you’d consider.
  3. 3When migrating a monolithic app to a static site generator, what changes to the basic HTML document structure are required to support incremental builds and CDN caching?

8+ years experience

  1. 1Our organization is consolidating dozens of legacy web applications into a unified platform. Describe the architectural decisions around a shared base HTML document (doctype, meta, CSP, preload links) that balances security, performance, and team autonomy.
  2. 2You’re tasked with defining a company‑wide HTML boilerplate that will be versioned and consumed by multiple product teams. How would you design the process and tooling to evolve that boilerplate without breaking existing deployments?
  3. 3Considering long‑term maintainability, how would you approach introducing modern HTML standards (e.g., HTML5 semantic elements, web components) into an existing codebase that still relies on older HTML structures?

Follow-up Questions

  • What would happen if the doctype is omitted or incorrect?
  • Why does the placement of meta tags matter for SEO and rendering?
  • How does the order of CSS and JavaScript tags affect page load performance?
Share

Share via WhatsApp, X, Facebook, LinkedIn or copy link. Open Graph preview enabled.