Вітрина красивих вікон дизайну інтерфейсу пошуку
В Інтернеті це поширене місце, де - якщо ми не можемо отримати те, що ми шукаємо на сайті, ми вдаємося до пошуку. Поле пошуку завжди було важливою частиною веб-сайту. Якщо ви запускаєте веб-сайт, що містить значні вмісти, це ще більше неминуче. Вони зазвичай розміщуються в наступних областях: заголовок, верхнє навігаційне меню або бічну панель (верхню частину). Іноді в нижній колонтитул можна також закинути ще один, щоб зробити пошук зручнішим для користувачів.
Ми пройшли довгий шлях з Веб 1.0; пошук в Інтернеті більше не обмежується введіть ключове слово та натисніть пошук. Розробники прагнуть зробити пошук кращим для своїх відвідувачів шляхом оновлення та додавання додаткових функцій, повідомлень, фільтрування пошуку, щоб отримати більш націлені результати, надаючи ключові слова для пошуку або історії пошуку під час введення.
У сьогоднішньому пості ми демонструємо деякі красиві вікна пошуку з багатообіцяючими функціями, які ми дізналися. Якщо ви хочете оновити ваш сайт або просто шукати натхнення для кращого вікна пошуку, ця посада для вас. Повний список після стрибка!
Плейлистзараз
Починаючи з префікса "Я є", цей модуль пошуку намагається інтелектуально зіставити та перерахувати результати, які відповідають запиту під час введення.
Прокрутіть модуль пошуку
Запропонований дизайнером Nico Nuzzaci, це вікно пошуку для пошуку дозволяє здійснювати пошук, ввівши або прокрутивши алфавітну панель.
Список текстових повідомлень
Цей модуль пошуку містить декілька функцій: він обертає пошукові запити у форматі тегів і дозволяє видалити певний тег пошуку. Він також поставляється з автозаповненням. Виглядає звично? Це схоже на модуль тегу Facebook!
Пам'ятайте про Молоко
Подібно до пошуку YouTube, вікно пошуку тут негайно повідомляє, якщо щось відповідає вашому результату. Ще один розумний приклад функції самонавіювання.
Автентичні вакансії
Я думаю, що аутентичні вакансії вже мали свій пошук з миттєвими результатами і працювали перед Google.
Kontain
Вікно пошуку Kontain дозволяє користувачам здійснювати загальний пошук або фільтрувати результати пошуку лише для "оновлень" або "користувачів".
New York Magazine
Як і у Kontain, пошук NY Magazine дозволяє глибше фільтрувати.
Тема лісу
Ще один приклад фільтрації в модулі пошуку, щоб допомогти відвідувачам отримати те, що вони хочуть протягом мінімального часу.
Пошук, сортування та фільтрування
Вікно пошуку Брайана виглядає як модуль попереднього пошуку, виконаний красивим способом; налаштуйте вигляд результатів, перш ніж натиснути кнопку пошуку.
Tumblr
Тонкий і невеликий модуль пошуку на бічній панелі - акуратний!
Менюсторінок
Якщо ви шукаєте повний модуль пошуку, а простір є обмеженням, цей підхід може стати в нагоді.
Quotezuki
Модуль пошуку відразу після логотипу, це дійсно важко пропустити.
C Spire Wireless
Велике жирне вікно пошуку, яке відображається лише під час пересування на вкладці пошуку; Інший хороший спосіб використовувати простір.
Spokeo
Вибірковий пошук з фільтрацією зроблено красиво.
Ваучернікоди
Дивлячись на його бізнес-характер, удари у верхню частину вікна пошуку і праворуч у центрі, мабуть, найкраща ідея.
iStockPhoto
Подібно до інших сайтів, iStockPhoto пропонує величезну кількість ресурсів для своїх читачів, тому фільтрація в пошуку є безумовно важливою.
TasteBook
Простий шукає ще дивовижний вікно пошуку.
Grooveshark
Grooveshark дозволяє слухати та обмінюватися музикою в Інтернеті; перша сторінка складається лише з вікна пошуку для пошуку потрібної музики. Це повністю має сенс.
Геймери з вакансіями
Приємний приклад налаштування користувацького пошуку Google.
Девід Торондел
Приємний темний вікно пошуку, що добре поєднується з дизайном сайту.
Більше
- Створення качающегося вікна пошуку CSS3 (Hongkiat)
- Створення вікна пошуку: приклади та найкращі практики (Журнал Smashing)
- Красиві CSS3 Пошукова форма Посібник (Стіна веб-дизайнера)
