HTML global attributes
Use attributes shared across HTML elements for identity, language, state, editing, focus, hidden content, data hooks, and accessibility.
Open resourcePractical reference
HTML elements in real pages
Concise definitions followed by tested context, accessibility consequences, and common misuse.
The anchor element
Create crawlable, keyboard-accessible links with meaningful destination text, valid URLs, and safe external-link behavior.
Open resourceThe audio element
Embed audio with native playback controls, declared formats, transcript access, restrained loading, and clear failure recovery.
Open resourceQuotations: blockquote, q, and cite
blockquote marks a quoted block, q marks an inline quotation, and cite names the work being referenced. Each has a distinct job.
Open resourceThe button element
Use a native button for actions, form submission, disclosure controls, and other interactions that occur on the current page.
Open resourceThe canvas element
Use canvas for script-drawn bitmap graphics only when its fallback content, interaction model, scaling, and accessibility are deliberately handled.
Open resourceCode and pre: marking up code
code marks a fragment as computer code; pre preserves its whitespace. Together they are how code samples stay readable, copyable, and honest.
Open resourceThe datalist element
datalist attaches native autocomplete suggestions to a text input, giving users options without restricting them to a fixed list.
Open resourceDescription lists: dl, dt, and dd
dl pairs terms with their descriptions: glossaries, metadata panels, and FAQ-style content where each name maps to a value.
Open resourceThe details and summary elements
Create a native disclosure whose summary names the control and whose hidden details remain available through keyboard and assistive technology.
Open resourceThe dialog element
Present a focused modal or nonmodal dialog with a clear name, deliberate opening, contained interaction, close behavior, and focus return.
Open resourceThe div element
Use div as a block-level grouping hook when no semantic sectioning, landmark, list, or text element describes the content.
Open resourceThe fieldset and legend elements
Use fieldset and legend to give related form controls a programmatic group name, especially for radio buttons and shared questions.
Open resourceThe figure and figcaption elements
Use figure for self-contained referenced content and figcaption for its optional caption, without treating every image as a figure.
Open resourceHTML form elements
Collect user input with form, label, input, textarea, select, button, fieldset, and legend while preserving clear relationships.
Open resourceThe head element
head holds the document metadata a browser needs before rendering: charset, title, viewport, stylesheets, and canonical declarations.
Open resourceHTML heading elements
Use h1 through h6 to name sections and expose a logical content hierarchy instead of selecting headings by default size.
Open resourceThe HTML root element
Use the html element as the document root and declare the page language so browsers and assistive technology interpret content correctly.
Open resourceThe iframe element
Embed a separate browsing context only when necessary, with a useful title, bounded permissions, sandbox policy, loading plan, and fallback.
Open resourceThe img element
Embed an image with a purposeful text alternative, intrinsic dimensions, responsive source behavior, and controlled loading.
Open resourceThe input element
Collect a bounded value with an input whose type, label, name, autocomplete, constraints, and error behavior match the task.
Open resourceHTML input types
Choose an input type by the value and interaction required, while planning for browser variation, validation, and accessible recovery.
Open resourceThe label element
Use label to give a form control a persistent visible name and a larger pointer target through an explicit or implicit association.
Open resourceHTML landmark elements
Use header, nav, main, aside, and footer to expose meaningful page regions and reserve section and article for structured content.
Open resourceThe link element
Use link in document metadata to connect stylesheets, canonical URLs, icons, manifests, feeds, and performance hints to the current page.
Open resourceThe ul, ol, and li elements
Represent unordered groups and meaningful sequences with list items that preserve count, order, and nesting relationships.
Open resourceThe meta element
Add document metadata such as encoding, viewport behavior, and descriptions without treating metadata as a ranking guarantee.
Open resourceThe option and optgroup elements
Use option for choices and optgroup for labeled categories inside native select controls, while keeping labels concise and unambiguous.
Open resourceThe picture element
Provide art-directed image sources or format alternatives while preserving one accessible img fallback, dimensions, and responsive behavior.
Open resourceThe script element
Use script to load or embed executable JavaScript or data, with deliberate loading order, security policy, and no-script behavior.
Open resourceThe select element
Offer a bounded list of options with native selection, labeling, grouping, form submission, keyboard behavior, and recoverable validation.
Open resourceThe source element
Use source to offer alternate image, audio, or video resources so the browser can select a compatible or responsive candidate.
Open resourceThe span element
Use span as an inline styling or scripting hook only when the text has no more specific semantic element.
Open resourceThe strong and em elements
Use strong for importance and em for stress emphasis, then let CSS control how that meaning is presented.
Open resourceInline SVG in HTML
Use inline SVG for scalable graphics that need document-level styling, scripting, or accessible naming, while keeping decorative art silent.
Open resourceHTML table elements
Represent comparable data with table, caption, row groups, header cells, data cells, and explicit header relationships.
Open resourceThe template element
Use template to store inert DOM fragments that scripts can clone, while keeping required content and behavior available without fragile injection.
Open resourceThe textarea element
Collect multi-line plain text with a persistent label, useful size guidance, bounded submission, and accessible validation feedback.
Open resourceThe time element
Use time to pair a human-readable date, time, or duration with an optional machine-readable datetime value.
Open resourceThe title element
title names the document for browser tabs, bookmarks, search results, and screen reader announcements. Every page needs exactly one.
Open resourceThe track element
Use track with audio or video to provide timed captions, subtitles, descriptions, chapters, or metadata in WebVTT.
Open resourceThe video element
Embed video with native controls, declared sources, captions, fallback content, responsive sizing, and deliberate loading behavior.
Open resource