Кто является главным законодателем моды в мире разного рода мобильных устройств? Чьи презентации с замиранием сердца ждут потребители и жарко обсуждают журналисты? Разумеется, Apple. Именно эта корпорация превратила портативную электронику из утилитарного гаджета в модный аксессуар, и именно ее деятельность оказала мощнейшее влияние на современный веб дизайн и цены за качественную графику. Что изменилось? Давайте разбираться вместе.
Apple представила новый iPhone 6, Microsoft делает ставку на облачные вычисления, а в Евросоюзе вступил в действие запрет на сверхмощные бытовые пылесосы. При чем здесь, казалось бы, графический web дизайн? На самом деле, все эти новости напрямую связаны, главное — разглядеть, какие тренды за ними скрываются.
Все довольно просто: современная мода на мобильность и энергосбережение заставляет адаптироваться и веб-разработчиков. Смартфон, планшет, или тонкий клиент не обладают мощностями больших рабочих станций. Отсюда и первая тенденция — Flat Design (или Flat UI), что переводится как “плоский”.
Данная фишка стала популярной в немалой степени благодаря все той же Apple. В 2013 году компания представила iOS 7, обладающую совершенно плоским интерфейсом. Тяжелые тени, градиенты, сложная анимация — в общем, все то, что расходовало ограниченные мощности мобильных устройств было убрано ради повышения производительности. Современный веб-дизайн быстро перенял этот тренд. А как же иначе? С одной стороны, это позволило завоевать многочисленную аудиторию поклонников Apple (ведь куда проще ориентироваться на ресурсе, выполненном в стиле твоей любимой iOS). В то же время, вопрос производительности для веб-разработчика не менее важен, а Flat помогает создавать в буквальном смысле воздушные сайты, как с точки зрения дизайна, так и с точки зрения оптимизации.
Другое направление, Adaptive design, совсем недавно считавшееся приятным дополнением к функционалу веб-ресурса, сейчас также становится одной из обязательных фишек любого современного портала. Виновата, опять же, мода на мобильные устройства: создавая сайт, вы уже не можете быть на 100% уверены, в каком разрешении и в каком формате ваше творение будет просматривать конечный пользователь.
Спасает адаптивный дизайн веб-страниц, причем лучший его вариант — если ваш сайт умеет на лету определять и подстраиваться под разрешение экрана конечного пользователя. Старый метод, при котором параметры отображения менялись в зависимости от типа устройства, уже не работает, ведь если у Apple все более-менее стандартно, то в случае с многочисленными решениями на Android предсказать конфигурацию гаджета весьма проблематично (скажем спасибо китайским производителям, которые изощряются кто во что горазд).
Раз уж речь зашла о мобильности, то нельзя пройти мимо структуры контента. Поскольку на портативных гаджетах самый удобный способ навигации — прокрутка материалов сверху вниз легким движением пальца по сенсорному экрану, то вертикальный скроллинг будет более чем уместен, хотя в свое время подобное пренебрежительно называли “портянкой”, а хорошим тоном считалась разбивка статией на страницы. Учитывая подобный стиль навигации, логично дополнить современный web дизайн сайта сайдбаром, содержащим меню и элементы управления, дабы пользователю не приходилось каждый раз прокручивать страницу в обратном направлении.
Впрочем, отказываться от эффектных анимаций полностью никто не собирается, правда и в области разного рода веб-украшательств Apple сыграла существенную роль. Из-за патентных разногласий яблочные устройства не поддерживают Flash, как следствие, использование данной технологии при создании дизайна отошло на второй план. Подлила масло в огонь и Google: аналитики крупнейшей мировой корпорации справедливо рассудили, что строить свой бизнес вокруг чужих решений весьма рискованно, куда выгоднее вкладывать деньги в развитие универсальных стандартов.
Результат на лицо: Flash уходит в прошлое, а его место в современном дизайне сайта занимают HTML5 и CSS3. Благо этими средствами можно реализовать практически любые визуальные эффекты и трансформации, включая и набирающий популярность параллакс скроллинг. Данный термин обозначает движение отдельных слоев веб-ресурса, содержащих различные элементы, относительно друг друга при прокрутке. Такой прием позволяет придать визуальному оформлению объемность, и выглядит достаточно эффектно.
Еще одно наследие iOS, перекочевавшее в графический веб-дизайн — Blur (размытие). Эффект используется в связке с дополнительными всплывающими элементами. По аналогии с операционной системой, когда пользователь кликает, к примеру, на картинку, она открывается в “окне” на переднем плане, задний фон при этом становится нечетким. С одной стороны, это очередной реверанс в сторону поклонников Apple, но в то же время прием позволяет дополнительно оптимизировать проект, предлагая посетителям облегченные страницы с превью статей и мультимедиа, которые подгружаются в процессе просмотра.
Итак, с трендами все понятно, но насколько они окажутся устойчивыми? Судя по тому, что популярность Apple продолжает расти, стоит ожидать, что 2015 год пройдет также под флагом яблока. А что касается HTML5 и CSS3, данные стандарты доказали свою эффективность и стали своеобразными брендами в мире веб-разработки. Учитывая нарастающее напряжение в области патентов и авторского права, можно предположить, что открытые спецификации будут лишь набирать обороты и бурно развиваться.