تگ های مربوط به لایه بندی صفحات در html

تگ های مربوط به لایه بندی صفحات در html

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

  • لایه بندی و بخش بندی صفحات وب یکی از حساس ترین قسمت های طراحی یک صفحه وب است.
  • به بخش های مختلف هر صفحه وب ، یک لایه یا Layout گفته می شود. مانند بخش هدر صفحه که می تواند شامل منوها و لوگو و غیره باشد. یا بخش سایدبار صفحه که می تواند شامل مباحث مهم و تبلیغات و غیره باشد.
  • در گذشته طراحان وب سایت ، با استفاده تگی مثل تگ table به ایجاد لایه ها می پرداختند که این کار امروزه از نظر موتورهای جستجو یعنی مرگ رتبه یا SEO سایت شما.
  • بعدها بحث لایه بندی با استفاده از تگ div و همچنین دستورات css مانند دستور float انجام میشد. البته این بحث امروز هم انجام میپذیرد اما برای داشتن یک سایت خوب ، کافی نیست.
  • در html5 تگ های اختصاصی لایه بندی صفحه ایجاد شدند که مهم ترین مزیت آنها نسبت به تگی مثل تگ div ، معناگرایانه بودن یا Semantic بود آنها می باشد.
  • همچنین استفاده از این تگ ها می تواند باعث بهبود عالی رتبه سایت شما شود.

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

آموزش تگ های مربوط به لایه بندی صفحات در html

بخش اول – آشنایی با لایه بندی صفحات وب و روش های آن

  • لایه بندی یا Layout صفحه وب چیست؟
  • روش های مختلف لایه بندی صفحات وب کدامند؟
  • تشریح تکنیک لایه بندی صفحات وب با تگ table و ضعف آن.
  • تشریح تکنیک لایه بندی صفحات وب با تگ div و ضعف آن.
  • تشریح تکنیک لایه بندی صفحات وب با تگ های پیشرفته لایه بندی
  • معرفی هرکدام از تگ های پیشرفته لایه بندی

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش دوم- تشریح تگ باز و بسته ی <header></header>

  • کاربرد تگ header در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ header در طراحی سایت چیست؟
  • درون تگ header ما از چه تگ ها و محتوایی میتوانیم استفاده کنیم؟
  • تگ header درون چه تگ ها و بخش هایی نمی تواند استفاده شود؟
  • پشتیبانی مرورگرهای مختلف از تگ header چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش سوم – تشریح تگ باز و بسته ی <nav></nav>

  • کاربرد تگ nav در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ nav در طراحی سایت چیست؟
  • درون تگ nav ما از چه محتوایی میتوانیم استفاده کنیم؟
  • پشتیبانی مرورگرهای مختلف از تگ header چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش چهارم – تشریح تگ باز و بسته ی <section></section>

  • کاربرد تگ section در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ section در طراحی سایت چیست؟
  • درون تگ section ما از چه محتوا و تگ هایی میتوانیم استفاده کنیم؟
  • نکات مهم در زمان استفاده از تگ section
  • پشتیبانی مرورگرهای مختلف از تگ section چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش پنجم- تشریح تگ باز و بسته ی <article></article>

  • کاربرد تگ article در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ article در طراحی سایت چیست؟
  • درون تگ article ما از چه محتوا و تگ هایی میتوانیم استفاده کنیم؟
  • نکات مهم در زمان استفاده از تگ article
  • پشتیبانی مرورگرهای مختلف از تگ article چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش ششم- تشریح تگ باز و بسته ی <aside></aside>

  • کاربرد تگ aside در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ aside در طراحی سایت چیست؟
  • درون تگ aside ما از چه محتوا و تگ هایی میتوانیم استفاده کنیم؟
  • نکات مهم در زمان استفاده از تگ aside
  • پشتیبانی مرورگرهای مختلف از تگ aside چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش هفتم – تشریح تگ باز و بسته ی <footer></footer>

  • کاربرد تگ footer در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ footer در طراحی سایت چیست؟
  • درون تگ footer ما از چه محتوا و تگ هایی میتوانیم استفاده کنیم؟
  • نکات مهم در زمان استفاده از تگ footer
  • پشتیبانی مرورگرهای مختلف از تگ footer چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش هشتم – تشریح تگ باز و بسته ی <details></details> و تگ باز و بسته ی <summary></summary>

  • کاربرد تگ details در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ details در طراحی سایت چیست؟
  • درون تگ details ما از چه محتوا و تگ هایی میتوانیم استفاده کنیم؟
  • نکات مهم در زمان استفاده از تگ details
  • پشتیبانی مرورگرهای مختلف از تگ details چگونه است؟
  • کاربرد تگ summary در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ summary در طراحی سایت چیست؟
  • درون تگ summary ما از چه محتوا و تگ هایی میتوانیم استفاده کنیم؟
  • نکات مهم در زمان استفاده از تگ summary
  • پشتیبانی مرورگرهای مختلف از تگ summary چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

بخش نهم- تشریح تگ باز و بسته ی <main></main>

  • کاربرد تگ main در طراحی صفحات وب چیست؟
  • اهمیت استفاده از تگ main در طراحی سایت چیست؟
  • درون تگ main ما از چه محتوا و تگ هایی میتوانیم استفاده کنیم؟
  • نکات مهم در زمان استفاده از تگ main
  • پشتیبانی مرورگرهای مختلف از تگ main چگونه است؟

هشدار-اصلی-فیلم

درحال بارگذاری...

دانلود فیلم

۵۰۰ توماناطلاعات بیشتر