Донецкий техникум промышленной автоматики

10 очікуваних в 2015 році трендів веб-дизайну

  1. 1. Сайти з «великої онучею»
  2. 2. Історія та залучення
  3. 3. Відсутність фонових картинок
  4. 4. Мінімалістичний дизайн
  5. 5. Фіксована ширина з вирівнюванням по центру
  6. 6. Професійні високоякісні фотографії
  7. 7. випливають меню
  8. 8. Приховане меню
  9. 9. Великий шрифт
  10. 10. Продуктивність і швидкість

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

1. Сайти з «великої онучею»

Сайти з «великої онучею»

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

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

Наприклад, на промо-сторінці нового iPhone 6 представлені абсолютно всі технічні особливості та переваги смартфона (з окремим описом технічних характеристик екрану, камери, корпусу і т.д.). При бажанні користувач може не перечитувати всієї інформації, а вибрати виключно необхідну для себе, перейшовши в будь-який розділ, що містить більш докладний опис потрібного йому функціоналу деталі пристрою. У дизайн сторінки додані рухомі елементи, що роблять її більш «живою» і привертають додаткову увагу користувача.

2. Історія та залучення

Історія та залучення

Маючи цікавий контент, дуже важливо його добре піднести. Трендом 2015 року, безсумнівно, будуть ілюстровані історії.

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

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

3. Відсутність фонових картинок

Відсутність фонових картинок

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

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

сайт The New Wave Company добре відображає цю тенденцію. При повній відсутності фонових зображень у нього є об'ємний заголовок, який вітав відвідувачів, і великий шрифт вступного абзацу сторінки. Сайт зроблений зі смаком і вигідно виділяється на тлі своїх конкурентів.

4. Мінімалістичний дизайн

Мінімалістичний дизайн

Є така теорія, що будь-який дизайн (будь то сайт або скульптура) може вважатися закінченим лише тоді, коли з нього вже нічого не можна прибрати. У 2015 році ми, швидше за все, побачимо безліч сайтів, побудованих саме за таким принципом.

Сайт New Wave Company, згаданий вище, певною мірою відповідає цьому принципу мінімалістичний. Але є і більш яскравий приклад - сайт агентства Rareview Digital Agency . У дизайні його сторінок ви не зустрінете яскравих фонів, фонових картинок, інфографіки та т.д. Тут панують проста і чистота, що нітрохи не погіршує сприйняття контенту і не псує позитивного враження від веб-ресурсу.

5. Фіксована ширина з вирівнюванням по центру

Фіксована ширина з вирівнюванням по центру

Більшість сайтів останніх років використовують адаптивний дизайн, який підлаштовується під ширину екрану. Але, перед тим як це стало популярним, більшість сайтів мали фіксовану ширину і вирівнювання елементів по центру.

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

Щоб краще зрозуміти, про що йде мова, відкрийте сайт Michele Mazzucco і спробуйте декілька разів змінити ширину вікна браузера: елементи сайту будуть автоматично під неї підлаштовуватися прибираючи таким чином необхідність горизонтального скролінгу.

Варто додати, що вирівнювання елементів по центру забезпечує кращу фокусування уваги користувачів на контенті.

6. Професійні високоякісні фотографії

Професійні високоякісні фотографії

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

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

7. випливають меню

випливають меню

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

Саме тому елементи дизайну мобільних додатків перетікають тепер і в десктопний дизайн.

Яскравими прикладами подібного підходу до дизайну можуть вважатися сайти 24ways і Rawnet . Їх меню виконано в стилі меню мобільних додатків, має вертикальне розташування замість класичного горизонтального і відкривається кліком по відповідній кнопці.

8. Приховане меню

Приховане меню

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

Варіант реалізації такого підходу можна бачити на сайті Brian Hoff Design , Який, до слова сказати, теж сконструйований за технологією «чуйного дизайну». У випадку з сайтом Brian Hoff Design рішення організувати його навігацію через приховане меню прийшло після декількох років вивчення поведінки користувачів. За запевненням представників компанії, прийняте рішення принесло свої позитивні плоди.

9. Великий шрифт

Великий шрифт

Сказати, що мова йде про використання великого шрифту, значить, по суті, не сказати нічого: за мірками інтернету ми говоримо не просто про великому шрифті, а про гігантський. Цей тренд плавно перетікає з 2014 в 2015 рік. Все частіше великі заголовки і шрифт основного тексту збільшуються до максимуму: іноді здається, що їх можна розглянути з літака, що пролітає через щільну пелену хмар (утрирую, звичайно, але сенс зрозумілий).

Як приклад можна привести оформлення сайту Tiny Giant : Максимально можливий великий шрифт застосований тут для заголовка. Вважається, що його розміри відображають суть самої концепції.

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

10. Продуктивність і швидкість

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

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

Ми постаралися спрогнозувати основні тренди, які чекають нас в новому 2015 році. Якщо у вас є свої ідеї з цього питання, будемо раді побачити їх в коментарях під статтею!

За матеріалами: thenextweb.com