Автор: SmashingMagazine.com
Перевод: Всеволод Козлов
Навигация по сайту должна быть интуитивно-понятной и легкой в использовании.
Панель навигации – самый используемый элемент в веб-дизайне. Ни один другой элемент не используется чаще навигационной панели. Соответственно, создавая панель навигации, Вы должны позаботиться о том, чтобы с ее помощью пользователи смогли без труда находить интересующую их информацию на Вашем сайте.
Чтобы создать удовлетворяющую описанным выше требованиям панель навигации, нужно четко представлять себе структуру сайта.
Итак, как же дизайнерам удается создавать привлекательные и юзабельные (простые в использовании) навигационные панели? Ответ кроется далее по тексту…
В данной статье-обзоре мы хотим поделиться с Вами тщательно отобранными 53 привлекательными и интуитивно-понятными панелями навигации, созданными с помощью CSS.
PS: Мы по ошибке включили в данный список несколько навигационных панелей, созданных с помощью DHTML и JavaScript. Приносим Вам свои извинения.
После просмотра представленных навигационных панелей у Вас обязательно возникнут какие-либо соображения или на Вас нахлынет море эмоций — поделитесь ими в комментариях
!
1. Change.org
2. N.Design Studio | Design & Blog
3. Good Creative — Web and Graphic Design
6. CSS Vault » The Web’s CSS Site
7. notiam.com
8. Jamie Huskisson: Full time UK PHP freelance developer
9. Web design, development and consultancy from Ottawa, Canada — Snook.ca
10. BREAKER DESIGN
11. Jen Gordon
12. Tulumarka
13. Ars Technica
14. CSS Beauty | CSS Design, News, Jobs, Community, Web Standards
16. Triple Crown Customer Service
17. microformats
18. Badboy.ro
19. GetMenus.ca
20. Wedding Extravaganza 2007 — A Perfect Marriage
21. Job Pile — Aggregating the Best Job Boards on the Web — Artypapers
22. Norman Morrow & Co — Estate Agents In Crumlin, Northern Ireland
23. Listal — List the stuff you love! Movies, TV, music, games and books
24. folietto
25. Tony Yoo — Online Showcase (version2)
27. Denbighshire Supporting Business
28. Pulmad, peod, lillesalong… — Annilill Peoteenindus
29. ExpressionEngine — Publish Your Universe!
30. coda.coza
31. purevolume™ | We’re Listening To You
32. EGOLOUNGE *Buro fur digitales Design
33. Merix — Internet Technologies
34. Bartelme Design | Showroom
36. CSS3 . info — Everything you need to know about CSS3
37. nclud™ a creative web design agency
39. ExpressionEngine — Publish Your Universe!
40. Silverpoint: Web Solutions for Schools
41. Jambor-ee — Celebrating ExpressionEngine
43. Scribd — Home
45. Photoshop Tutorials and Articles — Tutorial Blog
46. Welcome to Buzz — Buzz Recruitment
47. Michal Zapomel — cesky vlasovy design | czech hair design
49. M122Arts Mixed Media and Technology // oo*o
50. KazanShops.Ru
51. Stone inc. — Amenagements Paysager, Paves.
52. Pixellogo
53. AUSMAG — das Australien Work & Travel Portal
Оригинал статьи: CSS-Based Navigation Menus: Modern Solutions
Смотрите также:
- Скрипт галереи
- Prestashop шаблоны
- Jquery скрипты
- Создание логотипа
- Текстуры
- Jquery всплывающие подсказки
- Сделать сайт
- Css reset
- Ускорение загрузки сайта
- Css прилепить футер






















































11 комментария(-ев)
Юзабельность панели навигации имхо на 90% зависит от хорошо продуманной структуры сайта. Чем запутаннее структура, тем безнадежнее шансы добиться юзабельности в панели навигации.
Рыболов, согласен с Вами. Но согласитесь, что далеко не всегда и не все могут оформить панель навигацию достойно — так, чтобы пользователь приковал к ней свое внимание и «тащился» от ее использования!
Это потому что пользователь пользователю рознь, знаю на собственном опыте, всем никак не угодиш.
Классный материал, Всеволод! Однако, почему-то в представленной подборке абсолютное большинство панелей составляют горизонтальные. Вертикальных меню крайне мало. Неужели, создать «привлекательное и интуитивно понятное» нав. меню гораздо проще горизантальным? В чем тогда минус вертикальных навигаций?
Кирилл, спасибо за коммент!
Ты прав, в данной подборке подавляющее большинство — горизонтальные менюшкаи…
Но вовсе не потому, что вертикальные менюшки трудно делать красивыми или еще почему… А потому что это выбор авторов этой статьи-обзора!
Но раз публика просит, в скором времени опубликую классные вертикальные менюшки, созданные на CSS!
[...] должна быть навигация по сайту? Как должны быть выполнены навигационные ссылки: в [...]
Очень интересные менюшки — дизайн сайта и его юзабельность очень сильно зависит от МЕНЮ.
Интересные примеры! Но самый лучший вариант это комбинация и горизонтального меню и вертикального!
отличная подборка!
После просмотра всего это захотелось что то подобное.
Вот собираюсь что то соорудить
Вот еще один прикольный вариант реализации навигации по страницам сайта, реализован с помощю плагина на MooTools — http://cleverscript.ru/index.php/javascript/mootools/15-pagemooslider
i lOve MacRabbit …. Amazing Collection …. Keep Up The Good work