Att Time Datetime

## HTML `` `datetime` Attribute The `datetime` attribute of the `` element is used to provide a machine-readable format of a date, time, or duration. This allows search engines, web browsers, and assistive technologies (like screen readers) to parse and understand the date/time information accurately, regardless of how it is styled or written in the user-facing text. --- ## Browser Support The `datetime` attribute is supported by all modern web browsers (Google Chrome, Mozilla Firefox, Apple Safari, Microsoft Edge, and Opera). *Note: The `datetime` attribute does not render any visible changes or special effects on the webpage by default. Its primary purpose is to provide semantic metadata.* --- ## Definition and Usage The `` element represents a specific period in time. The `datetime` attribute is used to specify this date or time in a standardized, machine-readable format. ### Why use the `datetime` attribute? * **SEO & Search Engines:** Search engines can index your content more effectively, allowing them to display richer search results (e.g., event dates, publication times). * **Accessibility:** Screen readers can read the date or time aloud in a localized, user-friendly format. * **Automation:** Calendar applications, browser extensions, and smart assistants can automatically detect dates and offer to add them to the user's calendar. --- ## Syntax ```html User-friendly text ``` ### Example ```html

I have a date on Valentine's Day.

``` --- ## Attribute Values The `datetime` attribute accepts several standardized formats. The most common format is **`YYYY-MM-DDThh:mm:ssTZD`**. | Value Component | Description | Example | | :--- | :--- | :--- | | **`YYYY`** | Four-digit year | `2026` | | **`MM`** | Two-digit month (01 to 12) | `03` (March) | | **`DD`** | Two-digit day of the month (01 to 31) | `15` | | **`T`** | Required separator if time is specified | `T` | | **`hh`** | Two-digit hour in 24-hour format (00 to 23) | `14` (2:00 PM) | | **`mm`** | Two-digit minutes (00 to 59) | `30` | | **`ss`** | Two-digit seconds (00 to 59) | `00` | | **`TZD`** | Time Zone Designator (`Z` for UTC/GMT, or offset like `+08:00`) | `Z` or `+08:00` | --- ## Code Examples ### 1. Date Only Perfect for specifying a specific day without a time. ```html

The conference will take place on October 24th.

``` ### 2. Time Only Useful for daily schedules or recurring times. ```html

Our morning standup starts at 9:30 AM every day.

``` ### 3. Date and Time with Time Zone Specifies an exact moment in time globally. ```html

The system update will begin at 18:00 UTC on May 12.

The live stream starts at 6:00 PM local time.

``` ### 4. Year and Month Only Useful for historical references or general timelines. ```html

The project was launched in August 2025.

``` ### 5. Duration You can also represent a duration using the `P` (Period) designator. ```html

The workshop lasted for 2 and a half hours.

``` --- ## Considerations & Best Practices 1. **HTML5 Standard:** The `` tag and its `datetime` attribute were introduced in HTML5. They are not supported in older HTML 4.01 specifications. 2. **Fallback Behavior:** If the `datetime` attribute is omitted, the text content inside the `` tag must be a valid machine-readable date/time format. However, using the `datetime` attribute is highly recommended because it allows you to display user-friendly text (like "yesterday" or "next Monday") while keeping the underlying data clean and structured. 3. **Validation:** Ensure your `datetime` values strictly follow the ISO 8601 standard format. Invalid formats will prevent search engines and browsers from parsing the data correctly.

YouTip

Att Time Datetime

📂 Categories