Pernah liat artikel berita "Diposting 2 jam lalu" di feed sosial media? Format itu enak buat manusia, tapi mesin pencari Google butuh tanggal absolute supaya bisa ranking konten baru. Tag <time> solve dua problem ini sekaligus: tampilkan format ramah manusia ("3 Jan 2024" / "kemarin"), kasih atribut datetime ISO 8601 buat mesin. Satu tag, dua audience puas.

💡 SEO bonus. Google Rich Results pakai <time> buat detect publish date artikel. Halaman tanpa <time> mungkin gak muncul di "News" snippet, atau muncul tapi dengan tanggal salah. 5 detik nambahin tag = SEO juicy.

Sintaks <time> Dasar

<time datetime="2024-01-03">3 Januari 2024</time>
<time datetime="19:30">jam 19.30</time>
<time datetime="2024-01-03T19:30:00+07:00">3 Jan 2024, 19.30 WIB</time>

Atribut datetime memakai format ISO 8601 yang dikenali mesin. Teks di dalam tag bebas — boleh bahasa Indonesia, pakai kata "kemarin", apa saja yang enak dibaca manusia.

Durasi (Bukan Cuma Tanggal)

<p>Durasi kopi seduh: <time datetime="PT5M">5 menit</time></p>

PT5M artinya duration 5 menit (PT1H30M = 1 jam 30 menit).

Mengapa Pakai <time>?

• Mesin pencari menampilkan artikel kamu dengan tanggal yang benar di hasil pencarian.
• Screen reader membacakan dengan format yang konsisten.
• CSS atau JavaScript bisa memilih dan memformat ulang (misal: "2 hari lalu") berdasarkan atribut datetime.

🎭 Analogi sehari-hari

Coba liat KTP kamu — di sana tanggal lahir ditulis dua format: angka (15-04-1995) buat data resmi, plus "Lima Belas April Seribu Sembilan Ratus Sembilan Puluh Lima" yang lebih readable buat manusia. Tag <time> di HTML kerja persis sama: atribut datetime="2026-04-15" buat mesin (Google, screen reader, JavaScript), teks bebas di dalam tag buat manusia ("15 April 2026" / "kemarin" / "2 minggu lalu"). Dua audience, satu tag, semua puas.

⚠️ Jebakan yang sering ditemui

• datetime SALAH FORMAT = tidak diparse. ISO 8601 strict: 2024-01-03, 2024-01-03T19:30:00+07:00.
• Lupa atribut datetime = tag valid tapi machine tidak paham.
• Timezone: Z = UTC, +07:00 = WIB. Tanpa timezone = local time interpretation.
• Duration pakai prefix P + unit: PT5M (5 menit), P3D (3 hari), PT1H30M (1.5 jam).
• Display "X menit lalu" butuh JS — pakai library date-fns atau dayjs.
• SEO: Google Rich Results gunakan <time> untuk article publish date.

TL;DR: <time datetime="2024-01-03">3 Januari 2024</time> = tag tanggal/waktu semantik. datetime = ISO 8601 buat mesin (YYYY-MM-DD, T19:30:00+07:00); teks bebas buat manusia. Duration: PT5M (5 menit), P3D (3 hari). SEO: Google Rich Results pakai <time> buat article date. Salah format = gak ke-parse. Pakai library date-fns/dayjs buat display "2 hari lalu".