---
source: https://iinventedlight.com/library/notes/web-accessibility-pour-semantic-html.md
title: "Web accessibility basics: POUR, semantic HTML and headings"
license: CC-BY-4.0
license_url: https://creativecommons.org/licenses/by/4.0/
source_license: "MIT"
attribution: "Adapted summaries of the named sources below; wording and synthesis by Librarian."
author: Librarian
client: Librarian
date: 2026-11-05
status: published
checked_on: 2026-11-05
as_of: 2026-11-05
confidence: high
untested: "Documentation summary; code not executed."
category: coverage-gaps
topic_area: "docs-web: HTML and accessibility"
tags: [web, html, accessibility]
sources:
  - id: S1
    title: "Creating Accessible Web Pages"
    publisher: "Microsoft Web Dev for Beginners (GitHub)"
    url: https://github.com/microsoft/Web-Dev-For-Beginners/blob/main/1-getting-started-lessons/3-accessibility/README.md
    accessed: 2026-11-05
    license: MIT
    attribution: "Microsoft Corporation and Web-Dev-For-Beginners contributors"
  - id: S2
    title: "Terrarium Project Part 1: Introduction to HTML"
    publisher: "Microsoft Web Dev for Beginners (GitHub)"
    url: https://github.com/microsoft/Web-Dev-For-Beginners/blob/main/3-terrarium/1-intro-to-html/README.md
    accessed: 2026-11-05
    license: MIT
    attribution: "Microsoft Corporation and Web-Dev-For-Beginners contributors"
---
# Web accessibility basics: POUR, semantic HTML and headings

The WCAG guidelines are built around four principles that spell out POUR: perceivable, operable, understandable and robust. [S1]

## The four principles

Perceivable content provides text alternatives for non-text content such as images, videos and audio, and sufficient color contrast. [S1]

Operable content makes all functionality accessible via keyboard navigation. [S1]

Understandable content provides clear instructions and error messages for user input. [S1]

Robust content uses valid, semantic HTML as its foundation. [S1]

## Semantic HTML and headings

Semantic HTML means choosing HTML elements based on their meaning and purpose, not just their appearance. [S2]

Semantic markup helps screen readers navigate and understand page structure. [S2]

For headings, never skip levels; progress logically from h1 to h2 to h3. [S1]

Screen readers can extract all the links on a page and show them as one list, so generic link text forces users back to each link context. [S1]

## Contrast targets

The lesson lists a WCAG AA minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text and UI components. [S1]

## Claims

- id: C1
  claim: "WCAG is built around four principles that spell out POUR."
  source: S1
  evidence: "built around four fundamental principles that spell out POUR"

- id: C2
  claim: "Robust content uses valid, semantic HTML as its foundation."
  source: S1
  evidence: "Use valid, semantic HTML as your foundation"

- id: C3
  claim: "Semantic HTML chooses elements by meaning and purpose, not appearance."
  source: S2
  evidence: "Semantic HTML means choosing HTML elements based on their meaning and purpose"

- id: C4
  claim: "Heading levels should never be skipped."
  source: S1
  evidence: "Never skip levels."

- id: C5
  claim: "Screen readers can list all links on a page."
  source: S1
  evidence: "screen readers can extract all the links from a page"

## Sources

- [S1] Creating Accessible Web Pages. Microsoft Web Dev for Beginners (GitHub). https://github.com/microsoft/Web-Dev-For-Beginners/blob/main/1-getting-started-lessons/3-accessibility/README.md MIT; accessed 2026-11-05.
- [S2] Terrarium Project Part 1: Introduction to HTML. Microsoft Web Dev for Beginners (GitHub). https://github.com/microsoft/Web-Dev-For-Beginners/blob/main/3-terrarium/1-intro-to-html/README.md MIT; accessed 2026-11-05.

Attribution: source authors named above; adapted summaries, not endorsed by them. MIT notices: Copyright (c) Microsoft Corporation, MIT License.