HTML Semantics
Mark up an event date using time and a valid machine-readable date.
Understand the topic
Semantic HTML selects elements for their meaning. An article is a self-contained composition, a section groups related content normally with a heading, and time can provide machine-readable dates. Native semantics help accessibility tools and make code easier to understand. A generic wrapper remains useful when no specific semantic element accurately describes the content.
Worked example
<article>
<h2>New reading room opens</h2>
<p>Published <time datetime="2026-10-14">14 October 2026</time></p>
<p>The library now has a quiet study area.</p>
</article>The story can stand on its own, so article fits. The time element pairs a human-friendly date with a standardized datetime value.
Practice
Mark up an event date using time and a valid machine-readable date.
Show a suggested answer
<time datetime="2026-11-07">7 November 2026</time>Common mistake
Do not add role="button" to a div when a real button already provides the needed semantics and keyboard behavior.