1. Те, що вийшло з моди
2. Стиль Web 2.0 і реалістичність
3. стічні фотознімки
4. заставки
5. Автопроігриваніе аудіо та відеороликів
6. Вспливаючі вікна
7. Різноманітність шрифтів і відсутність читабельності
8. непрактичні рішення
9. Flash
10. загадкові іконки
11. Текст в графічному вигляді
12. Величезна кількість кнопок Like і Share
13. Що стало популярним
14. проста забарвлення
15. мінімалізм
16. нові шрифти
17. великі шрифти
18. блоки
19. Фонові фотографії та відео
20. інфографіка
21. завершення

Karina | 25.08.2014

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

І все ж ще залишається безліч сайтів, які не просто не йдуть в ногу з часом, а використовують ті методи, які застаріли давним-давно. Давайте розглянемо, чого саме сьогодні уникають розробники, а що з успіхом використовується.

Те, що вийшло з моди

Колись вважалося оригінальним прикрашати сторінки шаблонними фотографіями, падаючим «снігом» і іншими елементами. Але зараз все це вже здорово набридло і стало прирівнюватися до поганого смаку. Від чого ж відмовляються веб-дизайнери?

Стиль Web 2.0 і реалістичність

Об'ємні кнопки з підсвічуванням, «відображення» об'єктів, реалістичні іконки, закруглені кути і градієнти ще не так давно були популярними і використовувалися на кожному кроці. У нинішню епоху мінімалізму і флет-дизайну доводиться бути значно обережніше з такими ефектами. Думки розробників з приводу реалістичності або площині дизайну розходяться, але потрібно визнати, що перевага віддається останньому варіанту.

стічні фотознімки

Нещирі і натягнуті посмішки, дівчина з гарнітурою з колл-центру, глянцеві фото рукостискань і щасливих бізнесменів - все це вже не викликає нічого, крім недовіри і нудьги. Сьогодні на сайті набагато краще виглядатимуть реалістичні, справжні знімки. Ідеальний варіант - зняти серію фотографій спеціально під проект, не вдаючись до пошуку по фотостоках.

заставки

Рядок завантаження, анімована заставка або відео при відкритті сайту - всього лише перешкоди, які не дають користувачеві безперешкодно отримати доступ до контенту. Особливо коли вступ можна пропустити або кнопка Skip далеко захована. Мало хто любить чекати або розгадувати ребуси під час веб-серфінгу, тому важливо дати відвідувачеві можливість легко вивчити сайт.

Автопроігриваніе аудіо та відеороликів

Зараз відвідувачів вже практично ніхто не змушує слухати музику на своєму сайті, а ось довільний запуск відео зі звуком все ще часто практикується. Що ж, як правило, такі веб-сторінки «з сюрпризом» закриваються користувачем миттєво і без роздумів.

Вспливаючі вікна

Інтернет давно втомився від несподіваних popup-вікон, які демонструють рекламу або випрошують e-mail для підписки. Більшість з них до того ж буває складно закрити. Чи не відлякуйте відвідувачів - відмовтеся від спливаючих вікон.

Різноманітність шрифтів і відсутність читабельності

Текст, написаний всілякими шрифтами, виглядає без смаку. Шрифти повинні використовуватися в розумних кількостях, а також гармонійно поєднуватися. Розмір тексту необхідно підібрати такий, щоб його можна було читати без проблем, а його колір повинен бути контрастним по відношенню до фону. Варто відзначити також, що шрифт із зарубками читається з екрану виразно гірше, ніж з паперу.

непрактичні рішення

Технології не стоять на місці, а розвиваються практично щодня. Веб-дизайнерам потрібно враховувати сучасні вимоги до створення сайтів і уникати непрактичних і застарілих рішень.

Flash

Через проблеми з відображенням на багатьох пристроях краще відмовитися від сайтів на Flash. Тим більше що в наш час, завдяки широким можливостям CSS3, HTML5 і JavaScript, можна реалізувати все те ж, але без втрати сумісності.

загадкові іконки

Незрозумілим піктограм в навігаційному меню, опис яких можна побачити лише при наведенні покажчика миші, не місце в якісному дизайні. Щоб повністю переконатися в правильності цього твердження, спробуйте переглянути підказку для такої іконки в браузері свого iPhone або на іншому портативному пристрої, де немає можливості скористатися мишею.

На скріншоті нижче показаний сайт, де користувачеві доведеться думати, куди він потрапить, якщо натисне на один із значків в лівій колонці. Але треба віддати належне, мобільна версія сайту Electrik.co продумана краще - на ній видно підписи до іконок.

Текст в графічному вигляді

Розміщувати весь текст на сайті у вигляді зображень, особливо елементи навігаційного меню - це дуже погана затія. По-перше, якщо користувач відключив в браузері показ картинок, він нічого не побачить на сторінці і не зможе пересуватися по розділах. По-друге, пошукові машини поки не навчилися читати текст на зображеннях. Тому необхідно перевіряти, чи залишається сайт таким же функціональним без графіки.

Величезна кількість кнопок Like і Share

Розмістивши на сайті кнопки всіх існуючих соціальних майданчиків, можна збити з пантелику користувача. Краще залишити на увазі тільки найпопулярніші ресурси, а маловідомі приховати. Кнопки соціальних мереж - корисний інструмент, але він не повинен бути нав'язливим.

Що стало популярним

Зараз велика увага приділяється розробці адаптивного і зрозумілого дизайну сайту, який би гідно виглядав і працював як на ПК, так і зі смартфона. Також модним течією став плоский дизайн з мінімальною кількістю графіки і акцентом на вмісті.

проста забарвлення

Той час, коли було модно фарбувати сайт в усі кольори веселки, пройшло. Перевага віддається простим колірним схемами, де використовується всього кілька грамотно підібраних кольорів.

мінімалізм

Дизайнери з головою поринули в розробку сайтів, простих для сприйняття, де контент притягує увагу. Велика кількість вільного простору і ненав'язливий дизайн не відволікають користувача від важливих елементів на сторінці.

нові шрифти

Завдяки таким сервісам як Typekit і Google Fonts, обмежень в шрифтах більше не існує. Як і проблеми з відображенням різних видів шрифту на комп'ютері користувача. Ви можете вибрати саме те, що потрібно для вашого сайту, підкресливши його індивідуальність.

великі шрифти

Коли необхідно виділити важливий заголовок і привернути увагу, на допомогу приходять шрифти великих розмірів. Важливо не переборщити з їх використанням, а також продумати фразу для заголовка - вона повинна бути привабливою, але правдивою.

блоки

Яскраві блоки з текстовою інформацією, які доповнені якісними фотографіями - такий дизайн полюбився багатьом за свою практичність і простоту. Завдяки блочному розміщення об'єктів можна швидко ознайомитися з контентом сайту. Соковитий контраст, що створюється за рахунок кольорових блоків і цікавих картинок, привертає увагу користувачів і спонукає продовжувати дослідження сайту.

Фонові фотографії та відео

Коли на сайті в якості фону використовується цікава фотографія - це виглядає красиво. Така робота справляє позитивне враження і на клієнта, і на користувача. Повноекранне відео також ефективно впливає на відвідувача, роблячи сайт запам'ятовується. Ще одним цікавим способом залучення уваги є використання сінемаграфов - анімованих зображень, за допомогою яких сайт перетворюється, стає більш живим. На таких фотографіях циклічно відбуваються незначні рухи, зміни.

інфографіка

Останнім часом цей хід стали застосовувати на багатьох сайтах - графічний спосіб подачі інформації допомагає оживити контент, зацікавити читачів. Користувачі люблять, коли факти розкладені по поличках і красиво піднесені. Інфографіка на сайті може бути використана в різному вигляді - для опису покрокового процесу, статистики, перерахування і т. Д. Якщо вашого ресурсу потрібно такий крок, не забудьте спочатку ознайомитися з принципами побудови інфографіки.

завершення

У зв'язку з швидким розвитком технологій посилилася потреба створення адаптивних сайтів, логічного розміщення об'єктів, мінімізації відволікаючих чинників і концентрації на вмісті. Величезна увага приділяється зручності навігації та структурування контенту. Складна графіка відійшла на другий план, поступившись місцем легкому і простому оформлення. Завдяки численним інструментам, які сьогодні надані веб-розробникам, відкриті нові можливості для створення унікального і неповторного дизайну.