HTML <time> Tag – Proper Understanding and Usage

Definition and Usage

The <time> tag represents a date or time in a standardized, machine-readable format.

Using this tag to specify date- or time-related content in a standardized, machine-readable format helps screen readers, search engines, and other tools more accurately interpret and process the information.

The content of the <time> tag is limited to various types of dates, times, time-zone offsets, and durations.
In other words, it should only contain information related to date or time.

Basic Example

When using the <time> tag, browsers do not apply any special visual styling by default.

Dates and Times in a Standardized, Machine-Readable Format

The <time> tag must consist entirely of a date or time written in a standardized, machine-readable format.

This standardized, machine-readable date or time refers to a valid value of the datetime attribute and must conform to one of the appropriate formats listed in the table below.

Valid `datetime` Values
Valid `datetime` Value Format	Example
Valid year string	`2011` (Represents the year only)
Valid year-month string	`2011-11` (Represents the year and month)
Valid year-month-day string	`2011-11-18` (Represents the year, month, and day)
Valid month-day string	`11-18` (Represents the month and day)
Valid week string	`2011-W47` (Indicates the 47th week of 2011)
Valid time string	`14:54` (Represents the hour and minute) `14:54:39` (Represents hour, minute, and second) `14:54:39.929` (Represents hour, minute, second, and millisecond)
Valid time-zone offset string	`Z` (UTC (Coordinated Universal Time, zero offset) – equivalent to +00:00) `+0000` (UTC with no offset) `+00:00` (UTC with no offset, colon added for readability) `-0800` (8 hours behind UTC – e.g., Pacific Standard Time (PST)) `-08:00` (Same as above, but colon included for readability)
Valid local date and time string	`2011-11-18T14:54:39.929` (Date and time separated by a 'T') `2011-11-18 14:54:39.929` (Date and time separated by a space)
Valid international date and time string (Indicates UTC timezone)	`2011-11-18T14:54:39.929Z` `2011-11-18T14:54:39.929-0400` `2011-11-18T14:54:39.929-04:00` `2011-11-18 14:54:39.929Z` `2011-11-18 14:54:39.929-0400` `2011-11-18 14:54:39.929-04:00`
Valid duration string	`PT4H18M3S` (Represents a duration of hours, minutes, and seconds)

Valid Syntax

The following examples show valid syntax using datetime content.

Valid international date and time string (Indicates UTC timezone)

<time>2011-11-18T14:54:39.929Z</time>
<time>2011-11-18T14:54:39.929-0400</time>
<time>2011-11-18T14:54:39.929-04:00</time>
<time>2011-11-18 14:54:39.929Z</time>
<time>2011-11-18 14:54:39.929-0400</time>
<time>2011-11-18 14:54:39.929-04:00</time>

Invalid Syntax

Using the `datetime` Attribute

The <time> tag allows you to specify a machine-readable standardized format using the datetime attribute, even if the content itself is not in a machine-readable format.

You should set the datetime attribute to a valid datetime value format.
Let's look at some examples.

As noted earlier, the following syntax is invalid:

However, if you specify a valid datetime value format in the datetime attribute, the syntax becomes valid:

By using the datetime attribute to provide a machine-readable standardized date or time, you can freely use any text as the content displayed to users, and the syntax will still be valid.