11 трендов веб-дизайна, которые мы хотели бы видеть в 2014 году

Январь был полон заявлений различных аналитиков, которые предсказывали, что будет в этом году.

И пока мы с удовольствием читали все эти прогнозы, мы не могли не спросить себя: «Какие тренды мы хотим увидеть в этом году?»

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

В комментариях мы хотели бы услышать ваши мысли по этому поводу!

1. Прогрессивные макеты журналов

Прогрессивные макеты

Статья New York Times «Томаты могут играть блюз» наглядно показывает, что можно сделать онлайн статьей-презентацией.

Мы рады отметить, что в ней использовано впечатляющее ускорение HTML5, а также поддержка кроссбраузерности для больших возможностей CSS и JavaScript. Благодаря росту популярности планшетов и увеличению доли мобильных пользователей в аудитории сайтов, в веб-дизайне будет все больше просматриваться тенденция «рассказ истории».

Но даже с учетом этих достижений, печатная полиграфия изо всех сил пытается оставаться актуальной в эпоху цифровых технологий. Что я надеюсь увидеть в этом году, так это больше хороших работ фоторепортеров на сайтах.

2. Более разнообразные шрифты

В 2014 году издатели и блогеры будут использовать не только верстку с несколькими колонками, похожую на макеты печатных журналов, но и версту с гибкими сетками, которая является адаптивной, а также будут применять различные сервисы шрифтов, такие как @ FontFace и TypeKit.

Кроме того будут применяться различные интересные сочетания шрифтов, чтобы подчеркнуть свой стиль.

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

Например, в конце прошлого года — начале нынешнего прослеживается тенденция, когда стандартный sans-serif потихоньку отмирает, и люди все больше используют более уникальные шрифты.

3. Визуальные эффекты, созданные с помощью чистого кода

Визуальные эффекты

Инструменты веб-дизайна делают создание прототипов анимации намного более простым.

Интересные frontend разработки продолжат в этом году раздвигать границы возможностей современных интерфейсов. Codepen имеет много примеров, когда люди выдвигали впечатляющие предложения по сочетанию HTML5/CSS и JavaScript.

Новые дополнения к спецификациям CSS, такие как режимы наложения и маски, позволяют и стимулируют разработчиков на сто процентов раскрыть свой потенциал.

Мы надеемся, что в приложениях для новых устройств будут одинаково успешно сочетаться и производительность, и захватывающая анимация. Adobe Edge пока не относится к их числу, но мы надеемся, что в скором времени он станет чем-то настолько же значимым, как в свое время Flash.

Не отстает в этом плане и Google со своими инструментами для веб-дизайнеров. Они делают возможным реализацию прототипов на базе HTML5.

4. Отход от плоских форм

Насколько мы любим его за простоту в использовании, настолько же Flat UI имеет много моментов, которые не нравятся нам в этой одной из самых популярных тенденций последнего времени.

Мы живем в мире, в котором нас окружают электронные устройства. Этот бум цифровых технологий лишает новое поколения опыта соприкосновения с формами «вне монитора», что в конечном итоге уничтожает скеуоморфизм.

Изображение на плоском экране это не то же самое, что прикоснуться рукой к ткани, перебирать картотеку или получить другой опыт объемного мира. Что еще более тревожно, какие негативные последствия это будет иметь в долгосрочной перспективе.

Например, объект, который раньше нам было легко представить в виде дискеты, теперь отобразить не так просто.

Что мы используем, чтобы представить концепцию простого действия сохранить? Жесткий диск? Облачный сервис? Нет, просто слово «Сохранить». Будущее с неясной и довольно абстрактной визуализацией и иконографией — это довольно реальная перспектива (Простите мне мой драматизм).

5. Видео становится все более впечатляющим

Поднимите руку те, кто видел на прошлой неделе главную страницу с видео. По мере того, как кодеки становятся все мощнее, устройствам все проще работать с видео.

Это самый мощный инструмент визуального общения из всех существующих, так как он использует визуальные эффекты и звук, чтобы воздействовать на пользователя. И здесь тенденция однозначная — видео становится все популярнее.

6. Оригинальные языки и контекстно-ориентированные интерфейсы

Оригинальные языки

Заточка сайта под разные устройства это только начало.

Мы ожидаем, что все больше будут использоваться списки и сетки, заточка именно под «тебя».

Уже получили широкое распространение пошаговые руководства на разных языках и диалектах (к нашему большому удовольствию), и, если подходить к вопросу интеллектуально, то в скором времени должны доминировать именно контекстно-ориентированные интерфейсы.

Также вы, наверное, уже заметили, много примеров введения новых правил игры. Таких как яркость фона в зависимости от устройства пользователя или зарядки его батареи.

Определение на основе географического положения пользователя его текущего времени суток и соответственно введение различных режимов яркости для дня и для ночи.

А также управление опытом пользователя путем сбора всех его предпочтений и предоставления ему, всей информации, которая с этими предпочтениями связана, когда он авторизуется под своим логином.

7. Пользователям будет проще добраться до пункта назначения

Отдельные целевые страницы (лэндинги) всегда являлись мощнейшим инструментом конверсии для брендов. В прошлом такая ситуация наблюдалась часто, потому что главная страница или вложенные разделы были слишком общими — слишком много информации, слишком много текста, слишком много вариантов выбора.

В настоящее время все стремится к «минимализму», к тому, чтобы уменьшить когнитивную нагрузку на пользователя. Мы видим более простые, понятные призывы к действию, которые направлены на то, чтобы получить это «первое» взаимодействие.

Приложения являются яркими представителями этого направления. Они требуют минимальных усилий, чтобы запустить приложения, постепенно увеличивая требования, чем глубже в него вы погружаетесь.

Этот «опыт без сопротивления» также способствует увеличению удовлетворения пользователя, которое является косвенным фактором рейтинга сетевого продвижения бренда — еще одного ключевого показателя, который используется для оценки того, насколько эффективен бренд.

Приведем такой пример: Что бы вы предпочли Best Buy или Apple Store? Мы уверены, что вы выбрали бы магазин Apple.

Но почему? Best Buy тоже продает продукцию компании Apple! Нужно ли говорить что-то еще?

8. Прокрутки и управляемые пользователем элементы

Прокрутки

Сайт The Walking DeadХодячие мертвецы») использует параллакс-прокрутку, чтобы вовлечь вас в своей кровавый мир.

Будущее больше не находится в наших руках.

Наши руки это и есть будущее. Раньше модули ввода руководствовались нашим опытом взаимодействия с примитивными терминалами конца семидесятых.

Мыши, планшеты, сенсорные устройства диктуют, каким будет наш опыт восприятия в будущем. Элементы оживают, появляются и исчезают на основе действий пользователя — все больше таких вещей появляется на каждом сайте, и все мы поражены насколько это зрелищно.

И вещи наподобие этих, которые зачаруют нас, появятся повсеместно уже с минуты на минуту: с еще более яркими деталями.

Изучив своего пользователя достаточно хорошо, вы сможете подарить ему удивление и восторг — это станет основным правилом игры. Если отрасль примет это.

9. Контент прежде всего

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

Как вы думаете, почему появляются всплывающие и исчезающие элементы навигации?

Мы ожидаем увидеть больше проектов с использованием дизайна запуска всплывающих панелей — и это хорошо. Это только кажется очевидным, что нужно показывать пользователю только то, что он хочет, когда он этого хочет и вывести все это во всех возможных местах, где ему будет просто это найти.

10. JavaScript всерьез и надолго

JavaScript

Фреймворки, наподобие Ember помогают повсеместно внедрять JavaScript в современном веб-дизайне.

Раньше в Интернете «крутым парнем» считался Flash. По сути, он не давал ничего, кроме фактора поражающей впечатление анимации.

Но эти времена прошли. Теперь JavaScript является альфой и омегой, постоянно увеличивая свою популярность, благодаря увеличению числа доступных связей и библиотек практически для любой платформы.

В настоящее время целые платформы работают на JS, и его огромная популярность говорит нам о том, что этот язык будет только продолжать развиваться.

Различные фреймворки появляются, как грибы после дождя, и можно смело говорить, что, если что-то может быть сделано на JavaScript, это будет сделано именно на нем.

11. Возврата к интро-сайтам не будет

Терпение пользователей тает, как капли воды на асфальте в жаркий летний день. Мы видим что, незначительное количество сайтов все еще используют утилизированную загрузку, транзитные переходы и другие управляемые «операторами» элементы, которые похожи на AJAX.

Если вы думаете, что они просуществуют долго, я бы сказал, что не стоит на это рассчитывать. Просто, что бы вы не делали, пожалуйста, не возвращайтесь к «интро»-сайтам.

Заключение

Что же все это значит? Все вышесказанное должно быть учтено при разработке проектов. При выборе направления разработки, пишем ли мы код руками или нет, при создании композиций и визуальных элементов.

Отрасль всегда в движении, и в этом году мы планируем выйти за рамки основных трендов и дать толчок цифровой индустрии в правильном направлении.

И наконец, именно в этом году мы ожидаем, что в Интернете массово будет происходить соединение усилий дизайнеров и разработчиков — будущее Интернета за проектами, создаваемыми совместными усилиями.

Перевод статьи «11 web design trends I’d like to see in 2014» был подготовлен дружной командой проекта Сайтостроение от А до Я.