اسفند, ۱۳۹۷ بدون نظر HTML

تگ body

همان گونه که  در ابتدای این بخش گفتیم ، بدنه اصلی  صفحه وب سایت ، درون تگ body قرار می گیرد و هر عنصر و متنی که خارج از این تگ قرار بگیرد ، در صفحه مرورگر قابل مشاهده نخواهد بود. ساختار قالب صفحات وب در html5 نسبت به نسخه های پیشین تغییر محسوسی کرده است.

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

تصویر زیر ، بلوک بندی یک صفحه وب براساس html5 را نمایش می دهد.

ساختار قالب صفحات وب - تگ body

 

همانگونه که در تصویر فوق مشاهده می کنید ، در html5 صفحه وب توسط ۶ تگ مختلف به بلوک های متفاوتی تقسیم شده است. این تگ ها هر کدام مفهوم خاصخود را دارند و صفحه را از لحاظ منطقی به قسمت های  header , nav,section,article, aside, footer  تقسیم بندی می کند.

کاربرد تگ < header>  و <footer>

 قبل از توضیح باید بگویم که تگ < header> با تگ <head> که در بخش قبل معرفی کردیم ، تفاوت دارند. تگ < header>  و <footer> برای ایجاد سر صفحه و پا صفحه به کار می روند.

اگر به کتابی که در دست خود دارید توجه کنید ، می بینید که در بالا و پایین تمام صفحات آن یک کادر و یا یک  نوشته یکسانی وجود دارد. به متن ، عکس و یا کادری که در بالی تمام صفحات تکرار می شود و معمولا عنوان فصل یا نام کتاب را در بردارد ، سر صفحه ( یا header)  و به متن ، عکس و یا کادری که در پایین صفحات تکرار می شود و معمولا شماره صفحه را در بر می گیرد ، پا صفحه یا (footer) می گویند.

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

کاربرد تگ <section> و <article>

تگ برای تعیین <section> “بخش ها” در صفحه به کار می رود. و در واقع مطالب صفحه توسط این تگ به بخش های مجزا از یکدیگر بلوک بندی می شوند. تگ<article> در داخل تگ <section> قرار می میگیرد و محتوای موجود در تگ <section> را بلوک بندی کرده و هر کدام را به عنوان یک عنصر مجزا در نظر می گیرد.

تگ <nav>

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

تگ <aside>

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

 

 

برچسب ها

ارسال نظر شما

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *