HTML5 <time> Tag

Introduction to HTML5 <time> Tag

कई बार आपको webpages में ये बताने की आवश्यकता होती है की कोई कार्य किस समय, किस दिन, किस month या year में हुआ। उदाहरण के लिए जब कोई article publish किया जाता है तो उसकी publish date और time show किया जाता है।

HTML5 से पहले ऐसा कोई भी tag नहीं था जिसके द्वारा date और time को markup किया जा सके। इसके लिए दूसरे तरीके जैसे की javascript (date object), microformats और microdata आदि solutions use किये जाते थे।

HTML5 किसी webpage में date और time को markup करने के लिए <time> tag provide करती है। <time> tag Georgian calendar में date और time को represent करता है।

इस tag को introduce करने का प्रमुख उद्देश्य search engines द्वारा किसी web page के time और date सम्बंधित data को आसानी से index करने का है। यदि आप <time> tag को use करते है तो किसी भी प्रकार का search engine crawler आसानी से देख सकता है की किसी article की published date क्या है।

<time> tag से पहले search engine crawlers को ये पता करने के लिए अलग अलग तरीके use करने पड़ते थे। ये एक बहुत ही time consuming और complex task होता था।

<time> tag किसी web page में time show करने के लिए एक machine readable format होता है। जिसे सभी search engines आसानी से समझ सकते है। <time> tag के माध्यम से आप user और machine दोनों के लिए ही date और time को बेहतर तरीके से present कर सकते है।

Syntax of HTML5 <time> Tag

<time> tag का syntax निचे दिया जा रहा है।

<time attribute="value">Text</time>

जैसा की आप ऊपर दिए गए syntax में देख सकते है <time> tag opening और closing tags द्वारा define किया जाता है। <time> tag के साथ 2 attributes available जिनके बारे में आपको आगे बताया जाएगा। <time> tag के opening और closing syntax के बीच आप वह text define करते है जिसे आप mark करना चाहते है।

Attributes of HTML5 <time> Tag

<time> element के साथ 2 attributes available है। इनके बारे में निचे दिया जा रहा है।

datetime

इस attribute के द्वारा आप machine readable format में time define करते है। datetime attribute में date yyyy-mm-dd के format में specify की जाती है। यानी सबसे पहले year, उसके बाद month और आखिर में date define की जाती है। यदि आप day को define नहीं करना चाहते है तो year और month (yyyy-mm) को ही define कर सकते है।

datetime atttribute का उदाहरण निचे दिया जा रहा है।

<html>
<body>

<article>This article show use of HTML5 time tag.</article>

<time datetime="2017-6-8">June 8th 2017</time>

</body>
</html>

ऊपर दिया गया उदाहरण निचे दिया गया output generate करता है।

pubdate

यह attribute बताता है की जो date और time <time> element में define किया गया है वह document का publishing time और date है। यदि इस element के pass कोई article element है तो यह attribute उस article की publishing date को दर्शाता है। इसे निचे उदाहरण द्वारा समझाया जा रहा है।

<html>
<body>

<article>

This is an aritcle.

</article>

Published on : <time datetime="2017-6-8" pubdate>June 8th 2017</time>

</body>
</html>

जैसा की आप ऊपर दिए उदाहरण में देख सकते है datetime attribute द्वारा date define की गयी है। pubdate attribute यँहा पर ऊपर define किये गए article की publication date बताता है। यह उदाहरण निचे दिया गया output generate करता है।

आपको pubdate की value define करने की भी कोई आवश्यकता नहीं होती है। लेकिन फिर भी आप चाहे तो इसे इस प्रकार भी define कर सकते है।

<time datetime="2017-6-8" pubdate="pubdate">June 8th 2017</time>

ये दोनों ही तरीके pubdate attribute define करने के लिए valid होते है।

एक बात आपको हमेशा ध्यान रखनी चाहिए की <time> tag के datetime attribute द्वारा define किया गया समय machine (search engine crawlers) के लिए होता है और opening और closing tags के बीच string के रूप में define किया गया समय user को show होता है।