عناصر (elements) در HTML5


New Elements in HTML5

از زمانی که HTML4.01 در سال 1999 استاندارد سازی شد اینترنت با تغییرات زیادی روبرو گشت.

امروزه برخی از عناصر HTML4.01 منسوخ شده و دیگر استفاده نمی شوند شاید یکی از دلایلش این باشد که هرگز کاربردی نداشته اند، این عناصر در نسخه جدید یعنی HTML5 حذف گشته یا بازنویسی شده اند.
امروزه به جهت استفاده بهتر از اینترنت عناصر جدیدی به همراه HTML5 افزوده شده که ساختاری جذاب و بهتر را پدید آورده است، امکانات طراحی، رسانه ای و محتوی فرم ها به طرز چشمگیری دچار دگرگونی شده و باعث حذف کدهای اضافه و افزایش بارگذاری صفحات شده اند.



عناصر markup جدید:

عناصر جدید برای ساختار بهتر :

Tag Description
<article> برای محتواهای خارجی مثل متن از مقالات خبری، وبلاگ، تالارگفتگو و با هر محتوای دیگری از منابع خارجی
<aside> برای محتواهای کنار گذاشته شده از محتویاتی که قرار گرفته است. محتواهای کنار گذاشته شده باید مرتبط با محتویات اطراف خودش باشد
<command> یک دکمه و یا دکمه رادیویی و یا یک چک باکس
<details> برای توضیح جزئیات یک صفحه یا بخشی از یک صفحه
<summary> یک عنوان یا خلاصه در داخل عنصر  details به کار می رود
<figure> برای گروه بندی یک محتوای مستقل که می تواند یک ویدیو باشد
<figcaption> عنوان بخش figure را با آن مشخص می کنند
<footer> برای بخش footer صفحه یا یک بخش که می تواند شامل نام نویسنده، تاریخ ایجاد صفحه، اطلاعات تماس و یا اطلاعات حق کپی رایت باشد
<header> برای معرفی یک صفحه یا یک بخش که می تواند شامل navigation (منوی راهوری) هم باشد
<hgroup> برای تیتر یک بخش از <h1> تا <h6> می توان استفاده کرد که بزرگترین آنه به عنوان تیتر اصلی بخش و بقیه به عنوان زیر تیتر بخش استفاده می شوند
<mark>  برای متن هایی که باید مشخص تر (highlight) باشند
<meter>  برای اندازه گیری، فقط زمانی استفاده می شود که مقادیر ماکزیمم و مینیمم مشخص باشد
<nav> برای بخش navigation به کار می رود.
<progress> حالت کاری که در حال پیشرفت است
<ruby> برای تفسیر کاراکترهای و یا متن های چینی
<section> برای بخشی از یک سند مثلا فصل ها، هدرها، فوترها و هر بخش دیگری از صفحه
<time> برای تعریف یک ساعت یا تاریخ و یا هر دو
<wbr> شکست کلمه.  می توان با آن خط جدید (line-break) را تعریف کرد.




عناصر چندرسانه ای جدید

HTML5 استانداردهای جدیدی را برای بخش رسانه فراهم کرده است:

Tag Description
<audio> برای صداها، موزیک ها و هر فایل چندرسانه ای صوتی
<video> برای ویدیوکلیپ ها و هر فایل ویدیویی دیگر
<source> برای منبع عناصر مدیا که در داخل تگ های video و audio تعریف میشود
<embed> برای محتویات جاسازی شده (embed) مثل پلاگین ها




عنصر Convas ساخت تصاویر

عنصر canvas با استفاده از جاوا اسکریپت برای کشیدن طرح به کار می رود.

Tag Description
<canvas> برای ساخت تصاویر با یک اسکریپت




عناصر فرم جدید

HTML5 در رابطه با فرم عناصر زیادی را به همراه قابلیت های زیاد ارائه می کند:

Tag Description
<datalist> لیستی از خصوصیتهای اختیاری برای مقادیر ورودی
<keygen> کدهایی برای شناسایی کاربران ایجاد می کند
<output> برای انواع متفاوتی از خروجی مثل خروجی های نوشته شده توسط یک اسکریپت




مقادیر صفت نوع ورودی جدید

خصوصیت نوع عنصر input ، مقادیر جدیدی برای کنترل بهتر دریافت ورودی از کاربر قبل از ارسال آن به سرور در اختیار قرار داده است:

Type Description
tel مقدار وروردی از نوع شماره تلفن
search مقدار ورودی از نوع فیلد جستجو
url مقدار ورودی از نوع یک آدرس وب
email مقدار ورودی از نوع یک یا چند آدرس ایمیل
datetime مقدار ورودی از نوع زمان و/یا تاریخ
date مقدار ورودی از نوع تاریخ
month مقدار ورودی از نوع ماه
week مقدار ورودی از نوع هفته
time مقدار ورودی از نوع زمان
datetime-local مدار ورودی از نوع زمان/تاریخ محلی
number مقدار ورودی از نوع عدد
range مقدار ورودی از نوع عددی در رنج داده شده
color مقدار ورودی از نوع کد هگزادسیمال یک رنگ مثل #FF8800