ใน HTML5 มีแท็ก <time> ซึ่งใช้สำหรับการกำหนดเวลา วันที่ หรือช่วงเวลาต่าง ๆ โดยข้อมูลที่อยู่ใน <time> จะมีโครงสร้างเชิงความหมาย (semantic) ชัดเจนว่ามีการระบุวันที่หรือเวลา ทำให้เครื่องมือค้นหา (search engine) หรือโปรแกรมอื่น ๆ สามารถทำความเข้าใจข้อมูลได้ดีขึ้น
รูปแบบการใช้งานแท็ก <time>
1. ใช้สำหรับระบุวันที่
เราสามารถใช้ <time> เพื่อระบุวันที่ได้ โดยใช้แอตทริบิวต์ datetime เพื่อบอกให้เครื่องมือเข้าใจวันที่นั้น ๆ ในรูปแบบที่มาตรฐาน แต่เราสามารถแสดงวันที่ในรูปแบบที่มนุษย์อ่านได้
ตัวอย่าง
<p>วันเปิดตัวโครงการ: <time datetime="2024-01-15">15 มกราคม 2024</time></p>จากตัวอย่าง
- เครื่องมือค้นหาจะเข้าใจว่าข้อมูลคือวันที่ 15 มกราคม 2024
- ผู้ใช้งานจะเห็นข้อความ “15 มกราคม 2024”
2. ใช้สำหรับระบุเวลา
<time> ยังสามารถใช้ระบุเวลาที่แน่นอนได้
ตัวอย่าง
<p>เวลาเริ่มงาน: <time datetime="13:30">13:30 น.</time></p>จากตัวอย่าง
datetime="13:30"คือเวลาที่สามารถเข้าใจได้โดยโปรแกรมหรือเครื่องมือค้นหา- ผู้ใช้จะเห็น “13:30 น.”
3. ใช้สำหรับระบุช่วงเวลา
เราสามารถใช้ <time> เพื่อระบุช่วงเวลาได้ โดยกำหนดเวลาที่เริ่มต้นและสิ้นสุด
ตัวอย่าง
<p>ระยะเวลาโปรโมชัน: <time datetime="2024-01-01">1 มกราคม 2024</time> ถึง <time datetime="2024-01-31">31 มกราคม 2024</time></p>จากตัวอย่าง
- วันที่เริ่มต้นและสิ้นสุดระบุในแอตทริบิวต์
datetimeเพื่อให้เข้าใจได้ชัดเจน
4. ใช้สำหรับระบุช่วงเวลาที่คำนวณได้
สามารถใช้แท็ก <time> ในการระบุช่วงเวลาที่วัดได้ เช่น ระยะเวลาในการทำงานของเครื่องยนต์ หรือการประมวลผล
ตัวอย่าง
<p>เวลาในการวิ่งมาราธอน: <time datetime="PT2H30M">2 ชั่วโมง 30 นาที</time></p>จากตัวอย่าง
datetime="PT2H30M"ใช้รูปแบบ ISO 8601 สำหรับระยะเวลา ซึ่งบอกว่าเวลาเป็น 2 ชั่วโมง 30 นาที
สรุป
แท็ก <time> ใน HTML5 เป็นวิธีที่ดีในการระบุวันที่และเวลาในหน้าเว็บ ให้ทั้งมนุษย์อ่านได้และเครื่องมือค้นหาเข้าใจได้