"People do lots of stuff with that "4 hours ago." They might make it a permalink: Post published <a href="/posts/123456">4 hours ago</a> Or they might give it a tooltip to show the exact datetime upon hover/focus: Post published <Tooltip content="December 14, 2025 at 11:30 AM PST"> 4 hours ago </Tooltip> Note: I'm assuming some Tooltip component written in your favorite framework, e.g. React, Svelte, Vue, etc. There's also the bleeding-edge popover="hint" and Interest Invokers API, which would give us a succinct way to do this in native HTML/CSS."
"If you're a pedant about HTML though (like me), then you might use the element: Post published <time datetime="2025-12-14T19:30:00.000Z"> 4 hours ago </time> This is great! We now have a semantic way to express the exact timestamp of a date. So browsers and screen readers should use this and give us a way to avoid those annoying manual tooltips and... oh wait, no. The <time> element does approximately nothing."
"I did some research on this and couldn't find any browser or assistive technology that actually makes use of the <time> element, besides, you know, rendering it. (Whew!) This is despite the fact that <time> is used on roughly 8% of pageloads per Chrome's usage tracker. So what does <time> actually do? As near as I can tell, it's used by search engines to show date snippets in search results. However, I can't find any guidelines from Google that specifically advocate for the <time> element, although there is a 2023 post from Search Engine Journal which quotes a Google Search liaison: "Google doesn't depend on a single date factor because all factors can be prone to issues. That's why our systems look at several factors to determine our best estimate of when a page was published or significantly updated.""
UIs commonly display relative timestamps like "4 hours ago" and often wrap them with permalinks or tooltips to reveal exact datetimes. Tooltip components or emerging browser features such as popover="hint" and the Interest Invokers API can provide native, succinct hover/focus details. The semantic HTML <time> element allows encoding exact datetimes via the datetime attribute, but browsers and assistive technologies appear to do almost nothing with it beyond rendering. Chrome telemetry shows <time> appears on about 8% of pageloads. Search engines use <time> for date snippets, while Google recommends using multiple signals to estimate publication or update dates.
Read at Read the Tea Leaves
Unable to calculate read time
Collection
[
|
...
]