time: وقتی می‌خوای تاریخ رو هم برای آدم، هم برای ماشین معنادار کنی

تا اینجای این فصل، چندبار تو مثال‌ها تاریخ نوشتیم؛ مثلاً «تاریخ انتشار: ۱۵ فروردین ۱۴۰۳» رو تو یه پاراگراف یا header ساده. اما این نوشتن ساده یه مشکل داره: برای یه آدم قابل‌خوندنه، اما برای یه ماشین (مثل مرورگر یا گوگل) هیچ معنای مشخصی نداره؛ فقط یه رشته متن عادیه. تگ time دقیقاً همین مشکل رو حل می‌کنه.

time چیه؟

<p>تاریخ انتشار: <time>۱۵ فروردین ۱۴۰۳</time></p>

تگ time برای نشون‌دادن یه تاریخ، زمان، یا مدت‌زمان استفاده می‌شه. به‌تنهایی (بدون هیچ ویژگی اضافه)، این تگ فقط یه معنای عمومی می‌ده که «این متن یه مفهوم زمانیه»، اما قدرت واقعیش وقتی آشکار می‌شه که از ویژگی datetime استفاده کنیم.

ویژگی datetime: نسخه‌ی ماشین‌خوان تاریخ

<p>تاریخ انتشار: <time datetime="2024-04-03">۱۵ فروردین ۱۴۰۳</time></p>

ویژگی datetime یه نسخه‌ی استاندارد و ماشین‌خوان از همون تاریخ رو ارائه می‌ده، با فرمت مشخص YYYY-MM-DD (سال-ماه-روز، به تقویم میلادی). نکته‌ی مهم اینه که متنی که کاربر می‌بینه (بین تگ باز و بسته) می‌تونه هر فرمتی داشته باشه که برای انسان‌ها راحت‌تره (مثلاً تاریخ شمسی یا حتی یه عبارت مثل «دیروز»)، اما مقدار datetime باید همیشه استاندارد و دقیق باشه.

چرا این تفکیک بین نمایش و datetime مهمه؟

فکرش رو بکن: اگه فقط بنویسی «۱۵ فروردین ۱۴۰۳»، یه ماشین (مثل گوگل یا یه اپلیکیشن تقویم) نمی‌تونه مطمئن باشه این دقیقاً معادل کدوم تاریخ میلادیه، یا اصلاً مطمئن نیست این رشته متنی واقعاً یه «تاریخ» هست یا یه عدد معمولی. اما وقتی datetime="2024-04-03" رو اضافه می‌کنی، به‌صورت قطعی و بدون ابهام مشخص می‌کنی این متن دقیقاً معادل چه تاریخی تو تقویم استانداره.

مثال با زمان دقیق (ساعت و دقیقه)

<p>این رویداد در ساعت <time datetime="2024-04-03T18:30">۱۸:۳۰</time> برگزار می‌شود.</p>

برای مشخص‌کردن ساعت دقیق در کنار تاریخ، از حرف T به‌عنوان جداکننده‌ی تاریخ و ساعت استفاده می‌شه، و بعدش ساعت به فرمت ۲۴ ساعته (ساعت:دقیقه) نوشته می‌شه.

مثال برای مدت‌زمان (نه یه نقطه‌ی زمانی مشخص)

<p>مدت‌زمان این ویدیو: <time datetime="PT15M30S">۱۵ دقیقه و ۳۰ ثانیه</time></p>

تگ time محدود به یه «نقطه‌ی زمانی مشخص» (مثل تاریخ انتشار) نیست؛ می‌تونه برای مدت‌زمان هم استفاده بشه. فرمت PT15M30S یه استاندارد خاص برای مدت‌زمانه: P شروع مدت رو نشون می‌ده، T جداکننده‌ی بخش ساعت/دقیقه/ثانیه‌ست، 15M یعنی ۱۵ دقیقه، و 30S یعنی ۳۰ ثانیه.

کاربرد رایج: تاریخ انتشار مقالات وبلاگ

<article>
  <header>
    <h1>آموزش کامل HTML5</h1>
    <p>
      نویسنده: علی محمدی — 
      منتشر شده در <time datetime="2024-04-03">۱۵ فروردین ۱۴۰۳</time>
    </p>
  </header>
  <p>متن کامل مقاله...</p>
</article>

این دقیقاً یکی از رایج‌ترین کاربردهای واقعی tag time هست؛ همون‌طور که تو درس ۸-۲ دیدیم، header داخل article می‌تونه شامل تاریخ انتشار باشه، و بهتره این تاریخ همیشه با time و datetime نوشته بشه، نه فقط یه متن ساده.

ویژگی datetime برای تاریخ نسبی هم مفیده

<p>این نظر <time datetime="2024-04-03">۲ روز پیش</time> ثبت شده است.</p>

یه کاربرد جالب دیگه اینه که متن قابل‌مشاهده می‌تونه یه عبارت نسبی و انسانی مثل «۲ روز پیش» باشه (که برای خوندن سریع راحت‌تره)، در حالی که datetime همچنان تاریخ دقیق و مطلق رو نگه می‌داره؛ این ترکیب هم برای کاربر خوانا و هم برای ماشین دقیقه.

چرا موتورهای جستجو به این تگ اهمیت می‌دن؟

گوگل و موتورهای جستجوی دیگه، برای خیلی از انواع محتوا (مثل اخبار یا پست‌های وبلاگ)، تاریخ انتشار یا آخرین به‌روزرسانی رو یه فاکتور مهم در نظر می‌گیرن؛ مثلاً ممکنه محتوای جدیدتر رو تو نتایج جستجو اولویت بدن. وقتی این تاریخ با time و datetime مشخص شده باشه، گوگل با اطمینان بیشتری می‌تونه این اطلاعات رو استخراج کنه، به‌جای اینکه مجبور باشه از یه متن آزاد حدس بزنه.

چند اشتباه رایج

  • نوشتن تاریخ فقط به‌صورت متن ساده (بدون تگ time)، که فرصت انتقال معنای ماشین‌خوان رو از دست می‌ده.
  • استفاده از تگ time بدون ویژگی datetime، که باعث می‌شه بخش مهم قابلیت این تگ (ماشین‌خوان بودن) از دست بره.
  • نوشتن مقدار datetime با فرمت اشتباه (مثلاً فرمت شمسی یا فرمت غیراستاندارد روز/ماه/سال).

بهترین روش‌ها

  • همیشه برای تاریخ انتشار مقالات، اخبار، یا کامنت‌ها از time همراه با datetime استفاده کن.
  • مقدار datetime رو همیشه با فرمت استاندارد (YYYY-MM-DD یا YYYY-MM-DDTHH:MM) بنویس.
  • متن قابل‌مشاهده رو می‌تونی به هر فرمتی که برای کاربر راحت‌تره بنویسی (شمسی، نسبی، یا هر شکل دیگه)، چون datetime نسخه‌ی دقیق ماشین‌خوانش رو جدا نگه می‌داره.

نکته‌ی سئو

تگ time همراه با datetime به موتورهای جستجو کمک می‌کند تاریخ دقیق انتشار یا به‌روزرسانی محتوا را استخراج کنند؛ این اطلاعات می‌تواند در نمایش تاریخ کنار نتیجه‌ی جستجو یا در اولویت‌بندی محتوای تازه‌تر مؤثر باشد.

نکته‌ی دسترسی‌پذیری

برخی صفحه‌خوان‌ها و فناوری‌های کمکی می‌توانند از ویژگی datetime برای اعلام دقیق‌تر تاریخ به کاربر استفاده کنند، حتی اگر متن قابل‌مشاهده به شکل غیررسمی یا نسبی نوشته شده باشد (مثل «دیروز» یا «۲ روز پیش»).

جمع‌بندی

تگ time برای نشان‌دادن تاریخ، زمان یا مدت‌زمان استفاده می‌شود و با ویژگی datetime، یک نسخه‌ی استاندارد و ماشین‌خوان از همان مقدار را ارائه می‌دهد. این تفکیک بین متن قابل‌مشاهده (که می‌تواند هر فرمتی داشته باشد) و datetime (که باید استاندارد باشد)، هم به خوانایی برای انسان و هم به فهم دقیق توسط موتورهای جستجو کمک می‌کند.