HTML time ve data Etiketi: datetime Özniteliği ve Tarih-Saat Biçimleri

time öğesi ne işe yarar?

MDN'e göre <time> belirli bir zaman dilimini temsil eder ve şu üç şeyden birini gösterebilir: 24 saatlik düzende bir saat, Gregoryen takvimde kesin bir tarih (isteğe bağlı olarak saat ve saat dilimi bilgisiyle) ya da geçerli bir süre. Öğenin amacı tarih ve saatleri makine okunur biçimde sunmaktır; MDN bunun bir tarayıcının etkinliği kullanıcının takvimine eklemeyi önermesi gibi özelliklere ve daha iyi arama motoru sonuçlarına yardımcı olabileceğini belirtir.

Öğenin kendine ait tek özniteliği datetime'dır. MDN burada "datetime değeri" kavramını kullanır: Öğenin makine okunur değeri, datetime özniteliği varsa onun değeridir. Öznitelik yoksa değer, öğenin içindeki metindir ve bu durumda öğenin hiçbir alt öğesi olmamalıdır. Yani <time>2026-11-07</time> geçerlidir, çünkü metin zaten doğru biçimdedir; ama içinde <strong> gibi bir öğe bulunan bir <time> için datetime yazmanız gerekir.

<p>Konser <time datetime="2026-11-15T20:00+03:00">15 Kasım akşamı saat 20.00'de</time> başlayacak.</p>
<p>Konser yaklaşık <time datetime="PT2H30M">iki buçuk saat</time> sürecek.</p>
<p>Son güncelleme: <time>2026-11-07</time></p>

İlk satırda okuyucu Türkçe bir ifade görür, makine ise saat dilimi ofsetiyle birlikte kesin anı okur. İkinci satırda bir süre, üçüncü satırda ise datetime olmadan, metni zaten geçerli bir tarih olan bir <time> vardır. MDN ayrıca bu öğenin Gregoryen takvimin kullanılmaya başlanmasından önceki tarihler için kullanılmaması gerektiğini, çünkü bu tarihlerin hesaplanmasının karmaşık olduğunu belirtir.

<time> cümle içi içeriktir; bir paragrafın, bir liste öğesinin ya da bir başlığın içinde durabilir ve içine cümle içi içerik alır. Varsayılan ARIA rolü time, DOM arayüzü HTMLTimeElement'tir.

Geçerli datetime değerleri

<time> sayfası, datetime özniteliğinin kabul ettiği biçimleri bir tablo halinde verir. Aşağıda aynı tabloyu Türkçe açıklamalarla özetliyoruz:

Tablodaki yer tutucuların anlamı şöyledir: YYYY yıl, MM ay (iki haneli), DD gün, HH saat, ikinci sütundaki MM dakika, SS saniye, mmm milisaniyedir. Süre biçiminde P harfi sürenin başladığını, D gün, T saat kısmının başladığını, H saat, M dakika, S saniye bilgisini gösterir; saniye kesirli de yazılabilir (PT7H12M13.56S). Alternatif süre yazımında hafta, gün, saat, dakika ve saniye değerleri w, d, h, m, s harfleriyle boşlukla ayrılarak yazılır.

Tarih dizgelerinin temel kuralları

MDN'in "Date and time formats" rehberi, bu biçimlerin ISO 8601 standardının bir varyasyonu olduğunu ve HTML spesifikasyonunun bu dizgeleri ayrıştırmak için ISO 8601'den daha kesin algoritmalar içerdiğini belirtir. Bu yüzden ISO 8601 ile uyumlu görünen her dizgenin HTML'de de geçerli olduğunu varsaymamak gerekir. Temel kurallar şunlardır:

• Karakter kümesi: HTML'deki tarih ve saatler her zaman ASCII karakterlerle yazılmış dizgelerdir. Türkçe ay adları ya da farklı rakam sistemleri datetime değerinde kullanılmaz.
• Takvim: Tüm yıllar, geriye doğru genişletilmiş (proleptik) Gregoryen takvime göre yazılır. Arayüz başka bir takvimle giriş yapılmasına izin verse bile alttaki değer Gregoryen takvimdedir. HTML açısından bu takvim milattan sonra 1. yıla kadar uzatılır.
• Yıl: Yıllar en az dört hanelidir; 1000'den küçük yıllar baştaki sıfırlarla doldurulur, yani 72 yılı 0072 olarak yazılır. Milattan önceki yıllar desteklenmez.
• Ay ve gün: Aylar 01 ile 12 arasında iki haneli yazılır. Şubat normalde 28, artık yıllarda 29 gündür. Artık yıl, 400'e bölünebilen ya da 4'e bölünüp 100'e bölünemeyen yıldır.

Saat dizgeleri: Dakika, saniye, milisaniye

Bir saat dizgesi dakika, saniye ya da milisaniye hassasiyetinde olabilir; ama yalnızca saati ya da yalnızca dakikayı yazmak geçerli değildir. En kısa geçerli biçim iki haneli saat, iki nokta üst üste ve iki haneli dakikadır (08:45). Rehberin saydığı ek kurallar şunlardır:

• Saat her zaman 24 saatlik düzende yazılır; 00 gece yarısı, 23 akşam 11 saatidir. Bu aralığın dışındaki değerlere izin verilmez.
• Dakika 00 ile 59 arasında iki haneli bir sayıdır.
• Saniye yazılmayacaksa dakikadan sonra iki nokta üst üste konmaz.
• Saniye yazılırsa tam kısmı 00 ile 59 arasında olmalıdır; artık saniye için 60 ya da 61 kullanılamaz.
• Saniye tam sayı ise ardından ondalık nokta gelmez. Kesir yazılacaksa noktadan sonra bir, iki ya da üç hane kullanılır.

Yerel ve küresel tarih-saat, saat dilimi ofseti

Yerel tarih ve saat dizgesi, bir tarih ile bir saatin T harfi ya da bir boşlukla birleştirilmesinden oluşur ve saat dilimi bilgisi içermez; değerin kullanıcının yerel saat diliminde olduğu varsayılır. Bir datetime-local form alanına değer atandığında MDN dizgenin normalleştirildiğini anlatır: Ayırıcı her zaman T olur ve saniye :00 ise atılır. Bu davranış form alanına özgüdür; ayrıntısı tarih alanları yazısındadır.

Küresel tarih ve saat dizgesi, yerel dizgenin sonuna bir saat dilimi ofseti eklenmiş halidir. Z değerin UTC olduğunu söyler. Diğer durumlarda ofset şöyle kurulur: Başlangıç meridyeninin doğusundaki dilimler için artı, batısındakiler için eksi işareti; 00 ile 23 arasında iki haneli saat; isteğe bağlı iki nokta üst üste; 00 ile 59 arasında iki haneli dakika. Biçim -23:59 ile +23:59 arasına izin verse de MDN, bugün kullanılan ofsetlerin -12:00 ile +14:00 arasında olduğunu ve dakika kısmının yalnızca 00, 30 ya da 45 olduğunu, ancak ülkelerin saat dilimlerini her an değiştirebileceğini hatırlatır. Örneğin UTC'nin üç saat doğusundaki bir saat dilimi için +03:00 ya da +0300 yazarsınız.

Hafta ve ay dizgeleri

Hafta dizgesi bir yıl, kısa çizgi, büyük W harfi ve iki haneli hafta numarasından oluşur: 2001-W37. Hafta numarası 01 ile 53 arasındadır. Haftalar pazartesi başlar, pazar biter ve yılın ilk haftası, yılın ilk perşembesini içeren haftadır. Bu yüzden ocak ayının ilk birkaç günü önceki yılın son haftasına, aralığın son günleri de sonraki yılın ilk haftasına düşebilir. MDN'in örneğinde 1953'ün ilk perşembesi 1 Ocak'tır; o hafta 29 Aralık pazartesi başladığı için 30 Aralık 1952 tarihi 1953-W01 haftasındadır. Bir yıl, 1 Ocak perşembeye denk geliyorsa ya da 1 Ocak çarşambaya denk gelip yıl artık yılsa 53 haftalıktır; diğer yıllar 52 haftadır.

Ay dizgesi ise yılın herhangi bir ocak ayını değil, belirli bir yılın belirli bir ayını temsil eder: 2019-01 "Ocak 2019" demektir. Yıl en az dört haneli olduğu için çok uzak yıllar da yazılabilir; MDN örneklerinde 17310-09 gibi beş haneli bir yıl da geçer.

data öğesi: Tarih dışındaki makine okunur değerler

<data>, belirli bir içeriği makine okunur bir karşılıkla ilişkilendirir. Kendine ait tek özniteliği value'dur ve içeriğin makine okunur çevirisini taşır. MDN'in kuralı nettir: İçerik zaman ya da tarihle ilgiliyse <data> değil, <time> kullanılmalıdır. <data> cümle içi içeriktir, varsayılan rolü generic, DOM arayüzü HTMLDataElement'tir.

<p>Paketler:</p>
<ul>
  <li><data value="WH-101">Başlangıç Paketi</data></li>
  <li><data value="WH-102">Profesyonel Paket</data></li>
  <li><data value="WH-103">Kurumsal Paket</data></li>
</ul>

MDN örneğinde olduğu gibi burada okuyucu paket adlarını görür, her adın arkasında ise bir ürün kodu durur. Bir betik bu kodları okuyarak sepete ekleme ya da karşılaştırma gibi işler yapabilir. <data> öğesi ile data-* öznitelikleri farklı şeylerdir: Öğe, görünen metnin makine okunur karşılığını söyler; öznitelikler ise bir öğeye betikler için özel bilgi ekler. Öznitelikler için data-* öznitelikleri yazısına bakabilirsiniz.

Yayın tarihleri, address ve ins/del

<time> en çok makale ve yorum tarihlerinde kullanılır. <article> sayfası, bir yazının yayın tarih ve saatinin bir <time> öğesinin datetime özniteliğiyle verilebileceğini söyler. <address> sayfası da buna bağlı bir uyarı yapar: <address> yalnızca iletişim bilgisi içermeli, yayın tarihi gibi bilgiler ise bir <time> öğesine aittir.

Aynı tarih biçimleri <ins> ve <del> öğelerinin datetime özniteliğinde de kullanılır. Bu öznitelik, içeriğin eklendiği ya da silindiği tarihi veya tarih ve saati belirtir. Form tarafında date, datetime-local, month, time ve week türündeki <input> alanlarının değeri de bu biçimlerdedir.

<article>
  <h2>Program güncellemesi</h2>
  <p>Yayın: <time datetime="2026-11-07T10:00+03:00">7 Kasım 2026, 10.00</time></p>
  <p>Etkinlik yeri <del datetime="2026-11-07">A salonu</del>
  <ins datetime="2026-11-07">B salonu</ins> olarak güncellendi.</p>
  <p>Kayıtlar <time datetime="2026-W46">46. hafta</time> boyunca açık.</p>
</article>

Bu örnekte yayın anı ofsetli bir küresel tarih-saat, silme ve ekleme yalnızca tarih, kayıt süresi ise bir hafta dizgesidir. Arama motorlarının yayın tarihini anlamasına yardım eden yapılandırılmış veri ayrı bir konudur; JSON-LD için schema.org ve JSON-LD yazısına bakabilirsiniz.

Sık yapılan hatalar

• Türkçe tarih biçimini datetime içine yazmak: 07.11.2026 ya da 7 Kasım 2026 geçerli bir değer değildir. Makine okunur değer 2026-11-07 biçimindedir; Türkçe yazım öğenin içindeki görünen metinde kalır.
• 12 saatlik düzen kullanmak: 2:30 PM geçersizdir; saat dizgeleri her zaman 24 saatlik düzende yazılır (14:30).
• Yalnızca saat yazmak: datetime="14" geçerli değildir; en az saat ve dakika gerekir.
• Tek haneli ay ya da gün: 2026-1-7 yerine 2026-01-07 yazılır.
• datetime olmadan alt öğe kullanmak: datetime özniteliği yoksa <time> öğesinin içinde başka öğe bulunmamalıdır ve metnin kendisi geçerli bir değer olmalıdır.
• Tarih için data kullanmak: MDN, zamanla ilgili içerik için <time> öğesinin kullanılması gerektiğini söyler.
• Ofsetin farkında olmamak: Ofsetsiz bir tarih-saat yereldir. Sunucu saatiyle yayımlanan bir etkinlik saatini farklı bir saat diliminde okuyan kullanıcı için anlam kayabilir.
• Hafta numarasını yerel takvimle karıştırmak: HTML hafta numarası pazartesi başlayan ve yılın ilk perşembesine göre sayılan haftalara dayanır; yıl başındaki ve sonundaki günler komşu yılın haftasına düşebilir.

Sık Sorulan Sorular

time öğesi sayfadaki tarihi otomatik olarak biçimlendirir mi?

Hayır. <time> görünen metni değiştirmez; ne yazarsanız o görünür. Öğe yalnızca makine okunur değeri taşır. Tarihi kullanıcının diline göre biçimlendirmek isterseniz bunu sunucu tarafında ya da JavaScript ile yaparsınız; JavaScript tarafı için JavaScript öğrenme rehberine bakabilirsiniz.

datetime değerinde T yerine boşluk kullanabilir miyim?

Evet. Yerel ve küresel tarih-saat dizgelerinde tarih ile saat arasına T harfi ya da tek bir boşluk konabilir. MDN'in <article> örneğinde 2015-05-16 19:00 biçimi kullanılır.

Sadece yılı işaretlemek mümkün mü?

Evet. Dört ya da daha fazla ASCII rakamdan oluşan bir değer geçerlidir: <time datetime="2026">bu yıl</time>. Yılsız bir tarih için 11-07 gibi ay-gün biçimi de vardır.

data ile gizli bir input arasındaki fark nedir?

<data>, görünen bir metnin makine okunur karşılığını belgenin içinde taşır; bir form denetimi değildir. Gizli bir form alanı ise kullanıcıya gösterilmeden form verisiyle sunucuya gönderilen bir değerdir. Form alanları için input türleri rehberine bakabilirsiniz.

Marka adları sahiplerine aittir. Bu yazı bağımsız bir teknik rehberdir; adı geçen kuruluşlarla bayilik veya ortaklık ilişkisi bulunduğu anlamına gelmez.

İlgili içerikler: HTML öğrenme rehberi · input date ve time alanları · data-* öznitelikleri · article ve section farkı · schema.org ve JSON-LD · Semantik etiketler