30. Time, Figures, and Captions
30.1 The <time> Element
Used to mark up dates, times, or durations in a machine-readable format. This helps search engines, accessibility tools, and scheduling software.
The human-readable text goes inside, and the machine-readable format goes in the datetime attribute (using ISO 8601 standard).
html
<p> The conference starts on <time datetime="2025-01-20">January 20, 2025</time>. </p> <p> It lasted for <time datetime="PT3H">three hours</time>. </p>30.2 Figures and Captions
The <figure> element is used to enclose content (like images, charts, code blocks, or videos) that is self-contained and referenced from the main flow of text. The <figcaption> element provides a caption for the figure.
html
<figure> <img src="chart.png" alt="Quarterly Sales Chart"> <figcaption> Figure 1. Quarterly sales increased by 15%. </figcaption> </figure>Benefit: The browser knows that the image and caption are semantically linked.