راهنمای به کارگیری از تگ‌های معنایی در HTML5

Semantic tags in HTML5 guide

راهنمای به کار گیری از عناصر معنایی در HTML5

شیوه تعریف‌و‌تمجید تگ‌های معنایی یا Semantic در HTML5:

طراحی سایت در مشهد
تگ‌های غیرمعنایی (Non-Semantic Tags):
اغلب تگ های HTML به مراد جای دادن محتوا در خود تعریف و تمجید می شوند و به مرورگر می گویند محتوای صفحه ها وب را چطور نمایش دهند. این تگ ها، سیرتکامل محتوای باطن خود را مشخص نمی کنند و نمی گویند هر محتوا چه نقشی (Role) در صفحات تارنما دارد.

تگ‌های غیر معنایی div و span:
تگ های کلاسیک div و span غیر معنایی (non-semantic) می باشند و هیچ گونه اطلاعاتی در خصوص جور محتوای داخل خود و نقش آن محتوا در صفحه وب را ارائه نمی دهند.

تگ‌های غیر معنایی div و span

تگ‌های معنایی (Semantic Tags):
در اچ‌تی‌ام‌ال ۵ معنایی (Semantic HTML5) تگ هایی موجود هست که برای مرورگر مشخص می‌نماید که هر محتوایی که در‌این تگ ها موجود است از چه نوعی هستند و چه نقشی در صفحه وبسایت داراست. تگ های معنایی html5 (Semantic Tags) صراحتا برای بات ها و خزنده های گوگل و بینگ مشخص میکند که کدام محتوای واقع در کاغذ از اهمیت بیشتری شامل است، کدامیک برای navigation هست، کدامیک جانبی می باشند و غیره…

به این ترتیب با افزودن تگ های معنایی HTML5 به صفحه ها تارنما خود، اطلاعات اضافی به محتوای تارنما اضافه خواهد شد که به موتورهای جستجوی گوگل و بینگ قابلیت و امکان تشخیص جور محتوا و نیز رتبه اهمیت و حق اولویت محتواهای صفحات وب را میدهد.

تگ‌های معنایی Header, Footer, Nav, Article:
تگ‌های معنایی Header, Footer, Nav, Article

تگ های معنایی HTML5 مانند تگ های تصویر فوق، بطور معین گونه محتوای خود و نیز نقش آن را به مرورگر اعلام می کنند.

لزوم به کار گیری از تگ های معنایی HTML5:
برای کاربرانی که از نعمت بینایی منفعت مند هستند، تشخیص بخش های متفاوت یک سایت (مانند منو، هدر، محتوای اصلی و فوتر) معمولی است و قادرند در یک نگاه تمام المان ها را تشخیص دهند البته فرض نمایید کاربری نابینا وارد یک تارنما شود.