ایجاد نویگیشن وب سایت (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) استفاده مي شود . "
وب نوش