ایجاد نویگیشن وب سایت (navigation) با استفاده از تگ nav

با آمدن تکنولوژی HTML5 ، در زبان اسکریپتی HTML پیشرفت و بهبود چشمگیری ایجاد شد . یکی از این تغییرات بزرگ که در صنعت طراحی وب همراه با این تکنولوژی حاصل شد ، معناگرا شدن دنیای وب است . در عصر حاضر ، به فضای وبی که در اختیار ما می باشد اصطلاحا نسل سوم وب یا به عبارت بهتر وب معنایی (Semantic Web) اطلاق می شود . از جمله ویژگی های HTML5 این است که تعداد زیادی تگ معنایی به تکنولوژی HTML اضافه کرده است و همچنین تعدادشان در حال افزایش است . از آنجایی گفته شده پس از HTML5 نسخه دیگری از HTML نخواهد آمد و سایر تغییرات و به روز رسانی های آینده این تکنولوژی به صورت جزیی و موردی به آن اضافه می شود ، بهتر است برای طراحی سایت بهینه و به روز ، طراحان سایت در بازه های زمانی مختلف آخرین تغییرات و به روز رسانی های این تکنولوژی را بررسی کنند . لازم به ذکر است که استفاده از ویژگی های به روز تکنولوژی های طراحی سایت بسیار در بهینه سازی سایت برای موتورهای جست و جو یا هما سئو سایت (SEO: SearchEngineOptimization) حائز اهمیت و مفید می باشد و پس از نسخه HTML5 استفاده از تگ های معنایی تبدیل به یک امر واجب در طراحی سایت شده است .
یکی از تگ های معنایی جدید که در HTML5 معرفی شد و بسیار مورد استفاده قرار می گیرد و از اجزاء اصلی هر وب سایت است ، تگ <nav> می باشد که به شما این امکان را می دهد تا لینک های نویگیشن وب سایت خود را گروه بندی کنید و از نظر ساختاری بسیار به مفهومی تر شدن کدها و قالب سایت کمک می کند . در این مقاله به طور خاص تگ <nav> و مشخصه ها و طرز استفاده آن در ساختار قالب سایت را بررسی خواهیم کرد .
چطور از تگ <nav> استفاده کنیم ؟

در نگاه اول استفاده از آن بسیار ساده به نظر می رسد ، اما نوع استفاده از آن باید با کمی دقت انجام شود و این تصمیم به عهده توسعه دهنده سایت می باشد .
اغلب توسعه دهندگان front-end وب سایت عادت کرده اند که نویگیشن سایت را به این صورت ایجاد کنند :
<div id="nav">
<ul>
<li><a.... etc
یا
<ul id="mainNav">
حال با استفاده از <nav> میتوانید با کمی تغییر در کد خود ، نویگیشن سایت را به این صورت بنویسید :
<nav>
<ul>
<li><a href="/index.html">Home</a></li>
<li><a href="/about/">About</a></li>
<li><a href="/blog/">Blog</a></li>
</ul>
</nav>
مشخصه های تگ <nav>
در داکیومنت های ارائه شده برای HTML5 ، تگ <nav> به این صورت تعریف شده است :
" المانی در صفحه وب که در تگ <nav> قرار دارد معرف بخشی از صفحه است که حاوی لینک های نویگیشن سایت به داخل همان صفحه یا صفحات دیگر سایت می باشد .باید در نظر داشت که همه لینک های موجود در صفحات یک وب سایت ، نویگیشن سایت محسوب نمی شوند و تنها استفاده از این تگ برای بلاک هایی که دارای تعداد زیادی لینک داخلی هستند مناسب است . به عنوان مثال معمول است که در قسمت پایینی هر وب سایت (footer) ، تعدادی فهرست وجود دارد که بخش های اصلی سایت لینک شده اند ؛ طبیعتا برای این فهرست ها استفاده از تگ <footer> بسیار مناسب تر و معنایی تر از استفاده از <nav> می باشد . به طور کلی از <nav> معمولا برای لینک های موجود در فهرست نویگیشن هدر سایت (header) استفاده می شود . "
وب نوش

خدمات و محصولات صنعتی

 الکتروپمپ