Тенденции веб-дизайна 2015 года

Автор:Дата:Переход к 2015 году в веб-дизайне обещает быть плавным. Что не может не настораживать!

веб-дизайн 2015Уже по традиции в начале осени Блоготей публикует статью о тенденциях веб-дизайна на грядущий год. Источником сведений становится дайджест «предсказаний», опубликованных на тематических ресурсах (англоязычных) — я прочитываю много-много-много таких постов и делаю для вас резюме. Ну и конечно, никуда не деться от собственного мнения. Некоторые мысли позволю себе высказать, не претендуя на экспертность…

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

Я, кстати, не претендую на «гуристость» в этой сфере (вообще ни в какой :) ). Но вспоминаю, как один известный веб-дизайнер (я, конечно, забыла имя) сделал на личном блоге размер шрифта 60 px и писал специальное обращение к читателям, мол, да, я знаю, как это выглядит, да, я специально так сделал…

В общем, это такая присказка. А сказка про будущий 2015 год впереди. И вспомнила я статью о 2014 годе не случайно. Дело в том, что ситуация напоминает игру «Найди 10 отличий». Честно говоря, и 3 отличия найти проблематично.

Ну, в общем-то, не мудрено — тенденции не скачут, как блохи, а развиваются поступательно. Хотя хочется, все-таки надеяться, что будущее сулит нам что-то новенькое…

Дизайн: адаптивный

адаптивный дизайнКуда ж без него?! Отзывчивость (rensponsive — буквально «отзывчивый») подразумевает, в общем-то, удобство взаимодействия с сайтом при помощи тач-скрина. Чтобы разнообразить свои вангования, иностранные авторы придумывают всякие конструкции, типа, «исключительно адаптивный» или «мобильный,мобильный, мобильный!»

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

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

Оформление сайта

Типографика рулит

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

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

Однако, если вы делаете сайт компании, бренда, который должен представлять ее лицо, выгодно подавать товар или услуги — обязательно продумайте вопрос привлекательной и запоминающейся типографики!

Изображения огромные и еще больше

Продолжается роман с огромными картинками. Даже такими огромными, которые не лезут в экран и часть остается просто за кадром (ну, конечно, это такой специальный ход). Это красиво.

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

А некоторые предлагают вообще фоновое видео! Кстати, это красиво…

Плоский дизайн

А вот с этим, мне кажется, скоро все наиграются. И (вангую!) 2015 год не подарит нам каких-то двухмерных изысков. Может быть, я и ошибаюсь, но не вижу у этого направления такого уж гигантского потенциала, чтобы держать всех за горло в течение многих лет.

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

плоский дизайн Windows

Вам нравится эта картинка? — Мне — нет. И вообще я считаю, что недаром CSS развивается в сторону имитации объема. Столько эффектов красивейших уже есть и появится еще больше. Уверена, что в двухмерности мы все-таки не задержимся!

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

Согласна на все 100%!

Блочный дизайн

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

Но теперь Интернет стал настолько значительнее печатных изданий, что выработал собственные правила. Пространство заполняют блоки, за каждым из которых скрывается нечто: текст (так ненавидимый всеми :) ), галерея, форма заказа и так далее.

«Призрачные» кнопки

Это вообще апогей плоскости. Кнопка не только не выделяется объемом — она почти не видна на фоне сайта. Но в этом «почти» и есть особая прелесть. Ведь, в принципе, пользователь — не слепой и, если ему нужна кнопка, он ее найдет))) Тем более, если при наведении, она меняет цвет или еще как-то сигнализирует о своем существовании…

призрачная кнопка

Этот пример, вообще, показывает многое из того, что мы уже обсудили и только готовимся обсудить:

  1. Призрачные кнопки и формы (слева — форма для ввода номера школы; справа кнопка поиска);
  2. Типографика — присутствует;
  3. Все плоское — ни одной выпуклости;
  4. За полупрозрачным однотонным фоном проглядывает не просто огромная картинка — целый гигантский видеоролик;
  5. Движение осуществляется скроллингом;

Можете посмотреть сам сайт здесь.

Юзабилити

Больше скроллить — меньше кликать

Вот это тренд — так тренд! Не заметить его невозможно: все, кто только может, делают одностраничные сайты, по которым нужно ползать вверх-вниз или влево-вправо… Меня лично такое устройство не впечатляет. Возможно потому, что я чаще просматриваю сайты на стационарном компьютере.

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

Персонализация взаимодействия

Это называется красивым термином UX-дизайн. То есть, «юзер экспириенс дизайн» — ориентированный на опыт пользователя. Вообще, все эти определения слишком расплывчаты. Получается, что любой хороший сайт будет UX, а любой плохой — анти-UX)))

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

Инфографика

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

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

Скажу честно, мои мозги воспринимают такую упаковку информации с трудом. Мне, как минимум нужен сопроводительный текст)))

Заключение

Глядя на это плавное течение реки веб-дизайна из 2014 в 2015 год я испытываю некое беспокойство. Так все гладко, предсказуемо, пресно, плоско, что аж тошно. Я очень надеюсь, что эту гладь сломает что-то революционное, неожиданное, совершенно новое. Уже явно настало время.

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

Оставайтесь на связи! Блоготей пришлет вам новые статьи на почту!
Введите свой E-MAIL:

     Katyaru 16.09.2014


    
Читайте БлоготеЙ! на Google+
Читайте БлоготеЙ! на Фейсбуке

К записи "Тенденции веб-дизайна 2015 года" оставлено 9 коммент.

  1. ladosha:

    Вот формирование собственного пользовательского меню — это да, идея.

    [Ответить]

    Katyaru отвечает:

    @ladosha, меню где? На сайте или в соцсетях?))) автор был туп и не понял, о чем речь)))

    [Ответить]

  2. Константин:

    Да уж, мрачновато как-то! С таким не живым оформлением, нормальный человек бежать будет скорее с блога. А насчет cookies и приветствия, лучше погуглить PHP- скрипты. Они полегче плагинов. Хотя и плагины мне такого типа попадались, правда названия не помню.

    [Ответить]

    Katyaru отвечает:

    @Константин, «не живое оформление» — плоский дизайн? Ну бывают удачные примеры. Про кукиз и приветствия — я пока даже не думала. До этого руки долго не дойдут)

    [Ответить]

  3. tanichka:

    Судя по Интернету особых изменений пока не наметилось. Большие картинки — да, красиво, но замедляет работу блога, а то загрузил бы в галерею и лайтбоксе в весь экран просматривал бы.

    [Ответить]

    Katyaru отвечает:

    @tanichka, вот мне и не нравится, что никто ничего нового не придумал))) Уныло!

    [Ответить]

  4. Павлуха:

    А с шапками, интересно, что будет происходить? Они станут ещё больше и красочней или пропадут совсем?

    [Ответить]

    Katyaru отвечает:

    @Павлуха, а кстати, о шапках-то я и не сказала) У многих «продвинутых» сайтов нет шапки, как таковой. Есть что-то вроде статичной главной, которая и играет роль такой гигантской, самостоятельной шапки с навигацией.

    [Ответить]

  5. Дмитрий:

    Доброго времени суток! А как же Retina, почему не упомянули? Это же ПЕРЕСТРОЙКА настоящая всего интернета.

    [Ответить]


восемь − 7 =

Палю тему!
Гугл в помощь
Надо подписаться!

Введите свой E-MAIL:

Delivered by FeedBurner

Дружите с Блоготеем в соцсетях


Смотрите все ВИДЕО Блоготея на YouTube


Blogotey | 


Спутник Блоготея в Tumblr

НаверхКарта Сайта