Так как, ни одна другая страница не имеет такой важности, как стартовая, будет интересно узнать, какой инновационный подход применили дизайнеры при создании своих стартовых страниц. Давайте посмотрим. Необычные, примечательные и нестандартные главные страницы в кратком обзоре.
1. Динамические, интерактивные, стильные
Видимо, Лео Бернетт (Leo Burnett) предпочитает работать карандашами, по крайней мере, на стадии эскиза. На сайте LeoBurnett.ca, основанного на технологии flash, карандаш используется в качестве курсора. Элементы навигации выполнены в 3D. Красиво, интерактивно, удобно.
Элементы навигации на Capitalcomm, похоже, подвешены на веревочках. Чтобы перейти к какой-либо части контента, необходимо потянуть за соответствующий элемент. Крайне удачный дизайн, очень приятен для исследования.
Flash-навигация на Yammat.com держится на эластичных лентах. Кликните на ссылку, и вся страница приходит в движение. Фоновое изображение меняется при каждом обновлении страницы.
Интерактивное вертикальное меню навигации. На сайте SectionSeven.com разделы можно перелистывать как книжные страницы.
Не только пользователи могут играть сайтами, но и сайты могут играть пользователями. Навигационное меню сайта Flaboy.com перехватывает курсор и предлагает точки перехода — автоматически. Прекрасная задумка, прекрасная реализация.
Навигационное меню может быть вычурным. И сайт MHQ.nl это подтверждает.
2. Смотрим сайты по-новому
А как насчет просмотра сайта без необходимости кликать на ссылки? Интересный подход. Дизайнеры экспериментируют.
3. Расширенный дизайн интерфейса
Джейсон Хикнер (Jason Hickner) предлагает скользящую навигацию с отличной типографией и продуманным динамическим взаимодействием.
4. Другая перспектива
Необычную перспективу предлагает сайт Дэвора Ванейжки (Davor Vaneijk). Пользователи видят навигационное меню, основанное на иконках, под острым углом.
Аналогичный подход в исполнении Мэтью Бэдимона (Mathieu Badimon).
Лэнс Ваймэн (Lance Wyman) представляет свою работу в форме спирали. Последние произведения располагаются на внешней стороне. Навигационное меню предоставляет более детальный выбор. Реализовано на flash.
5. Визуальная коммуникация
Стартовая страница проекта «One Laptop per Child» (каждому ребенку по лэптопу) — не просто заставка. Изображения ведут на различные разделы сайта. Меню навигации выполнено с применением иконок. Нестандартная, но интересная концепция.
6. Сила визуальных элементов
Сайт 73dpi.net выражает свою мысль изображениями, а не словами. Работы представлены друг за другом без описаний и комментариев.
Basism показывает свои работы в хорошо структурированной сетке. Описания скрыты, но появляются при наведении курсора. Решение, основанное на flash.
7. Огромные облака тегов
Search the Beat — музыкальный поисковый движок, экспериментирует с огромными облаками тегов. На стартовой странице размещено около 150 кб текста.
К разговору о тегах: агентство Wieden+Kennedy пользуется ими для представления своих клиентов согласно их «весу» и авторитету. Очевидно, клиентов много. Для перемещения по названиям можно воспользоваться шкалой. Основано на flash, и имеет свои недостатки в области юзабилити. Интересная концепция не обязательно должна быть вычурной.
8. Динамическое взаимодействие и искусство
Для показа своих работ Vault49 применяет flash. Страница делится на 6 частей, перемещаясь по которым, пользователь видит результаты, как фоновые изображения. Несмотря на интересную идею, на сайте присутствуют раздражающие выскакивающие окна. Firefox их блокирует.
Cappen.com достигает удобства при помощи иллюстраций, произведений искусства и продуманной структуры.
9. Интерактивно и удобно
Магазин на одной странице — Shopcomposition.com предлагает решение в стиле «первый и последний». Все товары можно найти и посмотреть прямо с главной страницы.
10. Типография в действии
Очень необычно, но примечательно. Пользователи даже могут поиграть с полосками текста, если те связаны, что не всегда так. Не сказать, что информативно, но вполне необычно. Есть возможности для развития, особенно если задействовать flash.
Просто образец хорошего решения на основе типографии. Для тех, кто ценит красоту текста. Недостаток: при отключении стиля меню навигации просто исчезает.
Похожую идею, но на flash, реализовал Нейл Дюрден (Neil Duerden)
11. Эффект маркера
Возьмем, к примеру, сайт Энди Ратледжа (Andy Rutledge). Он представляет длинные отрывки текста, как заголовки. Иногда для привлекательного дизайна достаточно лишь трех цветов. Эффект маркера в действии.
Подобный эффект применяется и на сайте Mostardesign. Все основывается на фоновом изображении и выделенном контенте.
Иоган МаКейб (Eoghan Mccabe) удивляет своих посетителей интересным эффектом, проявляющимся при наведении курсора. Если курсор не наведен на текст, страница выглядит достаточно скучно. Важное подкрашивается зеленым маркером. Размер шрифта определенно слишком велик.
12. Экспериментируйте
Шон Инман (Shaun Inman) экспериментирует с цветами и насыщенностью, демонстрируя, таким образом, новизну (и, вероятно, относительную важность) контента.Каждый день года связан с определенным цветом. Зима начинается с синего, меняющегося на зеленый весной. Лето переходит в желтый, а осень — в красно-оранжевый. Со временем цвета затемняются.
На сайте AListApart.com каждый новый выпуск имеет свою цветовую схему. Представьте: «Красный и зеленый на Рождество. А когда нам, наконец, напишет Якоб Нильсен, мы подчеркнем ссылки синим».
13. Дайте пользователям возможность исследовать
Rinzen предлагает стартовую страницу для исследователей. Навигационное меню состоит из десятков цветных пикселей, каждый из которых ведет в определенный раздел. Всплывающие подсказки вверху страницы укажут, куда ведет пиксель.
На сайте Mstudio элементы навигации также придется исследовать. Разделы представлены как трехмерные страницы.
Catalogtree, вероятно, предлагает самое странное меню навигации из когда-либо созданных. Небольшая анимация слева от алфавита (там набирается текст) предлагает пользователям ввести кодовые символы и цифры. После подтверждения ввода клавишей «Enter» загружается новая страница.
Довольно странный сайт, и немного конфликтует с современными браузерами. Те, кто не справится с такой навигацией, могут воспользоваться индексом ссылок, перечисляющим все доступные страницы. Несмотря на то, что реализация не идеальна, идея набора названия желаемой страницы заслуживает упоминания.
Стартовая страница сайта Post Typography представляет собой заставку, по которой можно получить представление об основной теме сайта — типографии.
Внутренние страницы похожи на собрание кнопок. Да, это и есть ссылки.
На первый взгляд в дизайне KEEN нет ничего особенного. Однако, вместо традиционного меню навигации на сайте применяются скользящие блоки данных. Вся информация отображается на единственной странице, обновления страницы не потребуются.
14. Минимализм и внимание к мелким деталям
Небольшой, но с огромным вниманием к мельчайшим деталям — The Tangerine Tree. На самом деле, можно было сделать и покрупнее.
15. Неординарные решения
Куда поместить меню навигации? Слева или справа? Сверху или снизу? Ну, а почему бы не посередине? Nonstep фиксировано разместил свое навигационное меню, и это положение никогда не меняется, даже при прокрутке. Навигация крайне проста — клик на элементе навигации динамически прокручивает контент, и меняет фоновый цвет страницы.
Хотите, верьте, хотите — нет, но это — блог. Страница не только выглядит как блокнот Windows, но и так же работает. Меню навигации выпадает сверху.