ایچ ٹی ایم ایل فائیو میں متعارف کرائے گئے نئے ایلی منٹس

HTML5 ویب پیجز بنانے کے لیے استعمال کی جانے والی HTML لینگویج کا نیا معیار ہے۔ ورلڈ وائیڈ ویب کے آغاز سے لے کر اب تک HTML مارک اپ لینگویج کے متعدد ورژنز متعارف کرائے گئے ہیں جن میں حالات کی ضرورت کے مطابق تبدیلیاں کی گئیں۔ اس ٹٹوریل میں حالیہ ورژن HTML5 میں نئے شامل کیے جانے والے ایلیمنٹس، اور پرانے ختم کیے جانے والے ایلیمنٹس کی فہرست پیش کی جا رہی ہے۔ یہ فہرست اور اس کی زیادہ تر وضاحت W3Schools کی ویب سائیٹ سے لی گئی ہے، جبکہ ایلیمنٹس کی نوعیت کے اعتبار سے ان کی ترتیب بدلی گئی ہے۔ آئیں یہ ایلیمنٹس اور ان کا مختصر تعارف دیکھتے ہیں۔

1. ویب پیج کے ڈھانچے (Structure) کے لیے استعمال کیے جانے والے ایلیمنٹس
2. ویب پیج کے مواد (Content) کے لیے استعمال کیے جانے والے ایلیمنٹس
3. میڈیا ایلیمنٹس
4. فارم ایلیمنٹس
5. ڈرائنگ ایلیمنٹ
6. HTML5 سے ختم کیے جانے والے ایلیمنٹس

1- ویب پیج کے ڈھانچے (Structure) کے لیے استعمال کیے جانے والے ایلیمنٹس

<footer> ، <main> ، <header>

دستیابی: یہ ایلیمنٹس انٹرنیٹ ایکسپلورر 9+، فائرفاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہیں۔

ان ایلیمنٹس کا عمومی مقصد یہ ہے کہ

• header ایلیمنٹ میں ویب سائیٹ کا نام اور مونوگرام وغیرہ رکھے جائیں،
• main ایلیمنٹ میں ویب پیج کا مرکزی مواد یعنی پوسٹ یا مضمون رکھا جائے، یا پھر کیٹیگری پیج ہونے کی صورت میں پوسٹس یا مضامین کی فہرست رکھی جائے،
• footer ایلیمنٹ میں کاپی رائیٹ کی عبارت اور اس نوعیت کی چیزیں رکھی جائیں۔

لیکن header اور footer ایلیمنٹس کا استعمال صرف مکمل ویب پیج تک محدود نہیں ہے بلکہ ویب پیج کے کسی بھی حصے کے اپنے ہیڈر اور فوٹر ہو سکتے ہیں۔ مثلاً‌ article ایلیمنٹ کے اندر یہ دونوں ایلیمنٹس رکھے جا سکتے ہیں۔ اس صورت میں header ایلیمنٹ میں مضمون نگار کی معلومات رکھی جا سکتی ہیں، اور footer ایلیمنٹ میں مضمون کے متعلق کیٹیگریز اور ٹیگز وغیرہ رکھے جا سکتے ہیں۔
جبکہ main ایلیمنٹ ویب پیج میں ایک سے زیادہ مرتبہ استعمال نہیں کیا جا سکتا۔ اس کا مقصد یہ ہے کہ روبوٹ ایپلی کیشنز اور سرچ انجنز وغیرہ اگر ویب پیج کا مرکزی مواد حاصل کرنا چاہیں جو اس صفحہ پر ویب سائیٹ کے باقی صفحات سے منفرد ہے، تو ویب پیج کے باقی حصوں کو بالکل نظر انداز کرتے ہوئے صرف main ایلیمنٹ کا مواد لیا جا سکے۔ اور ڈیویلپرز کو یہ ہدایت کی گئی ہے کہ وہ main ایلیمنٹ کو کسی دوسرے ایلیمنٹ مثلاً‌ footer, article, section وغیرہ کے ذیلی ایلیمنٹ کے طور پر استعمال نہ کریں۔

یاد رہے کہ header ایلیمنٹ head ایلیمنٹ سے مختلف ہے۔ head ایلیمنٹ body ایلیمنٹ سے اوپر اور پہلے موجود ہوتا ہے جس کے ذریعے براؤزر کے لیے ویب پیج کا ٹائٹل مقرر کیا جاتا ہے، ویب پیج کے لیے کریکٹر سیٹ وغیرہ ڈیفائن کیا جاتا ہے، اور ویب پیج میں اسٹائل شیٹ فائلز اور جاوا اسکرپٹ فائلز شامل کی جاتی ہیں۔ جبکہ header ایلیمنٹ ویب پیج کے body ایلیمنٹ کے اندر رکھا جاتا ہے اور اس کے اندر وہ مواد رکھا جاتا ہے جو صارفین براؤزر میں دیکھ سکتے ہیں۔

<nav>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائر فاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہے۔

nav ایلیمنٹ کا مقصد یہ ہے کہ اس کی مدد سے ویب سائیٹ کا مرکزی مینیو یا اس کے ذیلی مینیوز بنائے جائیں۔ لیکن یہ ایلیمنٹ انفرادی لنکس کے لیے استعمال نہیں کیا جانا چاہیے، بلکہ صرف لنکس کا مجموعہ یعنی مینیو اس ایلیمنٹ کے اندر رکھا جانا چاہیے۔

<section>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائرفاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہیں۔

section ایلیمنٹ کی مدد سے ویب پیج میں مختلف قسم کے مواد مختلف حصوں میں رکھے جا سکتے ہیں۔ مثلاً‌ مضامین کی فہرست ایک سیکشن میں رکھی جا سکتی ہے، جبکہ ایڈورٹائزمنٹس وغیرہ الگ سیکشن میں رکھی جا سکتی ہے۔

<article>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائر فاکس، اوپرا، کروم اور سفاری ویب براؤزرز کے لیے استعمال کیا جاتا ہے۔

article ایلیمنٹ کسی بھی قسم کے مکمل متن کے لیے استعمال کیا جاتا ہے، مثلاً‌ بلاگ پوسٹ، نیوز اسٹوری، کامنٹ وغیرہ۔ ویب پیج میں ایک سے زیادہ article ایلیمنٹس موجود ہو سکتے ہیں، مثلاً‌ جب مضامین کی ایسی فہرست دکھانا مقصود ہو جس میں ہر عنوان کے ساتھ مضمون کا ایک مختصر حصہ دکھایا گیا ہو۔

<aside>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائر فاکس، اوپرا، کروم اور سفاری ویب براؤزرز کے لیے استعمال کیا جاتا ہے۔

aside ایلیمنٹ کو اگر article ایلیمنٹ کے اندر استعمال کیا جائے تو اس کا مواد اس مضمون کا ضمنی مواد شمار ہوگا۔ لیکن اگر یہ ویسے ہی ویب پیج میں کسی جگہ استعمال کیا جائے تو اس میں موجود مواد کی حیثیت ثانوی ہوگی، یعنی اسے ویب پیج کا مرکزی مواد شمار نہیں کیا جائے گا، لیکن یہ مواد کسی نہ کسی حوالے سے ویب پیج کے مرکزی مواد سے متعلقہ ہونا چاہیے۔

2- ویب پیج کے مواد (Content) کے لیے استعمال کیے جانے والے ایلیمنٹس

<details> اور <summary>

دستیابی: یہ ایلیمنٹس فی الوقت صرف اوپرا، کروم اور سفاری 6 براؤزرز میں دستیاب ہیں۔

details ایلیمنٹ اور summary ایلیمنٹ اکٹھے استعمال کیے جاتے ہیں۔ summary ایلیمنٹ کو details ایلیمنٹ کے اندر رکھا جاتا ہے تاکہ کچھ معلومات صارف کو دکھا دی جائیں۔ جبکہ آئی کان پر کلک کرنے سے details ایلیمنٹ میں موجود تمام معلومات ظاہر ہو جاتی ہیں۔

<wbr>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر کے علاوہ تمام بڑے براؤزرز میں دستیاب ہے۔

اگر عبارت میں کوئی بہت لمبا لفظ ہو جس کے بارے میں خدشہ ہو کہ اگر یہ لائن کے آخر میں آیا تو براؤزر اسے درست طریقے سے دکھا نہیں سکے گا، تو پھر ایسے لفظ کے شروع میں wbr ایلیمنٹ استعمال کیا جا سکتا ہے۔ تاکہ اگر ضروری ہو تو براؤزر یہاں لائن توڑ (Line-break) کر اس لمبے لفظ سمیت باقی مواد اگلی لائن میں دکھا دے۔

<figure> اور <figcaption>

دستیابی: یہ ایلیمنٹس انٹرنیٹ ایکسپلورر 9+، فائرفاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہیں۔

figure ایلیمنٹ کی مدد سے تصویر، چارٹ، ڈائیگرام اور کوڈ وغیرہ ڈیفائن کیا جا سکتا ہے، جبکہ figurecaption کی مدد سے اس فگر کا عنوان مقرر کیا جا سکتا ہے۔

<mark>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائرفاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہیں۔

mark ایلیمنٹ عبارت کے کسی حصے کو نمایاں طور پر یعنی Highlighter کی صورت میں دکھانے کے لیے استعمال کیا جا سکتا ہے۔

<bdi>

دستیابی: یہ ایلیمنٹ صرف فائر فاکس اور کروم براؤزرز میں دستیاب ہے۔

bdi یعنی Bi-direction isolation ایلیمنٹ ایسے مواد کے لیے استعمال کیا جا سکتا ہے جس کی ڈائریکشن معلوم نہ ہو۔ مثلاً‌ صارف کی طرف سے بھیجے جانے والے فارم میں اردو مواد بھی ہو سکتا ہے اور انگلش بھی۔ ایسا مواد bdi ایلیمنٹ میں دکھایا جا سکتا ہے۔

<dialog>

دستیابی: یہ ایلیمنٹ صرف کروم کینیری اور سفاری 6 براؤزرز میں دستیاب ہیں۔

dialog ایلیمنٹ کے ذریعے ویب پیج میں ڈائیلاگ باکس دکھایا جا سکتا ہے۔

<menu> اور <menuitem>

دستیابی: یہ ایلیمنٹس فی الوقت صرف فائر فاکس براؤزر میں دستیاب ہے۔

menu ایلیمنٹ کے ذریعے ویب ایپلی کیشن کے لیے مینیو ڈیفائن کیا جا سکتا ہے، اور menuitem ایلیمنٹ استعمال کرتے ہوئے اس مینیو کے لیے آپشنز مہیا کیے جا سکتے ہیں۔
لیکن اس menu ایلیمنٹ کا مقصد ویب سائیٹ کا مینیو ڈیفائن کرنا نہیں ہے، بلکہ اس کا مقصد جاوا اسکرپٹ کوڈ استعمال کرتے ہوئے ویب ایپلی کیشن کے لیے مینیو بنانا ہے۔ جبکہ ویب سائیٹ کا مینیو بنانے کے لیے nav ایلیمنٹ استعمال کیا جاتا ہے جس میں a ایلیمنٹس کی مدد سے دیگر ویب پیجز کے لنکس فراہم کیے جاتے ہیں۔

<meter>

دستیابی: یہ ایلیمنٹ فائر فاکس، اوپرا، کروم اور سفاری 6 براؤزرز میں دستیاب ہے۔

meter ایلیمنٹ کی مدد سے ایک میٹر دکھایا جا سکتا ہے، یعنی ویلیوز کی رینج متعین کر کے یہ بتایا جا سکتا ہے کہ مطلوبہ خانہ کتنا بھرا ہوا ہے۔

<progress>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 10+، فائر فاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہے۔

progress ایلیمنٹ کو جاوا اسکرپٹ کے ساتھ استعمال کرتے ہوئے ویب پیج میں ہونے والے کسی عمل کی پراگریس دکھائی جا سکتی ہے۔

<rp> ، <rt> ، <ruby>

دستیابی: یہ ایلیمنٹس انٹرنیٹ ایکسپلورر 10+، فائر فاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہے۔

ruby ایلیمنٹ کی مدد سے مشرقی ایشیائی زبانوں کے رموز و اوقاف (Punctuation) دکھائے جا سکتے ہیں۔ rt اور rp ایلیمنٹس ruby ایلیمنٹ کے اندر استعمال کیے جاتے ہیں۔ rt ایلیمنٹ کی مدد سے وقف کی وضاحت کی جاتی ہے، جبکہ rp ایلیمنٹ کی مدد سے یہ بتایا جاتا ہے کہ اگر براؤزر اس وقف کو سپورٹ نہ کرتا ہو تو اسے کیا دکھانا چاہیے۔

<time>

time ایلیمنٹ کی مدد سے ویب پیج میں وقت بتایا جا سکتا ہے۔ براؤزرز اس ایلیمنٹ کو کسی خاص طریقے سے نہیں دکھاتے، لیکن اس ایلیمنٹ کی مدد سے ایپلی کیشنز ویب پیج کو Parse کرتے وقت کسی واقعے کا وقت معلوم کر سکتی ہیں۔

3- میڈیا ایلیمنٹس

<audio>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائر فاکس، اوپرا، کروم اور سفاری براؤزرز پر دستیاب ہے۔

audio ایلیمنٹ کی مدد سے ویب پیج میں مختلف فارمیٹس کی آڈیو فائلز شامل کی جا سکتی ہیں۔

<video>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائر فاکس، اوپرا، کروم اور سفاری براؤزرز پر دستیاب ہے۔

video ایلیمنٹ کی مدد سے ویب پیج میں مختلف فارمیٹس کی ویڈیو فائلز شامل کی جا سکتی ہیں۔

<source>

source ایلیمنٹ کی مدد سے آڈیو یا ویڈیو ایلیمنٹ کے لیے فائل کا پاتھ بتایا جاتا ہے۔

<track>

track ایلیمنٹ کی مدد سے آڈیو یا ویڈیو کے ٹریکس بنائے جا سکتے ہیں۔

<embed>

دستیابی: یہ ایلیمنٹ تمام بڑے براؤزرز میں دستیاب ہے۔

embed ایلیمنٹ کی مدد سے مختلف میڈیا فائلز مثلاً‌ فلیش وغیرہ ویب پیج میں شامل کیے جا سکتے ہیں۔ یہ ایلیمنٹ اگرچہ HTML 4 میں شامل نہیں تھا لیکن اکثر براؤزرز اسے سپورٹ کرتے چلے آرہے ہیں۔ لیکن HTML5 میں اسے باقاعدہ شامل کر لیا گیا ہے۔

4- فارم ایلیمنٹس

<datalist>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9 اور اس سے پہلے ورژنز، اور سفاری براؤزر پر دستیاب نہیں ہے۔

datalist در اصل input اور select دونوں کا مجموعہ ہے۔ یعنی اس میں نئی ویلیو بھی لکھی جا سکتی ہے، اور اس کے ڈراپ ڈاؤن میں پہلے سے موجود کوئی ویلیو بھی سلیکٹ کی جا سکتی ہے۔

<keygen>

دستیابی: یہ ایلیمنٹ فائر فاکس، کروم، اوپرا اور سفاری 6 براؤزرز میں دستیاب ہے۔

keygen ایلیمنٹ کی مدد سے ویب فارم کے لیے key-pair فیلڈ ڈیفائن کی جا سکتی ہے۔ جب فارم سرور کی طرف بھیجا جاتا ہے تو Private key مقامی ڈیوائس پر جبکہ Public key ویب سرور کی طرف بھیجی جاتی ہے۔

<output>

دستیابی: یہ ایلیمنٹ فائر فاکس، اوپرا، کروم اور سفاری براؤزرز میں دستیاب ہے۔

output ایلیمنٹ کیلکولیشن کا نتیجہ دکھانے کے لیے استعمال کیا جاتا ہے۔

5- ڈرائنگ ایلیمنٹ

<canvas>

دستیابی: یہ ایلیمنٹ انٹرنیٹ ایکسپلورر 9+، فائر فاکس، اوپرا، کروم اور سفاری براؤزرز پر دستیاب ہے۔

canvas ایلیمنٹ کی مدد سے ویب پیج میں ڈرائنگز مثلاً‌ لائن، دائرہ اور ڈبہ وغیرہ بنائے جا سکتے ہیں۔

6- HTML5 سے ختم کیے جانے والے ایلیمنٹس

درج ذیل ان ایلیمنٹس کی فہرست موجود ہے جو HTML کے گزشتہ مختلف ورژنز میں موجود تھے لیکن انہیں HTML5 میں شامل نہیں کیا گیا۔ لیکن اس کا مطلب یہ نہیں ہے کہ اگر آپ نے ان میں سے کوئی ایلیمنٹ اپنے ویب پیج میں استعمال کیا ہے تو وہ براؤزر میں کام نہیں کرے گا۔ چونکہ انٹرنیٹ پر ایسے بے شمار پرانے ویب پیجز موجود ہیں جن میں HTML کے پرانے ورژنز کے مطابق کوڈ لکھا گیا ہے، اس لیے براؤزرز کے لیے ضروری ہے کہ انہیں سپورٹ کریں۔ HTML کے نئے ورژن میں سے ان ایلیمنٹس کے ختم کرنے کا مقصد یہ ہے کہ ڈیویلپر آئندہ یہ ایلیمنٹس استعمال نہ کریں، تاکہ وقت گزرنے کے ساتھ ساتھ یہ متروک ہو جائیں۔

<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<frameset>
<noframes>
<strike>
<tt>