13 تگ جدید HTML5

HTML5از ابتدا تا کنون زبان اچ تا ام ال دچار تغییرات زیادی شده است. حال که آخرین ورژن موجود HTML5 است، به بررسی HTML5 میپردازیم و تگ های جدید اچ تی ام ال افزوده شده در این ورژن را معرفی میکنیم.برای دیدن آموزش ویدیویی و کامل آموزش html رو در سایت آموزش تک مشاهده کنید. تگ <canvas>از این تگ جهت ترسیم اشیا گرافیکی استفاده می شود.نکته: تگ معرفی شده صرفا نگه دارنده گرافیکی است نه مناسب ترسیم، همانطور که میدانید اکثر کارهای گرافیکی و ترسیم مربوط به java script می باشد و به وسیله آن ترسیم میشود.<canvas id="newcanvas"></canvas><script>var canvas=document.getElementById('newcanvas');var ctx=canvas.getContext('2d');ctx.fillStyle='#FF0000'ctx.fillRect(0,0,80,100);</script>درواقع می توان گفت canvas برای تکمیل شدن، نیاز به کدهای java script دارد.تگ <audio><audio controls><source src="sound.ogg" type="audio/ogg"><source src="sound.mp3" type="audio/mpeg">Your browser does not support the audio tag.</audio>این تگ برای پخش صوت و موسیقی کاربرد دارد.فرمت هایی که این تگ پشتیبانی میکنند عبارت است از:· Wav· Mp3· Oggتگ <embed>از این تگ برای موارد خارجی استفاده میشود. به عنوان مثال: ایجاد فایل فلش با استفاده از کد زیر:<embed src="helloworld.swf">تگ <article>برای نمایش بخش های مهم مطالب خود از این تگ استفاده نمایید.<article> tag article </article>تگ <bdi>مناسب برای نمایش بخش هایی از مطلب که متفاوت تر از بقیه است.<bdi> tag aside </bdi>تگ <details><details><summary>Copyright 1999-2014.</summary><p> - by Refsnes Data. All Rights Reserved. </p><p>All content and graphics on this web site are the property of the company Refsnes Data. </p></details>از این تگ برای نمایش جزئیات(توضیحات بیشتر) استفاده میشود.تگ <dialog>از این تگ برای ایجاد کادر محاوره ای جدا استفاده میشود.(نقل قول)<dialog open> tag dialog </dialog>تگ<figcaption>مناسب برای نوشتن عنوان در زیر عکس<figcaption> tag figcaption </figcaption> تگ <footer>این تگ مناسب بخش پایانی هر صفحه است که در آخر صفحه استفاده میشود، اما باید حتما دقت شود که در هر صفحه نباید بیشتر از یکبار استفاده شود.<footer> tag footer </footer>تگ <header>این تگ مناسب بخش بالایی هر صفحه است که در اول صفحه استفاده میشود، اما باید حتما دقت شود که در هر صفحه همانند تگ فوتر نباید بیشتر از یکبار استفاده شود.<header> tag header </header>تگ <main>از این تگ برای مشخص کردن کل محتوای اصلی هر صفحه استفاده میشود، اما باید حتما دقت شود که در هر صفحه همانند تگ فوتر و هدر نباید بیشتر از یکبار استفاده شود.<main> tag main </main>تگ <track>از این تگ برای مشخص کردن زیرنویس فیلم ها استفاده میشود، بطورکلی فایل های زیرنویس یا هر فایل دیگری شامل متن در آهنگ و ویدئو کاربرد دارد.<video width="320" height="240" controls><source src="orange.mp4" type="video/mp4>"<source src="orange.ogg" type="video/ogg"><track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English"><track src="subtitles_fa.vtt" kind="subtitles" srclang="fa" label="farsi"></video>تگ <video>مناسب برای نمایش و اجرای فایل های تصویری، این تگ از پسوند های WebM، MP4، Ogg پشتیبانی میکند.<video width="320" height="240" controls><source src="movie.mp4" type="video/mp4"><source src="movie.ogg" type="video/ogg">Your browser does not support the video tag.</video>برخی تگ های جدید افزوده شده در HTML5 را معرفی و توضیح دادیم.توجه داشته باشید که این تگ ها قبل از HTML5 وجود نداشتند به همین خاطر بعضی از این تگ هارا برخی ورژن های قدیمی مرورگر ها پشتیبانی نمیکنند.و همچنین توجه داشته باشید که این13 تگ نام برده شده تمامی تگ های افزوده شده در HTML5 نیستند.