وبلاگ

آموزش انتخاب اصولی تگ های HTML5 در المنتور

آموزش انتخاب اصولی تگ های HTML5 در المنتور

در این آموزش یاد می گیرید که چگونه تگ های معنایی html5 را در طراحی های خود در افزونه المنتور انتخاب کنیم. چون هر طراحی که انجام می‌دهیم باید این تگ ها را در افزونه المنتور انتخاب کنید و برای همین من این آموزش رو برای شما تهیه کردم تا به انتخاب تگ های اصولی در المنتور بپردازید.

[irinfobox]وقتی می خواهید در یک طراحی قالب با html و css یک قالب را طراحی کنید، باید تگ های معنایی را به درستی انتخاب کنید و در جای اصولی قرار دهید. در المنتور هم به این شکل هست و باید تگ هایی را برای بخش های خود انتخاب کنید.[/irinfobox]

منظور از تگ ها یا انتخاب تگ ها چیه؟

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

به طور مثال شما می توانید به موتورهای جستجو هدر، فوتر، سایدبار و با بخش مقالات سایت خود را در یک ساختار کامل نشان دهید.

تگ های html5
تگ های html5

آیا المنتور به صورت خودکار همه تگ ها را انتخاب می کند؟

وقت شما با استفاده از پوسته ساز المنتور اقدام به ساخت پوسته و یا قالب می کنید و یک هدر و فوتر برای سایت خود ایجاد می کنید، افزونه به صورت خودکار و به صورت کاملا اتوماتیک همه تگ های مربوطه برای هدر و فوتر سایت را در بخش مورد نظر قرار می‌دهد و اصلاً نیازی نیست که شما این تگ ها را انتخاب کنید. اما برای طراحی صفحات مختلف حتما باید تگ بندی های اصولی را در المنتور انتخاب کنید.

انتخاب تگ های html در المنتور
انتخاب تگ های html در المنتور

منظور از تگ های معنایی چیه؟

همانطور که از اسم این تگ ها پیداست معنایی به ساختار سایت شما می دهد و توسط این ساختار معنایی موتورهای جستجو این ساختار را پیدا کنند و به راحتی می توانند سایت را آنالیز کنند. برای همین منظور در زیر توضیح کاملی درباره این تگ ها برای شما آماده کرده ایم :

  • div : یک تگ غیر معنایی برای اجزا بندی صفحات است و اصولا این تگ در داخل تگ section قرار می گیرد و می توان به بخش بندی صفحه پرداخت.
  • header : این تگ برای بخش هدر سایت است و البته از این تگ برای عناوین و سربرگ ها هم استفاده می شود. به طور مثال برای عناوین ویجت ها و یا ابزارک ها از این تگ استفاده می شود.
  • footer : این تگ برای مشخص کردن فوتر سایت به کار می رود و خود المنتور به صورت اتوماتیک این تگ برای برای فوتر سایت قرار می دهد.
  • main : این تگ برای مشخص کردن بخش اصلی و یا ناحیه اصلی صفحه و سایت مورد استفاده قرار می گیرد. اصولا این تگ داخل تگ body قرار می گیرد.
  • article : این تگ هم برای مشخص کردن بخش مقالات استفاده می شود. و خود المنتور این تگ را انتخاب می کند برای ویجت پست ها.
  • section : برای بخش بندی صفحه به کار می رود ولی بعد از تگ main اولویت دارد و می توانید برای هر صفحه از این تگ استفاده کنید.
  • aside : این تگ برای مشخص کردن ناحیه سمت راست و یا چپ سایت استفاده می شود. به طور مثال می توانید برای بخش سایدبار سایت از این تگ استفاده کنید.
  • nav : این هم برای ناوبار سایت و یا منوی سایت مورد استفاده قرار میگیرد و می توان داخل تگ هایی همانند footer، header و یا aside مورد استفاده قرار بگیرد.(لینک های منو را مشخص می کند)

نحوه انتخاب تگ های HTML در المنتور

اما چگونه این تگ های را برای بخش های خود در المنتور انتخاب کنیم؟ برای این کار ابتداردر صفحه ساز المنتور و در ویرایشگر صفحه، وقتی یک سکشن و یا بخش داخلی در المنتور ایجاد می کنید در سمت راست صفحه، برای شما تنظیماتی نمایش داده می شود که همانند شکل زیر هست :

تنظیمات تگ های معنایی در المنتور
تنظیمات تگ های معنایی در المنتور

در بخش “تگ HTML” می توانید تگ مورد نظر خود را برای بخش خود انتخاب کنید.

[irnot title=”توجه کنید”]این تگ های برای بخش و عناوین فرق می کند و در ویدئوی آموزش به آموزش تگ های عناوین هم پرداخته ایم و توصیه می کنیم حتما فیلم آموزشی را ببینید. [/irnot]

فیلم آموزشی

https://www.youtube.com/watch?v=tl4k-OLlkeM
4/5 - (1 امتیاز)
اشتراک گذاری:

مطالب زیر را حتما مطالعه کنید

2 دیدگاه

به گفتگوی ما بپیوندید و دیدگاه خود را با ما در میان بگذارید.

دیدگاهتان را بنویسید

در خدمت شما هستیم!

در صورت نیاز به مشاوره می توانید فرم را تکمیل نمایید و یا با ما در ارتباط باشید.