Навігація списком

Дійшовши до створення меню навігації, більшість web-розробників реалізують код таким чином:

    <nav>
    	<ul>
    		<li><a href="#">Home</a></li>
    		<li><a href="#">Products</a></li>
    		<li><a href="#">Services</a></li>
    		<li><a href="#">About Us</a></li>
    		<li><a href="#">Contact Us</a></li>
    	</ul>
    </nav>

Ті, хто ще не емігрував з HTML4, скористаються

або аналогом замість

Питання: Чи потрібно розміщувати елементи списком?

Звичайні посилання більш компактніші і чисті.

    <nav>
    	<a href="#">Home</a>
    	<a href="#">Products</a>
    	<a href="#">Services</a>
    	<a href="#">About Us</a>
    	<a href="#">Contact Us</a>
    </nav>

До HTML5, списки були необхідні:

• тому що старі браузери могли "боротися" з вбудованими елементами стилю

• сусідні посилання могли викликати проблеми доступності при читанні з екрану

• ви повинні були вставити навігацію куди-небудь - списки були гарним варіантом

Ці питання зникли з появою HTML5 елемента

Тим не менш, є ряд вагомих причин, щоб продовжувати використати списки:

1. Для визначення ієрархічного меню або підменю. Немає ніяких причин не використати інші елементи, хоча є кілька переваг, наприклад:

    <nav>
    	<h1>Main Menu</h1>
    	<a href="#">Home</a>
    	<a href="#">Products</a>
    	<section>
    		<h2>Product Menu</h2>
    		<a href="#">Product One</a>
    		<a href="#">Product Two</a>
    	</section>
    	<a href="#">Services</a>
    </nav>

2. Списки надають додаткові елементи для CSS.

3. Списки - це широко застосовуваний метод і розробники знають як з ним працювати і що від нього очікувати.

Навігація списком міцно увійшла в розробку як один з основних методів. Але, що чекає нас в майбутньому?