<time> w HTML to semantyczny znacznik służący do oznaczania czasu, daty lub przedziału czasowego w treści strony internetowej. Jego główną rolą jest zarówno poprawa zrozumienia treści przez użytkowników, jak i umożliwienie maszynom (np. wyszukiwarkom internetowym czy asystentom głosowym) precyzyjnego rozpoznania, interpretacji oraz przetwarzania danych czasowych.
Budowa i podstawowe zastosowanie
Znacznik <time> może służyć do oznaczania:
- Dat (np. „2025-08-07”);
- Godzin (np. „10:00”, „16:30”);
- Okresów czasu (np. „dwie godziny”, „cały wrzesień”);
- Terminów wydarzeń (np. „Valentynki”, „Black Friday”);
- Między innymi sytuacji, w których informacja o czasie jest czytelna dla użytkownika, ale wymaga również formatowania zrozumiałego dla maszyn.
Aby przekazać wartość czasu w formacie zrozumiałym dla programów i przeglądarek, używa się atrybutu datetime, w którym podaje się czas w standaryzowanym, maszynowym zapisie.
Przykładowe użycia znacznika <time>
- Proste oznaczenie godziny lub daty
<p>Sklep czynny od <time>10:00</time> do <time>21:00</time> w dni powszednie.</p> Tutaj <time> informuje zarówno użytkownika, jak i maszynę, że chodzi o konkretne godziny otwarcia sklepu.
- Data wydarzenia z atrybutem
datetime
<p>Mam spotkanie <time datetime="2025-08-07T20:00">7 sierpnia 2025 o 20:00</time>.</p> Atrybut datetime zawiera precyzyjny zapis daty i godziny w formacie ISO 8601, co umożliwia wyświetlanie tej informacji w różnych formatach, oferowanie przypomnień przez aplikacje oraz lepsze indeksowanie przez wyszukiwarki.
- Oznaczanie przedziału czasu
<p>Kurs trwa od <time datetime="2025-09-01">1 września</time> do <time datetime="2025-12-31">31 grudnia 2025</time>.</p> Dzięki tej strukturze można jasno określić ramy czasowe wydarzenia lub okres działalności.
Znaczenie semantyczne i korzyści dla SEO, UX i dostępności
- SEO – używanie semantycznych znaczników, takich jak
<time>, pozwala wyszukiwarkom lepiej interpretować kluczowe informacje w treści, np. daty publikacji, terminy wydarzeń czy recenzje czasowe, co może wpływać na widoczność strony i jej pozycję w wynikach; - Dostępność (a11y) – przeglądarki i czytniki ekranu mogą informować użytkowników z niepełnosprawnościami o charakterze oznaczonej treści jako dacie lub czasie;
- Przetwarzanie danych – programy, boty i asystenci cyfrowi mogą automatycznie wyodrębniać daty z treści strony, np. do integracji z kalendarzami czy przypomnieniami.
Atrybuty i możliwości konfiguracji
- datetime – to kluczowy atrybut, który ułatwia maszynom jednoznaczne interpretowanie czasu. Wartość powinna być zapisana w formacie zgodnym z ISO 8601 (np. YYYY-MM-DD lub YYYY-MM-DDThh:mm);
- Możliwość stosowania pozostałych atrybutów globalnych i zdarzeń tak, jak w innych znacznikach HTML.
Najważniejsze zasady i dobre praktyki
- Używaj znacznika
<time>, gdy w treści pojawia się informacja o dacie lub czasie, która może mieć znaczenie dla maszyn (np. data publikacji artykułu, deadline konkursu, harmonogram wydarzeń); - Przy istotnych datach lub godzinach zawsze stosuj atrybut
datetime; - Dbaj o poprawność formatu wartości
datetime, aby unikać błędów interpretacyjnych przez programy i wyszukiwarki.
Podsumowanie
Znacznik <time> to prosty, ale niezwykle ważny element HTML do oznaczania informacji czasowych w serwisach internetowych. Jego stosowanie wspiera dostępność, SEO i przyszłościową interoperacyjność strony, czyniąc ją bardziej czytelną zarówno dla użytkowników, jak i aplikacji oraz wyszukiwarek.
