htmltimesemanticssemantic-markup

HTML time tag for duration


I need to display the duration of a video. Should I use <time> or should it be used only for displaying time as in a clock?

Example

Is this correct HTML5?

<p>Duration: <time>3:30 min</time>.</p>

Or should <time> be used only on a situation like this?

<p>Good morning. The actual time is: <time>9:45</time></p>.

Docs

MDN presents the following definition:

The HTML element represents either a time on a 24-hour clock or a precise date in the Gregorian calendar (with optional time and timezone information). This element is intended to be used presenting dates and times in a machine readable format. This can be helpful for user agents to offer any event scheduling for user's calendar.

However, the definition in W3C is somewhat different, and it refers duration:

Specifies the date or time that the element represents.

Value: Any one of the following:

  • (...)

  • a valid duration string as defined in the [HTML5] specification

Examples:

PT4H18M3S

4h 18m 3s

So, I'm not sure if I should be using <time> in this situation or not. Any thoughts?


Solution

  • Yes, you can use the time element for durations.

    But the value has to be a valid duration string, which "3:30 min" is not.

    You can use the datetime attribute to specify the correct value, and keep "3:30 min" as element content, e.g.:

    <time datetime="3m 30s">3:30 min</time>