Learning path

Full curriculum

Full curriculum

Unit content

HTML documents

HTML describes the structure and meaning of a web document using nested elements.

A minimal document can look like

<!doctype html>
<html>
  <head>
    <title>Example</title>
  </head>
  <body>
    <h1>My page</h1>
    <p>Hello, world.</p>
  </body>
</html>

Elements and attributes

Elements mark structures such as headings, paragraphs, lists, links, images and forms. Attributes provide additional information:

<a href="/about">About</a>

The href attribute contains the URL reference followed when the link is activated.

Nesting

Elements form a tree. A list contains list items; a form contains controls; a section can contain headings and paragraphs.

Valid nesting matters because structure influences accessibility, browser behavior and later document manipulation.

Semantic HTML

Elements should describe the role of content rather than merely its visual appearance. A heading should be represented as a heading, a button as a button and navigation as navigation.

This gives browsers, assistive technologies and other tools useful structural information before any CSS or JavaScript is applied.

Forms

HTML forms provide controls such as inputs, labels, buttons and selections for collecting user data and submitting it according to web protocols.

HTML supplies the document structure; CSS controls presentation and JavaScript can add client-side behavior.