Тег time отмечает дату, время или промежуток времени. Читатель видит обычный текст, например «25 сентября» или «в восемь вечера», а в атрибуте datetime записано машиночитаемое значение - запись в строго заданном формате, которую программа разбирает без догадок: 2026-09-25T20:00. Тег парный, закрывающий обязателен, собственный атрибут у него один - datetime.
Когда без datetime не обойтись, какие форматы даты и времени браузер и программы принимают, как записать часовой пояс, как связать дату публикации с микроразметкой и какие ошибки встречаются чаще всего, - ответы ниже.
<p>Концерт начнётся
<time datetime="2026-09-25T20:00">в 20:00</time>.</p>В этой статье
- Тег time в HTML: что это и для чего нужен
- Атрибут datetime в теге time: когда он обязателен
- Форматы и примеры тега time: дата, время, неделя, продолжительность
- Часовой пояс в теге time: почему 20:00 у читателей разное
- Дата публикации в теге time: точная дата в datetime, «3 дня назад» в тексте
- Тег time или data, abbr, span: как выбрать
- Частые ошибки с тегом time
Тег time в HTML: что это и для чего нужен
Тег относится к семантическим: он сообщает смысл текста, а не его вид. У такого текста два читателя. Человек читает слова внутри тега, как любой другой текст. Программа - календарь, скрипт, поисковик - берёт значение из datetime и не гадает, что значит «в среду вечером».
Сам браузер значение не форматирует, не пересчитывает и не показывает. В Chrome time выглядит как обычный текст: строчный, без курсива и подчёркивания, в заголовке жирный, в ссылке берёт цвет ссылки. Стандарт WHATWG описывает элемент как точную дату и время, а справка MDN добавляет, что значение нужно, например, чтобы программа могла добавить событие в календарь.
Скрипт на JS читает значение через свойство dateTime. Если атрибута нет, свойство возвращает пустую строку, а текст остаётся просто текстом.
const t = document.querySelector('time');
console.log(t.dateTime);Атрибут datetime в теге time: когда он обязателен
Атрибут datetime не всегда нужен. Если его нет, текст внутри time сам должен быть корректным значением: , 2026-09-25 или 2026-09. Когда текст записан иначе, например «25 сентября» или «сегодня в 11:25», программа его не поймёт, и datetime обязателен.
<p>Начало в <time>20:00</time>.</p>
<p>Начало <time datetime="2026-09-26">завтра</time>.</p>Слова «сегодня» и «завтра» через день потеряют смысл, а значение в datetime остаётся точным. Ещё одно различие: с datetime внутри time допускаются другие теги, например strong, а без него только текст.
Пример: нужен ли datetime
Шесть записей. Выберите ответ, и кадр покажет, что получится: он проверяет текст по правилам формата, которые описаны в следующем разделе.
Форматы и примеры тега time: дата, время, неделя, продолжительность
Форматы значения основаны на стандарте ISO 8601, но HTML разрешает не все его варианты. Полный список есть в справке MDN (на английском), ниже основные.
| Что записываем | Как пишется | Пример | Что означает |
|---|---|---|---|
| Год | ГГГГ | 2026 | Весь год |
| Месяц | ГГГГ-ММ | 2026-09 | Сентябрь 2026 |
| Дата | ГГГГ-ММ-ДД | 2026-09-25 | Конкретный день |
| Дата без года | ММ-ДД | 09-25 | День, который повторяется каждый год |
| Неделя | ГГГГ-Wнн | 2026-W39 | 39-я неделя года |
| Время | ЧЧ:ММ или ЧЧ:ММ:СС | 20:00 | Время суток |
| Дата и время | дата, буква T или пробел, время | 2026-09-25T20:00 | Часовой пояс не записан |
| С часовым поясом | дата и время, затем Z или +03:00 | 2026-09-25T20:00+03:00 | Точный момент времени |
| Продолжительность | PT1H30M или 1h 30m | PT1H30M | 1 час 30 минут |
Месяц, день, часы и минуты пишутся двумя цифрами, а год - не меньше чем четырьмя. Часы идут от 00 до 23, недели начинаются в понедельник, а первая неделя года та, в которой есть первый четверг. Продолжительность в форме PT1H30M состоит из дней, часов, минут и секунд, годы и месяцы в ней запрещены. Вторая форма, 1h 30m, тоже допустима.
<time datetime="2026-W39">39-я неделя</time>
<time datetime="PT1H30M">1 ч 30 мин</time>
<time datetime="09-25">25 сентября</time>У формата есть границы. Год не может быть меньше 0001, а приблизительные даты вроде «около 1990 года» тег не передаёт: он нужен только для точных значений. Вложить один time в другой тоже нельзя.
Пример: проверка записи
Введите своё значение или нажмите на готовую запись. Кадр проверяет её по правилам стандарта и объясняет, чем она не подходит. Браузер сам такие записи не проверяет.
Часовой пояс в теге time: почему 20:00 у читателей разное
Значение без часового пояса не задаёт момент времени: 2026-09-25T20:00 означает просто «20:00 25 сентября» по местным часам. Если событие происходит в определённый момент, например вебинар, пояс записывают: буквой Z для UTC или смещением вроде +03:00. Тогда «20:00 +03:00» у читателя в Нью-Йорке превратится в 13:00.
<p>Вебинар начнётся
<time datetime="2026-09-25T20:00+03:00">
в 20:00 по Киеву</time>.</p>Текст остаётся вашим, а точное значение записано в datetime. Скрипт может вывести время в поясе читателя: значение передают в Date, а вывод форматируют через Intl.DateTimeFormat.
const t = document.querySelector('time');
const d = new Date(t.dateTime);
t.textContent = new Intl.DateTimeFormat('ru', {
dateStyle: 'long', timeStyle: 'short'
}).format(d);У Date есть ловушки, и в Chrome они проявляются так. Дата без времени, например 2026-09-25, считается полуночью по UTC, поэтому при выводе в поясе западнее Гринвича она превратится в 24 сентября. Календарный день выводят без пересчёта пояса. Дату и время без пояса Date читает по часам самого читателя. А недели, продолжительность и просто время Date не разбирает совсем.
Пример: время события у читателей в разных городах
Выберите запись значения и город читателя. Кадр пересчитывает время события через Intl.DateTimeFormat и показывает, что увидит читатель.
Дата публикации в теге time: точная дата в datetime, «3 дня назад» в тексте
Самый частый случай - дата публикации. Допустим, статья вышла . Читатель видит дату в привычном виде, а программа читает точное значение из datetime.
<p>Опубликовано
<time datetime="2026-09-25">25 сентября 2026</time>
</p>Ту же дату записывают в микроразметку: свойство datePublished в JSON-LD. В рекомендациях Google по датам советуют показывать дату на странице и указывать datePublished и dateModified, а сам тег time в этих рекомендациях не упомянут. Там же предупреждают, что даты в тексте и в микроразметке не должны расходиться.
{
"@type": "Article",
"datePublished": "2026-09-25"
}Атрибут pubdate для даты публикации описывают старые справочники. В современном стандарте и в справке MDN у time один собственный атрибут, datetime, поэтому pubdate не нужен.
Многие сайты показывают «3 дня назад». Такой текст строит скрипт, а точная дата остаётся в datetime. Если скрипт не сработает, читатель всё равно увидит дату, записанную вручную.
const rtf = new Intl.RelativeTimeFormat('ru', {
numeric: 'auto'
});
rtf.format(-3, 'day'); // 3 дня назадПример: «3 дня назад» из datetime
Кнопки задают, сколько времени прошло с публикации. Кадр строит короткую запись через Intl.RelativeTimeFormat, а значение datetime не меняется.
Тег time или data, abbr, span: как выбрать
Тег time подходит, когда значение является датой или временем в одном из форматов выше. Для остальных значений, например цены или кода товара, нужен другой тег. У ins и del атрибут datetime записывает время правки в том же формате.
| Тег | Что он отмечает | Когда выбрать |
|---|---|---|
time | Дату, время или промежуток в стандартных форматах | Значение можно записать в одном из форматов из таблицы |
data | Значение любого другого вида: цену, код, номер | Значение не дата и не время, но программе оно нужно |
| abbr | Сокращение с расшифровкой | Нужно объяснить аббревиатуру, например ISO |
span | Ничего не сообщает | Нужен только класс для стилей, программе значение не нужно |
Частые ошибки с тегом time
Почти все ошибки сводятся к неверному формату значения: программа такое значение не разберёт, а браузер молча выведет текст.
| Ошибка | Что происходит | Как исправить |
|---|---|---|
Дата в привычном порядке: datetime="25.09.2026" | Такой записи нет среди форматов, программа значения не поймёт | datetime="2026-09-25": год, месяц, день через дефисы |
Слова вместо значения: <time>25 сентября</time> без атрибута | Текст сам не является значением, программа его пропустит | Добавить datetime="2026-09-25" |
Числа без нулей: datetime="2026-9-5" | Месяц и день должны быть из двух цифр | datetime="2026-09-05" |
Несуществующая дата: datetime="2026-02-30" | В феврале нет 30 числа, значение не проходит проверку | Проверить календарь: 2026-02-28 |
Пояс словами: datetime="2026-09-25T20:00 MSK" | Пояс записывается только как Z или смещение | datetime="2026-09-25T20:00+03:00" |
Событие в определённый момент записано без пояса: datetime="2026-09-25T20:00" | Читатели в разных городах получат разное время | Добавить смещение: +03:00 |
Приблизительная дата: <time datetime="1990">около 1990 года</time> | Тег передаёт точное значение, а текст говорит, что оно неточное | Записать в обычном тексте, без time |
Вложенный time: <time><time>20:00</time></time> | Стандарт это запрещает | Один time на одно значение |
| Ждут, что браузер сам покажет дату по-своему и в поясе читателя | Браузер выводит текст внутри тега без изменений | Использовать скрипт с Intl.DateTimeFormat |
